cosy-jekyll-theme 1.0.5 → 1.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
data/_sass/_mixins.scss CHANGED
@@ -65,9 +65,9 @@
65
65
  line-height: 0 + round($doc-line-height / $size*10000) / 10000;
66
66
  }
67
67
 
68
- @mixin text-overflow() {
68
+ @mixin text-overflow($type: ellipsis) {
69
69
  overflow: hidden;
70
- text-overflow: ellipsis;
70
+ text-overflow: $type;
71
71
  white-space: nowrap;
72
72
  }
73
73
 
@@ -76,42 +76,42 @@
76
76
 
77
77
  @mixin horizontal($startColor : $white, $endColor : $lightergrey) {
78
78
  background-color: $endColor;
79
- background-image : -webkit-gradient(linear, 0 0, 100% 0, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
80
- background-image : -webkit-linear-gradient(left, $startColor, $endColor); // Safari 5.1+, Chrome 10+
81
- background-image : -moz-linear-gradient(left, $startColor, $endColor); // FF 3.6+
82
- background-image : -ms-linear-gradient(left, $startColor, $endColor); // IE10
83
- background-image : -o-linear-gradient(left, $startColor, $endColor); // Opera 11.10
84
- background-image : linear-gradient(left, $startColor, $endColor); // W3C
85
- background-repeat : repeat-x;
79
+ background-image: -webkit-gradient(linear, 0 0, 100% 0, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
80
+ background-image: -webkit-linear-gradient(left, $startColor, $endColor); // Safari 5.1+, Chrome 10+
81
+ background-image: -moz-linear-gradient(left, $startColor, $endColor); // FF 3.6+
82
+ background-image: -ms-linear-gradient(left, $startColor, $endColor); // IE10
83
+ background-image: -o-linear-gradient(left, $startColor, $endColor); // Opera 11.10
84
+ background-image: linear-gradient(left, $startColor, $endColor); // W3C
85
+ background-repeat: repeat-x;
86
86
  }
87
87
 
88
88
  @mixin vertical($startColor : $white, $endColor: $lightergrey) {
89
- background-image : -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
90
- background-image : -webkit-linear-gradient(top, $startColor, $endColor); // Safari 5.1+, Chrome 10+
91
- background-color : $endColor;
92
- background-image : -moz-linear-gradient(top, $startColor, $endColor); // FF 3.6+
93
- background-image : -ms-linear-gradient(top, $startColor, $endColor); // IE10
94
- background-image : -o-linear-gradient(top, $startColor, $endColor); // Opera 11.10
95
- background-image : linear-gradient(top, $startColor, $endColor); // W3C
96
- background-repeat : repeat-x;
89
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
90
+ background-image: -webkit-linear-gradient(top, $startColor, $endColor); // Safari 5.1+, Chrome 10+
91
+ background-color: $endColor;
92
+ background-image: -moz-linear-gradient(top, $startColor, $endColor); // FF 3.6+
93
+ background-image: -ms-linear-gradient(top, $startColor, $endColor); // IE10
94
+ background-image: -o-linear-gradient(top, $startColor, $endColor); // Opera 11.10
95
+ background-image: linear-gradient(top, $startColor, $endColor); // W3C
96
+ background-repeat: repeat-x;
97
97
  }
98
98
 
99
99
  @mixin directional($startColor : $white, $endColor : $lightergrey, $deg : 45deg) {
100
- background-color : $endColor;
101
- background-image : -moz-linear-gradient($deg, $startColor, $endColor); // FF 3.6+
102
- background-image : -ms-linear-gradient($deg, $startColor, $endColor); // IE10
103
- background-image : -webkit-linear-gradient($deg, $startColor, $endColor); // Safari 5.1+, Chrome 10+
104
- background-image : -o-linear-gradient($deg, $startColor, $endColor); // Opera 11.10
105
- background-image : linear-gradient($deg, $startColor, $endColor); // W3C
106
- background-repeat : repeat-x;
100
+ background-color: $endColor;
101
+ background-image: -moz-linear-gradient($deg, $startColor, $endColor); // FF 3.6+
102
+ background-image: -ms-linear-gradient($deg, $startColor, $endColor); // IE10
103
+ background-image: -webkit-linear-gradient($deg, $startColor, $endColor); // Safari 5.1+, Chrome 10+
104
+ background-image: -o-linear-gradient($deg, $startColor, $endColor); // Opera 11.10
105
+ background-image: linear-gradient($deg, $startColor, $endColor); // W3C
106
+ background-repeat: repeat-x;
107
107
  }
108
108
 
109
109
  // .bordered(COLOR, COLOR, COLOR, COLOR);
110
110
  @mixin bordered($top-color: #eee, $right-color: #eee, $bottom-color: #eee, $left-color: #eee) {
111
- border-top : solid 1px $top-color;
112
- border-left : solid 1px $left-color;
113
- border-right : solid 1px $right-color;
114
- border-bottom : solid 1px $bottom-color;
111
+ border-top: solid 1px $top-color;
112
+ border-left: solid 1px $left-color;
113
+ border-right: solid 1px $right-color;
114
+ border-bottom: solid 1px $bottom-color;
115
115
  }
116
116
 
117
117
  // ROUND CORNERS
@@ -119,47 +119,47 @@
119
119
 
120
120
  // .rounded(VALUE);
121
121
  @mixin rounded($radius:4px) {
122
- -webkit-border-radius : $radius;
123
- -moz-border-radius : $radius;
124
- border-radius : $radius;
122
+ -webkit-border-radius: $radius;
123
+ -moz-border-radius: $radius;
124
+ border-radius: $radius;
125
125
  }
126
126
 
127
127
  // .border-radius(VALUE,VALUE,VALUE,VALUE);
128
128
  @mixin border-radius($topright: 0, $bottomright: 0, $bottomleft: 0, $topleft: 0) {
129
- -webkit-border-top-right-radius : $topright;
130
- -webkit-border-bottom-right-radius : $bottomright;
131
- -webkit-border-bottom-left-radius : $bottomleft;
132
- -webkit-border-top-left-radius : $topleft;
133
- -moz-border-radius-topright : $topright;
134
- -moz-border-radius-bottomright : $bottomright;
135
- -moz-border-radius-bottomleft : $bottomleft;
136
- -moz-border-radius-topleft : $topleft;
137
- border-top-right-radius : $topright;
138
- border-bottom-right-radius : $bottomright;
139
- border-bottom-left-radius : $bottomleft;
140
- border-top-left-radius : $topleft;
141
- -webkit-background-clip : padding-box;
142
- -moz-background-clip : padding;
143
- background-clip : padding-box;
129
+ -webkit-border-top-right-radius: $topright;
130
+ -webkit-border-bottom-right-radius: $bottomright;
131
+ -webkit-border-bottom-left-radius: $bottomleft;
132
+ -webkit-border-top-left-radius: $topleft;
133
+ -moz-border-radius-topright: $topright;
134
+ -moz-border-radius-bottomright: $bottomright;
135
+ -moz-border-radius-bottomleft: $bottomleft;
136
+ -moz-border-radius-topleft: $topleft;
137
+ border-top-right-radius: $topright;
138
+ border-bottom-right-radius: $bottomright;
139
+ border-bottom-left-radius: $bottomleft;
140
+ border-top-left-radius: $topleft;
141
+ -webkit-background-clip: padding-box;
142
+ -moz-background-clip: padding;
143
+ background-clip: padding-box;
144
144
  }
145
145
 
146
146
  // .box-shadow(HORIZONTAL VERTICAL BLUR COLOR))
147
147
  @mixin box-shadow($shadow: 0 1px 3px rgba(0,0,0,.25)) {
148
- -webkit-box-shadow : $shadow;
149
- -moz-box-shadow : $shadow;
150
- box-shadow : $shadow;
148
+ -webkit-box-shadow: $shadow;
149
+ -moz-box-shadow: $shadow;
150
+ box-shadow: $shadow;
151
151
  }
152
152
 
153
153
  // .drop-shadow(HORIZONTAL, VERTICAL, BLUR, ALPHA);
154
154
  @mixin drop-shadow($x-axis: 0, $y-axis: 1px, $blur: 2px, $alpha: 0.1) {
155
- -webkit-box-shadow : $x-axis $y-axis $blur rgba(0, 0, 0, $alpha);
156
- -moz-box-shadow : $x-axis $y-axis $blur rgba(0, 0, 0, $alpha);
157
- box-shadow : $x-axis $y-axis $blur rgba(0, 0, 0, $alpha);
155
+ -webkit-box-shadow: $x-axis $y-axis $blur rgba(0, 0, 0, $alpha);
156
+ -moz-box-shadow: $x-axis $y-axis $blur rgba(0, 0, 0, $alpha);
157
+ box-shadow: $x-axis $y-axis $blur rgba(0, 0, 0, $alpha);
158
158
  }
159
159
 
160
160
  // .text-shadow();
161
161
  @mixin text-shadow($shadow: 0 2px 3px rgba(0,0,0,.25)) {
162
- text-shadow : $shadow;
162
+ text-shadow: $shadow;
163
163
  }
164
164
 
165
165
  // TRANSFORMATIONS
@@ -167,61 +167,69 @@
167
167
 
168
168
  // .rotate(VALUEdeg);
169
169
  @mixin rotate($deg) {
170
- -webkit-transform : rotate($deg);
171
- -moz-transform : rotate($deg);
172
- -ms-transform : rotate($deg);
173
- -o-transform : rotate($deg);
174
- transform : rotate($deg);
170
+ -webkit-transform: rotate($deg);
171
+ -moz-transform: rotate($deg);
172
+ -ms-transform: rotate($deg);
173
+ -o-transform: rotate($deg);
174
+ transform: rotate($deg);
175
175
  }
176
176
 
177
177
  // .scale(VALUE);
178
178
  @mixin scale($ratio) {
179
- -webkit-transform : scale($ratio);
180
- -moz-transform : scale($ratio);
181
- -ms-transform : scale($ratio);
182
- -o-transform : scale($ratio);
183
- transform : scale($ratio);
179
+ -webkit-transform: scale($ratio);
180
+ -moz-transform: scale($ratio);
181
+ -ms-transform: scale($ratio);
182
+ -o-transform: scale($ratio);
183
+ transform: scale($ratio);
184
+ }
185
+
186
+ @mixin transform($value) {
187
+ -webkit-transform: $value;
188
+ -moz-transform: $value;
189
+ -ms-transform: $value;
190
+ -o-transform: $value;
191
+ transform: $value;
184
192
  }
185
193
 
186
194
  // .skew(VALUE, VALUE);
187
195
  @mixin skew($x: 0, $y: 0) {
188
- -webkit-transform : skew($x, $y);
189
- -moz-transform : skew($x, $y);
190
- -ms-transform : skew($x, $y);
191
- -o-transform : skew($x, $y);
192
- transform : skew($x, $y);
196
+ -webkit-transform: skew($x, $y);
197
+ -moz-transform: skew($x, $y);
198
+ -ms-transform: skew($x, $y);
199
+ -o-transform: skew($x, $y);
200
+ transform: skew($x, $y);
193
201
  }
194
202
 
195
203
  // .transition(PROPERTY DURATION DELAY(OPTIONAL) TIMING-FINCTION);
196
204
  @mixin transition($transition) {
197
- -webkit-transition : $transition;
198
- -moz-transition : $transition;
199
- -ms-transition : $transition;
200
- -o-transition : $transition;
201
- transition : $transition;
205
+ -webkit-transition: $transition;
206
+ -moz-transition: $transition;
207
+ -ms-transition: $transition;
208
+ -o-transition: $transition;
209
+ transition: $transition;
202
210
  }
203
211
 
204
212
  // .translate(VALUE, VALUE)
205
213
  @mixin translate($x: 0, $y: 0) {
206
- -webkit-transform : translate($x, $y);
207
- -moz-transform : translate($x, $y);
208
- -ms-transform : translate($x, $y);
209
- -o-transform : translate($x, $y);
210
- transform : translate($x, $y);
214
+ -webkit-transform: translate($x, $y);
215
+ -moz-transform: translate($x, $y);
216
+ -ms-transform: translate($x, $y);
217
+ -o-transform: translate($x, $y);
218
+ transform: translate($x, $y);
211
219
  }
212
220
 
213
221
  @mixin translate3d($x: 0, $y: 0, $z: 0) {
214
- -webkit-transform : translate($x, $y, $z);
215
- -moz-transform : translate($x, $y, $z);
216
- -ms-transform : translate($x, $y, $z);
217
- -o-transform : translate($x, $y, $z);
218
- transform : translate($x, $y, $z);
222
+ -webkit-transform: translate($x, $y, $z);
223
+ -moz-transform: translate($x, $y, $z);
224
+ -ms-transform: translate($x, $y, $z);
225
+ -o-transform: translate($x, $y, $z);
226
+ transform: translate($x, $y, $z);
219
227
  }
220
228
 
221
229
  @mixin animation($name, $duration: 300ms, $delay: 0, $ease: ease) {
222
230
  -webkit-animation: $name $duration $delay $ease;
223
- -moz-animation: $name $duration $delay $ease;
224
- -ms-animation: $name $duration $delay $ease;
231
+ -moz-animation: $name $duration $delay $ease;
232
+ -ms-animation: $name $duration $delay $ease;
225
233
  }
226
234
 
227
235
  // BACKGROUND
@@ -229,44 +237,45 @@
229
237
 
230
238
  // .background-alpha(VALUE VALUE);
231
239
  @mixin background-alpha($color: $white, $alpha: 1) {
232
- background-color : hsla(hue($color), saturation($color), lightness($color), $alpha);
240
+ background-color: hsla(hue($color), saturation($color), lightness($color), $alpha);
233
241
  }
234
242
 
235
243
  // .background-size(VALUE VALUE);
236
- @mixin background-size($size){
237
- -webkit-background-size : $size;
238
- -moz-background-size : $size;
239
- -o-background-size : $size;
240
- background-size : $size;
244
+ @mixin background-size($size) {
245
+ -webkit-background-size: $size;
246
+ -moz-background-size: $size;
247
+ -o-background-size: $size;
248
+ background-size: $size;
241
249
  }
242
250
 
243
251
  // .background-clip(VALUE); (border-box, padding-box, content-box)
244
252
  @mixin background-clip($clip) {
245
- -webkit-background-clip : $clip;
246
- -moz-background-clip : $clip;
247
- background-clip : $clip;
253
+ -webkit-background-clip: $clip;
254
+ -moz-background-clip: $clip;
255
+ background-clip: $clip;
248
256
  }
249
257
 
250
258
  // .box-sizing(VALUE); (border-box, padding-box, content-box)
251
259
  @mixin box-sizing($boxsize: border-box) {
252
- -webkit-box-sizing : $boxsize;
253
- -moz-box-sizing : $boxsize;
254
- -ms-box-sizing : $boxsize;
255
- box-sizing : $boxsize;
260
+ -webkit-box-sizing: $boxsize;
261
+ -moz-box-sizing: $boxsize;
262
+ -ms-box-sizing: $boxsize;
263
+ box-sizing: $boxsize;
256
264
  }
257
265
 
258
266
  // For image replacement
259
267
  @mixin hide-text() {
260
- text-indent : 100%;
261
- white-space : nowrap;
262
- overflow : hidden;
268
+ text-indent: 100%;
269
+ white-space: nowrap;
270
+ overflow: hidden;
263
271
  }
264
272
 
265
273
  // Hide from visual and speaking browsers
266
274
  @mixin hidden() {
267
- display : none !important;
268
- visibility : hidden;
275
+ display: none !important;
276
+ visibility: hidden;
269
277
  }
278
+
270
279
  .hidden {
271
280
  display: none;
272
281
  visibility: hidden;
@@ -274,43 +283,43 @@
274
283
 
275
284
  // Hide but maintain layout
276
285
  @mixin invisible() {
277
- visibility : hidden;
286
+ visibility: hidden;
278
287
  }
279
288
 
280
289
  // .resize(VALUE) (none, both, horizontal, vertical, inherit)
281
290
  @mixin resize($direction: both) {
282
- resize : $direction;
283
- overflow : auto;
291
+ resize: $direction;
292
+ overflow: auto;
284
293
  }
285
294
 
286
295
  // .userselect(VALUE) (all, element, none, text)
287
296
  @mixin user-select($select) {
288
- -webkit-user-select : $select;
289
- -moz-user-select : $select;
290
- -o-user-select : $select;
291
- user-select : $select;
297
+ -webkit-user-select: $select;
298
+ -moz-user-select: $select;
299
+ -o-user-select: $select;
300
+ user-select: $select;
292
301
  }
293
302
 
294
303
  // Hidden but available to speaking browsers
295
304
  @mixin visuallyhidden() {
296
- overflow : hidden;
297
- position : absolute;
298
- clip : rect(0 0 0 0);
299
- height : 1px;
300
- width : 1px;
301
- margin : -1px;
302
- padding : 0;
303
- border : 0;
305
+ overflow: hidden;
306
+ position: absolute;
307
+ clip: rect(0 0 0 0);
308
+ height: 1px;
309
+ width: 1px;
310
+ margin: -1px;
311
+ padding: 0;
312
+ border: 0;
304
313
  }
305
314
 
306
315
  // Make visuallyhidden focusable with a keyboard
307
316
  .visuallyhidden.focusable:active,
308
317
  .visuallyhidden.focusable:focus {
309
- position : static;
310
- clip : auto;
311
- height : auto;
312
- width : auto;
313
- margin : 0;
318
+ position: static;
319
+ clip: auto;
320
+ height: auto;
321
+ width: auto;
322
+ margin: 0;
314
323
  overflow: visible;
315
324
  }
316
325
 
@@ -359,7 +368,6 @@
359
368
  align-items: $value;
360
369
  }
361
370
 
362
-
363
371
  @mixin flex-direction($value: row) {
364
372
  @if $value == row-reverse {
365
373
  -webkit-box-direction: reverse;