-
Notifications
You must be signed in to change notification settings - Fork 28
/
_mixins.scss
38 lines (33 loc) · 1.27 KB
/
_mixins.scss
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
// DEPENDENCIES
@import "functions"; // import _functions
// SASS Transcription of Skeleton Framework
// @license MIT <http://www.opensource.org/licenses/mit-license.php>
// @author Dennis Thompson <http://www.atomicpages.net/>
// @copyright Copyright 2013, Dennis Thompson
// This file is meant for all of your custom mixins.
// ---- MIXINS ----
@mixin linkStyle($color, $decoration: underline) {
color: $color;
text-decoration: $decoration;
&:hover { text-decoration: none; }
}
// TODO: Allow for fluid grids
@mixin makeGrid($width: getWidth(), $column_width: getColWidth(), $gutter_width: getGutterWidth(), $columns: getCols(), $fixed: getFixed()) {
@for $i from 1 through $columns {
@if $i == 1 {
.container .one.column,
.container .one.columns { width: $column_width; }
} @else {
// a_n = 40 + (60 (n - 1))
.container .#{getWordFromNum($i)}.columns { width: $column_width + (($column_width + $gutter_width) * ($i - 1)); }
}
}
.container .one-third.column { width: round($width * (1/3)) - $gutter_width ; }
.container .two-thirds.column { width: round($width * (2/3)) - $gutter_width; }
/* Offsets */
@for $i from 1 through $columns {
@if $i < $columns {
.container .offset-by-#{getWordFromNum($i)} { width: ($column_width + $gutter_width) * $i; }
}
}
}