2012-03-13 15:49:37 +00:00
|
|
|
!SLIDE variable-layout
|
|
|
|
# Variables Definitions
|
|
|
|
|
|
|
|
!SLIDE bad-variables
|
|
|
|
``` scss
|
2012-03-21 17:09:22 +00:00
|
|
|
$height : 2px;
|
2012-03-13 15:49:37 +00:00
|
|
|
// There are 100 lines before this
|
|
|
|
.content_head {
|
|
|
|
@include clearfix;
|
|
|
|
|
|
|
|
.hr {
|
|
|
|
padding-top : (rhythm(1) / 2) - $height;
|
|
|
|
width : 100%;
|
|
|
|
border-bottom : $height solid $secondary-accent-color;
|
|
|
|
margin-bottom : 10px;
|
|
|
|
display : block;
|
|
|
|
@extend .float-right;
|
|
|
|
}
|
|
|
|
|
|
|
|
.release_identifiers {
|
|
|
|
@extend .float-right;
|
|
|
|
text-align : right;
|
|
|
|
font-family : $ancillary-font;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
|
|
|
!SLIDE important
|
|
|
|
|
|
|
|
#Always define your variables at the top of each file!
|
|
|
|
|
|
|
|
!SLIDE big-list variable-why
|
|
|
|
|
|
|
|
* Easy to find
|
|
|
|
* Easy to update
|
2012-03-21 17:09:22 +00:00
|
|
|
* No surprises
|
2012-03-13 15:49:37 +00:00
|
|
|
|
|
|
|
!SLIDE
|
|
|
|
|
|
|
|
``` scss
|
2012-03-21 17:09:22 +00:00
|
|
|
/* Local Variables */
|
2012-03-13 15:49:37 +00:00
|
|
|
$release-content-height : rhythm(2);
|
2012-03-21 17:09:22 +00:00
|
|
|
$section-side-width : column-width(4) + $sidebar-width;
|
2012-03-13 15:49:37 +00:00
|
|
|
$group-image-height : rhythm(6);
|
|
|
|
|
2012-03-21 17:09:22 +00:00
|
|
|
.show {
|
2012-03-13 15:49:37 +00:00
|
|
|
h1 {
|
|
|
|
@include header(3);
|
|
|
|
@include trailer;
|
|
|
|
color : $primary-accent-color;
|
|
|
|
}
|
|
|
|
// ... goes on for 100+ lines
|
|
|
|
```
|