OLD | NEW |
1 // This file is part of website-defaults | 1 // This file is part of website-defaults |
2 // Copyright (C) 2016-present eyeo GmbH | 2 // Copyright (C) 2016-present eyeo GmbH |
3 // | 3 // |
4 // website-defaults is free software: you can redistribute it and/or | 4 // website-defaults is free software: you can redistribute it and/or |
5 // modify it under the terms of the GNU General Public License as published by | 5 // modify it under the terms of the GNU General Public License as published by |
6 // the Free Software Foundation, either version 3 of the License, or | 6 // the Free Software Foundation, either version 3 of the License, or |
7 // (at your option) any later version. | 7 // (at your option) any later version. |
8 // | 8 // |
9 // website-defaults is distributed in the hope that it will be useful, | 9 // website-defaults is distributed in the hope that it will be useful, |
10 // but WITHOUT ANY WARRANTY; without even the implied warranty of | 10 // but WITHOUT ANY WARRANTY; without even the implied warranty of |
(...skipping 15 matching lines...) Expand all Loading... |
26 */ | 26 */ |
27 .full-width | 27 .full-width |
28 { | 28 { |
29 display: block; | 29 display: block; |
30 width: 100%; | 30 width: 100%; |
31 } | 31 } |
32 | 32 |
33 /** | 33 /** |
34 * Center content within a (responsive) fixed width | 34 * Center content within a (responsive) fixed width |
35 */ | 35 */ |
36 .container | 36 @mixin container($width: $container-width, $padding-x: $small-space) |
37 { | 37 { |
38 width: $container-width; | 38 width: $width; |
39 max-width: 100%; | 39 max-width: 100%; |
40 margin-right: auto; | 40 margin-right: auto; |
41 margin-left: auto; | 41 margin-left: auto; |
42 padding-right: $small-space; | 42 padding-right: $padding-x; |
43 padding-left: $small-space; | 43 padding-left: $padding-x; |
| 44 } |
| 45 |
| 46 .container |
| 47 { |
| 48 @include container; |
44 } | 49 } |
45 | 50 |
46 /* Device widths | 51 /* Device widths |
47 ******************************************************************************/ | 52 ******************************************************************************/ |
48 | 53 |
49 .phone-width { width: $phone-width; } | 54 .phone-width { width: $phone-width; } |
50 .phablet-width { width: $phablet-width; } | 55 .phablet-width { width: $phablet-width; } |
51 .tablet-width { width: $tablet-width; } | 56 .tablet-width { width: $tablet-width; } |
52 .desktop-width { width: $desktop-width; } | 57 .desktop-width { width: $desktop-width; } |
53 .large-desktop-width { width: $large-desktop-width; } | 58 .large-desktop-width { width: $large-desktop-width; } |
(...skipping 87 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
141 background-color: $error-dark; | 146 background-color: $error-dark; |
142 } | 147 } |
143 | 148 |
144 /* Lead | 149 /* Lead |
145 ******************************************************************************/ | 150 ******************************************************************************/ |
146 | 151 |
147 .lead | 152 .lead |
148 { | 153 { |
149 font-size: 1.25em; | 154 font-size: 1.25em; |
150 } | 155 } |
OLD | NEW |