framous 0.2.5 → 0.3

Sign up to get free protection for your applications and to get access to all the features.
@@ -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
- }