sass_compass_unleashed/presentation/07_inheiritance.slides
2012-03-21 13:09:22 -04:00

51 lines
699 B
Plaintext

!SLIDE
# Inheritance
!SLIDE
# Inception rule!
<img src="/assets/InceptionArch_Slusher.jpg" width='800px'>
!SLIDE
<img src='/assets/36kou7.jpg' height='600px'>
!SLIDE
## Well you can but it gets messy
``` scss
.foo {
width: 5px;
.bar {
height: 20px;
.baz {
color : red;
.what-comes-after-baz {
border : green solid 1px;
&.something {
@extend .float-left;
}
}
}
}
}
```
!SLIDE
# And slow
!SLIDE
## Selector layout
``` scss
.release_title a{
@extend h3;
@include adjust-font-size-to(20px, 1);
@include trailer;
text-decoration : none;
display : block;
&:hover {
color:$hover-color;
}
}
```