framous 0.2.5 → 0.3

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.
@@ -1,42 +0,0 @@
1
- //
2
- // Settings.scss
3
- //
4
-
5
- //
6
- // 1. Responsive Grid
7
- //
8
-
9
- // Column width
10
- $column: 145px !default;
11
- // Gutter between each two columns
12
- $gutter: 9px !default;
13
- // Total number of columns in the grid (Total Columns For Main Container)
14
- $grid-columns: 12 !default;
15
- // Max-width of the outer container
16
- $max-width: 1024px !default;
17
- // Makes all elements have a border-box layout
18
- $border-box-sizing: true !default;
19
- // Default @media feature for the breakpoint() mixin
20
- $default-feature: min-width;
21
-
22
- //
23
- // 2. Responsive Breakpoints
24
- // @see http://css-tricks.com/snippets/css/media-queries-for-standard-devices
25
- //
26
-
27
- // Small screens
28
- $small: min-width 320px max-width 479px !default;
29
- // Smartphones (portrait)
30
- $phone-portrait: max-device-width 320px !default;
31
- // Smartphones (landscape)
32
- $phone-landscape: max-device-width 480px !default;
33
- // iPads (portrait and landscape)
34
- $medium: min-device-width 768px !default;
35
- // iPads (portrait)
36
- $ipad-portrait: max-device-width 768px orientation portrait !default;
37
- // iPads (landscape)
38
- $ipad-landscape: max-device-width 1024px orientation landscape !default;
39
- // Desktops and laptops
40
- $desktop: min-width 1024px !default;
41
- // iPhone 4
42
- $retina: -webkit-min-device-pixel-ratio 1.5 min-device-pixel-ratio 1.5 !default;
@@ -1,9 +0,0 @@
1
- //
2
- // Framous-mixins.scss
3
- // Based on http://bourbon.io/
4
- //
5
-
6
- @import "hidpi-media-query";
7
- @import "linear-gradient";
8
- @import "position";
9
- @import "image-rendering";
@@ -1,22 +0,0 @@
1
- //
2
- // HI DPI Media Query.scss
3
- //
4
-
5
- // HiDPI mixin. Default value set to 1.3 to target Google Nexus 7 (http://bjango.com/articles/min-device-pixel-ratio/)
6
- @mixin image-2x($image, $width, $height) {
7
- @media (min--moz-device-pixel-ratio: 1.3),
8
- (-o-min-device-pixel-ratio: 2.6/2),
9
- (-webkit-min-device-pixel-ratio: 1.3),
10
- (min-device-pixel-ratio: 1.3),
11
- (min-resolution: 1.3dppx) {
12
- /* on retina, use image that's scaled by 2 */
13
- background-image: url($image);
14
- background-size: $width $height;
15
- }
16
- }
17
-
18
- // Here's an example
19
- // div.logo {
20
- // background: url("logo.png") no-repeat;
21
- // @include image-2x("logo2x.png", 100px, 25px);
22
- // }
@@ -1,17 +0,0 @@
1
- //
2
- // Image Rendering
3
- //
4
-
5
- @mixin image-rendering ($mode:optimizeQuality) {
6
-
7
- @if ($mode == optimize-contrast) {
8
- image-rendering: -moz-crisp-edges;
9
- image-rendering: -o-crisp-edges;
10
- image-rendering: -webkit-optimize-contrast;
11
- image-rendering: optimize-contrast;
12
- }
13
-
14
- @else {
15
- image-rendering: $mode;
16
- }
17
- }
@@ -1,47 +0,0 @@
1
- //
2
- // Linear Gradient.scss
3
- //
4
-
5
- @mixin linear-gradient($pos, $G1, $G2: false,
6
- $G3: false, $G4: false,
7
- $G5: false, $G6: false,
8
- $G7: false, $G8: false,
9
- $G9: false, $G10: false,
10
- $deprecated-pos1: left top,
11
- $deprecated-pos2: left bottom,
12
- $fallback: false) {
13
- // Detect what type of value exists in $pos
14
- $pos-type: type-of(nth($pos, 1));
15
-
16
- // If $pos is missing from mixin, reassign vars and add default position
17
- @if ($pos-type == color) or (nth($pos, 1) == "transparent") {
18
- $G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
19
- $G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
20
- $pos: top; // Default position
21
- }
22
-
23
- $full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
24
-
25
- // Set $G1 as the default fallback color
26
- $fallback-color: nth($G1, 1);
27
-
28
- // If $fallback is a color use that color as the fallback color
29
- @if (type-of($fallback) == color) or ($fallback == "transparent") {
30
- $fallback-color: $fallback;
31
- }
32
-
33
- background-color: $fallback-color;
34
- background-image: deprecated-webkit-gradient(linear, $deprecated-pos1, $deprecated-pos2, $full); // Safari <= 5.0
35
- background-image: -webkit-linear-gradient($pos, $full); // Safari 5.1+, Chrome
36
- background-image: -moz-linear-gradient($pos, $full);
37
- background-image: -ms-linear-gradient($pos, $full);
38
- background-image: -o-linear-gradient($pos, $full);
39
- background-image: unquote("linear-gradient(#{$pos}, #{$full})");
40
- }
41
-
42
-
43
- // Usage: Gradient position is optional, default is top. Position can be a degree. Color stops are optional as well.
44
- // @include linear-gradient(#1e5799, #2989d8);
45
- // @include linear-gradient(#1e5799, #2989d8, $fallback:#2989d8);
46
- // @include linear-gradient(top, #1e5799 0%, #2989d8 50%);
47
- // @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
@@ -1,46 +0,0 @@
1
- //
2
- // Postion.scss
3
- //
4
-
5
- @mixin position ($position: relative, $coordinates: 0 0 0 0) {
6
-
7
- @if type-of($position) == list {
8
- $coordinates: $position;
9
- $position: relative;
10
- }
11
-
12
- $top: nth($coordinates, 1);
13
- $right: nth($coordinates, 2);
14
- $bottom: nth($coordinates, 3);
15
- $left: nth($coordinates, 4);
16
-
17
- position: $position;
18
-
19
- @if $top == auto {
20
- top: $top;
21
- }
22
- @else if not(unitless($top)) {
23
- top: $top;
24
- }
25
-
26
- @if $right == auto {
27
- right: $right;
28
- }
29
- @else if not(unitless($right)) {
30
- right: $right;
31
- }
32
-
33
- @if $bottom == auto {
34
- bottom: $bottom;
35
- }
36
- @else if not(unitless($bottom)) {
37
- bottom: $bottom;
38
- }
39
-
40
- @if $left == auto {
41
- left: $left;
42
- }
43
- @else if not(unitless($left)) {
44
- left: $left;
45
- }
46
- }
@@ -1,83 +0,0 @@
1
- //
2
- // Settings.scss
3
- //
4
-
5
- // Text Direction Settings
6
-
7
- $text-direction: ltr;
8
- $default-float: left;
9
- $default-opposite: right;
10
-
11
- @if $text-direction == ltr {
12
- $default-float: left;
13
- $default-opposite: right;
14
- } @else {
15
- $default-float: right;
16
- $default-opposite: left;
17
- }
18
-
19
- // Responsive Grid
20
-
21
- // Column width
22
- $column: 145px;
23
- // Gutter between each two columns
24
- $gutter: 36px;
25
- // Total number of columns in the grid (Total Columns For Main Container)
26
- $grid-columns: 12;
27
- // Max-width of the outer container
28
- $max-width: 1024px;
29
- // Makes all elements have a border-box layout
30
- $border-box-sizing: true;
31
-
32
- // Colors Settings
33
- // Branding Colors
34
-
35
- $white-set: #fff;
36
- $blue-set: #174374;
37
- $grey-set: #808080;
38
- $grey-dark-set: #333;
39
- $black-set: #000;
40
-
41
- $background-body-color: $white-set;
42
- $main-color: $grey-dark-set;
43
- $txt-color: $grey-dark-set;
44
- $highlight-color: #ffff99;
45
-
46
- $background-color: lighten($grey-set,45);
47
-
48
- $link-color: $blue-set;
49
- $link-color-hover: darken($blue-set,10);
50
-
51
- $border-color: lighten($grey-set,35);
52
- $border-color-hover: $grey-set;
53
-
54
- // Font Settings
55
-
56
- $georgia: Georgia, "Times New Roman", "DejaVu Serif", serif;
57
- $helvetica: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
58
- $open-sans: 'Open Sans', sans-serif;
59
- $gentium-book: 'Gentium Book Basic', serif;
60
- $droid-serif: 'Droid Serif', serif;
61
-
62
- $header-font-family: $droid-serif;
63
- $header-font-weight: bold;
64
- $header-font-color: $black-set;
65
- $body-font-family: $georgia;
66
- $body-font-weight: normal;
67
- $body-font-color: $txt-color;
68
-
69
- // Modular Scale Settings
70
- // Ratios
71
-
72
- $golden: 1.618;
73
- $ratio: $golden;
74
-
75
- // $ratio: $golden; // THIS IS DEFAULT IN MODULAR-SCALE
76
- $base-font-size: 14px;
77
- $important-mod-num: 44px;
78
- $base-size: $base-font-size $important-mod-num;
79
- $base-line-height: 20px;
80
- // Produced the following list of values: 14, 17, 23, 27, 37, 44, 59, 71, 95, 115;
81
- // http://www.modularscale.com by Tim Brown
82
- // Results : http://modularscale.com/scale/?px1=14&px2=44&ra1=1.618&ra2=0
83
- // https://github.com/scottkellum/modular-scale by scottkellum
@@ -1,21 +0,0 @@
1
- //
2
- // Print.scss
3
- // @credits : HTML5 Boilerplate
4
- //
5
-
6
- @media print {
7
-
8
- * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; } /* Black prints faster: h5bp.com/s */
9
- a, a:visited { text-decoration: underline; }
10
- a[href]:after { content: " (" attr(href) ")"; }
11
- abbr[title]:after { content: " (" attr(title) ")"; }
12
- .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
13
- pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
14
- thead { display: table-header-group; } /* h5bp.com/t */
15
- tr, img { page-break-inside: avoid; }
16
- img { max-width: 100% !important; }
17
- @page { margin: 0.5cm; }
18
- p, h2, h3 { orphans: 3; widows: 3; }
19
- h2, h3 { page-break-after: avoid; }
20
-
21
- }
@@ -1,410 +0,0 @@
1
- //
2
- // Reset partial
3
- // @credits http://github.com/necolas/normalize.css
4
- //
5
-
6
- // Add Compass' IE and vendor prefix support variables.
7
- @import "compass/support";
8
- @import "compass/reset/utilities";
9
-
10
- // HTML5 display definitions
11
-
12
- // Corrects block display not defined in IE6/7/8/9 & FF3
13
-
14
- article,
15
- aside,
16
- details,
17
- figcaption,
18
- figure,
19
- footer,
20
- header,
21
- hgroup,
22
- nav,
23
- section,
24
- summary {
25
- display: block;
26
- }
27
-
28
- // Corrects inline-block display not defined in IE6/7/8/9 & FF3
29
-
30
- audio,
31
- canvas,
32
- video {
33
- display: inline-block;
34
- @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
35
- *display: inline;
36
- *zoom: 1;
37
- }
38
- }
39
-
40
- // Prevents modern browsers from displaying 'audio' without controls
41
- // Remove excess height in iOS5 devices
42
-
43
- audio:not([controls]) {
44
- display: none;
45
- height: 0;
46
- }
47
-
48
- // Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4
49
- // Known issue: no IE6 support
50
-
51
- [hidden] {
52
- display: none;
53
- }
54
-
55
-
56
- // Base
57
-
58
- // 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
59
- // http://clagnut.com/blog/348/#c790
60
- // 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
61
- // www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
62
-
63
- html {
64
- font-size: 100%; /* 1 */
65
- -webkit-text-size-adjust: 100%; /* 2 */
66
- -ms-text-size-adjust: 100%; /* 2 */
67
- }
68
-
69
- // Addresses font-family inconsistency between 'textarea' and other form elements.
70
-
71
- html,
72
- button,
73
- input,
74
- select,
75
- textarea {
76
- font-family: sans-serif;
77
- }
78
-
79
- // Addresses margins handled incorrectly in IE6/7
80
-
81
- body {
82
- margin: 0;
83
- }
84
-
85
- // Links
86
-
87
- // Addresses outline displayed oddly in Chrome
88
-
89
- a:focus {
90
- outline: thin dotted;
91
- }
92
-
93
- // Improves readability when focused and also mouse hovered in all browsers
94
- // people.opera.com/patrickl/experiments/keyboard/test
95
-
96
- a:hover,
97
- a:active {
98
- outline: 0;
99
- }
100
-
101
- // Typography
102
-
103
- // Addresses font sizes and margins set differently in IE6/7
104
- // Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5
105
-
106
- h1 {
107
- font-size: 2em;
108
- margin: 0.67em 0;
109
- }
110
-
111
- // Addresses styling not present in IE7/8/9, S5, Chrome
112
-
113
- abbr[title],
114
- dfn[title] {
115
- border-bottom: 1px dotted;
116
- cursor: help;
117
- white-space: nowrap;
118
- }
119
-
120
- // Addresses style set to 'bolder' in FF3+, S4/5, Chrome
121
-
122
- b,
123
- strong {
124
- font-weight: bold;
125
- }
126
-
127
- blockquote {
128
- margin: 1em 40px;
129
- }
130
-
131
- // Addresses styling not present in S5, Chrome
132
-
133
- dfn {
134
- font-style: italic;
135
- }
136
-
137
- // Addresses styling not present in IE6/7/8/9
138
-
139
- mark {
140
- background: #ff0;
141
- color: #000;
142
- }
143
-
144
- // Addresses margins set differently in IE6/7
145
-
146
- p,
147
- pre {
148
- margin: 1em 0;
149
- }
150
-
151
- // Corrects font family set oddly in IE6, S4/5, Chrome
152
- // en.wikipedia.org/wiki/User:Davidgothberg/Test59
153
-
154
- pre,
155
- code,
156
- kbd,
157
- samp,
158
- tt,
159
- var {
160
- background-color: $highlight-color;
161
- font-family: monospace, serif;
162
- @if $legacy-support-for-ie6 {
163
- _font-family: 'courier new', monospace;
164
- }
165
- font-size: 1em;
166
- }
167
-
168
- // Improves readability of pre-formatted text in all browsers
169
-
170
- pre {
171
- white-space: pre;
172
- white-space: pre-wrap;
173
- word-wrap: break-word;
174
- }
175
-
176
- // 1. Addresses CSS quotes not supported in IE6/7
177
- // 2. Addresses quote property not supported in S4
178
-
179
- q {
180
- @include reset-quotation;
181
- }
182
-
183
- small {
184
- font-size: 75%;
185
- }
186
-
187
- // Prevents sub and sup affecting line-height in all browsers
188
- // gist.github.com/413930
189
-
190
- sub,
191
- sup {
192
- font-size: 75%;
193
- line-height: 0;
194
- position: relative;
195
- vertical-align: baseline;
196
- }
197
-
198
- sup {
199
- top: -0.5em;
200
- }
201
-
202
- sub {
203
- bottom: -0.25em;
204
- }
205
-
206
-
207
- // Lists
208
-
209
- // Addresses margins set differently in IE6/7
210
-
211
- dl,
212
- menu,
213
- ol,
214
- ul {
215
- margin: 1em 0;
216
- }
217
-
218
- dd {
219
- margin: 0 0 0 40px;
220
- }
221
-
222
- // Addresses paddings set differently in IE6/7
223
-
224
- menu,
225
- ol,
226
- ul {
227
- padding: 0 0 0 40px;
228
- }
229
-
230
- // Corrects list images handled incorrectly in IE7
231
-
232
- nav ul,
233
- nav ol {
234
- @include reset-list-style;
235
- list-style-image: none;
236
- }
237
-
238
-
239
- // Embedded content
240
-
241
- // 1. Removes border when inside 'a' element in IE6/7/8/9, FF3
242
- // 2. Improves image quality when scaled in IE7
243
- // code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
244
-
245
- img {
246
- border: 0; /* 1 */
247
- -ms-interpolation-mode: bicubic; /* 2 */
248
- /* Responsive images */
249
- /* @todo Add responsive embedded video. */
250
- max-width: 100%;
251
- @if $legacy-support-for-ie6 {
252
- _width: 100%;
253
- }
254
- height: auto;
255
- vertical-align: middle;
256
- }
257
-
258
- // Corrects overflow displayed oddly in IE9
259
-
260
- svg:not(:root) {
261
- overflow: hidden;
262
- }
263
-
264
-
265
- // Figures
266
-
267
- // Addresses margin not present in IE6/7/8/9, S5, O11
268
-
269
- figure {
270
- margin: 0;
271
- }
272
-
273
-
274
- // Forms
275
-
276
- // Corrects margin displayed oddly in IE6/7
277
-
278
- form {
279
- margin: 0;
280
- }
281
-
282
- // Define consistent border, margin, and padding
283
-
284
- fieldset {
285
- border: 1px solid $grey-set;
286
- margin: 0;
287
- padding: 0.35em 0.625em 0.75em;
288
- }
289
-
290
- // Indicate that 'label' will shift focus to the associated form element
291
- label {
292
- cursor: pointer;
293
- }
294
-
295
- // 1. Corrects color not being inherited in IE6/7/8/9
296
- // 2. Corrects text not wrapping in FF3
297
- // 3. Corrects alignment displayed oddly in IE6/7
298
-
299
- legend {
300
- border: 0; /* 1 */
301
- padding: 0;
302
- white-space: normal; /* 2 */
303
- @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
304
- *margin-left: -7px; /* 3 */ /* LTR */
305
- }
306
- }
307
-
308
- // 1. Corrects font size not being inherited in all browsers
309
- // 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome
310
- // 3. Improves appearance and consistency in all browsers
311
-
312
- button,
313
- input,
314
- select,
315
- textarea {
316
- font-size: 100%; /* 1 */
317
- margin: 0; /* 2 */
318
- vertical-align: baseline; /* 3 */
319
- @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
320
- *vertical-align: middle; /* 3 */
321
- }
322
- }
323
-
324
- // Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
325
-
326
- button,
327
- input {
328
- line-height: normal; /* 1 */
329
- }
330
-
331
- // 1. Improves usability and consistency of cursor style between image-type 'input' and others
332
- // 2. Corrects inability to style clickable 'input' types in iOS
333
- // 3. Removes inner spacing in IE7 without affecting normal text inputs
334
- // Known issue: inner spacing remains in IE6
335
-
336
- button,
337
- input[type="button"],
338
- input[type="reset"],
339
- input[type="submit"] {
340
- cursor: pointer; /* 1 */
341
- -webkit-appearance: button; /* 2 */
342
- @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
343
- *overflow: visible; /* 3 */
344
- }
345
- }
346
-
347
- // Re-set default cursor for disabled elements
348
-
349
- button[disabled],
350
- input[disabled] {
351
- cursor: default;
352
- }
353
-
354
- // 1. Addresses box sizing set to content-box in IE8/9
355
- // 2. Removes excess padding in IE8/9
356
- // 3. Removes excess padding in IE7
357
- // Known issue: excess padding remains in IE6
358
-
359
- input[type="checkbox"],
360
- input[type="radio"] {
361
- box-sizing: border-box; /* 1 */
362
- padding: 0; /* 2 */
363
- @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
364
- *height: 13px; /* 3 */
365
- *width: 13px; /* 3 */
366
- }
367
- }
368
-
369
- // 1. Addresses appearance set to searchfield in S5, Chrome
370
- // 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof)
371
-
372
- input[type="search"] {
373
- -webkit-appearance: textfield; /* 1 */
374
- -moz-box-sizing: content-box;
375
- -webkit-box-sizing: content-box; /* 2 */
376
- box-sizing: content-box;
377
- }
378
-
379
- // Removes inner padding and search cancel button in S5, Chrome on OS X
380
-
381
- input[type="search"]::-webkit-search-decoration,
382
- input[type="search"]::-webkit-search-cancel-button {
383
- -webkit-appearance: none;
384
- }
385
-
386
- // Removes inner padding and border in FF3+
387
- // www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
388
-
389
- button::-moz-focus-inner,
390
- input::-moz-focus-inner {
391
- border: 0;
392
- padding: 0;
393
- }
394
-
395
- // 1. Removes default vertical scrollbar in IE6/7/8/9
396
- // 2. Improves readability and alignment in all browsers
397
-
398
- textarea {
399
- overflow: auto; /* 1 */
400
- vertical-align: top; /* 2 */
401
- }
402
-
403
-
404
- // Tables
405
-
406
- // Remove most spacing between table cells
407
-
408
- table {
409
- @include reset-table;
410
- }