-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy path_columns.scss
141 lines (124 loc) · 3.75 KB
/
_columns.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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
/* @author Bilal Cinarli */
/** -------------------------------------------
Columns Related Mixins
------------------------------------------- **/
/**
* CSS Columns
*
* Outputs CSS3 Columns with defined prefixes
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/columns
* Formal syntax: <'column-width'> || <'column-count'>
* current spec, except IE, all browsers need vendor prefix either -moz or -webkit
*/
@mixin columns($content...){
@include prefixer(columns, $content);
}
/**
* CSS Column Count
*
* Outputs CSS3 Column Count
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-count
* Formal syntax: <number> | auto
* current spec, except IE, all browsers need vendor prefix either -moz or -webkit
*/
@mixin column-count($number){
@include prefixer(column-count, $number);
}
/**
* CSS Column Width
*
* Outputs CSS3 Column Width
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-width
* Formal syntax: <length> | auto
* current spec, except IE, all browsers need vendor prefix either -moz or -webkit
*/
@mixin column-width($width){
@include prefixer(column-width, $width);
}
/**
* CSS Column Gap
*
* Outputs CSS3 Column Gap
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-gap
* Formal syntax: <length> | normal
* current spec, except IE, all browsers need vendor prefix either -moz or -webkit
*/
@mixin column-gap($gap){
@include prefixer(column-gap, $gap);
}
/**
* CSS Column Rule
*
* Outputs CSS3 Column Rule, shorthand definition for column rule styles
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-rule
* Formal syntax: <'column-rule-width'> || <'column-rule-style'> || <'column-rule-color'>
* current spec, except IE, all browsers need vendor prefix either -moz or -webkit
*/
@mixin column-rule($rule){
@include prefixer(column-rule, $rule);
}
/**
* CSS Column Rule Color
*
* Outputs CSS3 Column Rule Color
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-rule-color
* Formal syntax: <color>
* current spec, except IE, all browsers need vendor prefix either -moz or -webkit
*/
@mixin column-rule-color($color){
@include prefixer(column-rule-color, $color);
}
/**
* CSS Column Rule Style
*
* Outputs CSS3 Column Rule Style
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-rule-style
* Formal syntax: <style>
* current spec, except IE, all browsers need vendor prefix either -moz or -webkit
*/
@mixin column-rule-style($style){
@include prefixer(column-rule-style, $style);
}
/**
* CSS Column Rule Width
*
* Outputs CSS3 Column Rule Width
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-rule-width
* Formal syntax: <br-width>
* Available values: thin || medium || thick || number px || number em
* current spec, except IE, all browsers need vendor prefix either -moz or -webkit
*/
@mixin column-rule-width($width){
@include prefixer(column-rule-width, $width);
}
/**
* CSS Column Span
*
* Outputs CSS3 Column Span
* http://caniuse.com/#search=column
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-span
* Formal syntax: none | all
* Currently, except firefox, all vendors supporting this feature. Webkit browsers need prefix
*/
@mixin column-span($span){
@include prefixer(column-span, $span, webkit);
}
/**
* CSS Column Fill
*
* Outputs CSS3 Column Fill
* https://developer.mozilla.org/en-US/docs/Web/CSS/column-fill
* Formal syntax: auto | balance
* Currently only firefox supports
*/
@mixin column-fill($fill){
@include prefixer(column-fill, $fill);
}