]>
Commit | Line | Data |
---|---|---|
b2051dd7 S |
1 | // Bootstrap overrides |
2 | // | |
3 | // Copy variables from `_variables.scss` to this file to override default values | |
4 | // without modifying source files. | |
5 | ||
6 | // Colors added for IPFire branding | |
7 | $red_900: #b71c1c; | |
8 | $red_600: #e53935; | |
9 | $amber_800: #ff8f00; | |
10 | $yellow_700: #fbc02d; | |
11 | $blue_700: #1976d2; | |
12 | $blue_400: #42a5f5; | |
13 | $green_600: #43a047; | |
14 | $green_400: #66bb6a; | |
15 | $blue_grey_900: #263238; | |
16 | $blue_grey_700: #455a64; | |
17 | $blue_grey_600: #546e7a; | |
18 | $blue_grey_300: #90a4ae; | |
19 | $blue_grey_50: #eceff1; | |
20 | $deep_orange_a400: #ff3d00; | |
21 | $cyan: #00bcd4; | |
22 | ||
97ed546d S |
23 | // Reassign color vars to semantic color scheme |
24 | $brand-primary: $blue !default; | |
25 | $brand-success: $green !default; | |
26 | $brand-info: $teal !default; | |
27 | $brand-warning: $orange !default; | |
28 | $brand-danger: $red !default; | |
29 | $brand-inverse: $gray-dark !default; | |
b2051dd7 | 30 | |
97ed546d | 31 | // Spacing |
49baba87 | 32 | $spacer: 8px; |
1e5bc9c9 S |
33 | $spacer-x: $spacer; |
34 | $spacer-y: $spacer; | |
97ed546d S |
35 | $spacers: ( |
36 | 0: ( | |
37 | x: 0, | |
38 | y: 0 | |
39 | ), | |
40 | 1: ( | |
41 | x: ($spacer-x * .25), | |
42 | y: ($spacer-y * .25) | |
43 | ), | |
44 | 2: ( | |
45 | x: ($spacer-x * .5), | |
46 | y: ($spacer-y * .5) | |
47 | ), | |
48 | 3: ( | |
49 | x: $spacer-x, | |
50 | y: $spacer-y | |
51 | ), | |
52 | 4: ( | |
53 | x: ($spacer-x * 1.5), | |
54 | y: ($spacer-y * 1.5) | |
55 | ), | |
56 | 5: ( | |
b6d1f3b7 S |
57 | x: ($spacer-x * 2), |
58 | y: ($spacer-y * 2) | |
1e5bc9c9 S |
59 | ), |
60 | 6: ( | |
b6d1f3b7 S |
61 | x: ($spacer-x * 6), |
62 | y: ($spacer-y * 6) | |
97ed546d | 63 | ) |
1e5bc9c9 | 64 | ); |
b2051dd7 | 65 | |
97ed546d S |
66 | $border-width: 2px; |
67 | ||
22cfab2d S |
68 | // Body |
69 | // | |
70 | // Settings for the `<body>` element. | |
22cfab2d S |
71 | $body-bg: $blue_grey_50; |
72 | $body-color: $blue_grey_900; | |
73 | $inverse-bg: $gray-dark !default; | |
74 | $inverse-color: $gray-lighter !default; | |
75 | ||
97ed546d | 76 | // Links |
1e5bc9c9 | 77 | $link-color: $red_900; |
9ce2074c S |
78 | $link-hover-color: darken($link-color, 15%); |
79 | $link-hover-decoration: none; | |
97ed546d | 80 | |
49baba87 S |
81 | // Grid breakpoints |
82 | // | |
83 | // Define the minimum dimensions at which your layout will change, | |
84 | // adapting to different screen sizes, for use in media queries. | |
85 | $grid-breakpoints: ( | |
86 | xs: 0, | |
87 | sm: 576px, | |
88 | md: 768px, | |
89 | lg: 992px, | |
90 | xl: 1200px | |
91 | ) !default; | |
92 | @include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); | |
93 | @include _assert-starts-at-zero($grid-breakpoints); | |
97ed546d | 94 | |
49baba87 | 95 | // Grid |
22cfab2d | 96 | $grid-columns: 12 !default; |
97ed546d | 97 | $grid-gutter-width-base: 24px; |
22cfab2d S |
98 | $grid-gutter-widths: ( |
99 | xs: $grid-gutter-width-base, | |
100 | sm: $grid-gutter-width-base, | |
101 | md: $grid-gutter-width-base, | |
102 | lg: $grid-gutter-width-base, | |
103 | xl: $grid-gutter-width-base | |
104 | ); | |
97ed546d | 105 | |
b2051dd7 | 106 | // Fonts |
d40f9b8d | 107 | @import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500'); |
97ed546d S |
108 | $font-family-sans-serif: 'Ubuntu', sans-serif; |
109 | $font-family-base: $font-family-sans-serif; | |
110 | ||
49baba87 | 111 | $font-size-lg: 20px; |
97ed546d | 112 | |
2d8cbd13 | 113 | $font-weight-normal: 400; |
55edf6f3 S |
114 | $font-weight-bold: 500; |
115 | ||
116 | $font-weight-base: $font-weight-normal; | |
b6d1f3b7 | 117 | |
49baba87 S |
118 | $font-size-h1: 36px; |
119 | $font-size-h2: 32px; | |
120 | $font-size-h3: 24px; | |
121 | $font-size-h4: 20px; | |
122 | $font-size-h5: 16px; | |
123 | $font-size-h6: 12px; | |
97ed546d | 124 | |
b6d1f3b7 S |
125 | $headings-font-weight: 400; |
126 | ||
49baba87 S |
127 | $display1-size: 120px; |
128 | $display2-size: 48px; | |
129 | $display3-size: 32px; | |
130 | $display4-size: 24px; | |
97ed546d | 131 | |
49baba87 | 132 | $lead-font-size: 24px; |
1e5bc9c9 | 133 | |
49baba87 | 134 | $small-font-size: 14px; |
b6d1f3b7 | 135 | |
97ed546d S |
136 | |
137 | // Buttons | |
49baba87 S |
138 | $btn-padding-x: 16px; |
139 | $btn-padding-y: 8px; | |
69a9b33d | 140 | $btn-line-height: .95; |
22cfab2d | 141 | $btn-font-weight: 600; |
9ce2074c S |
142 | $btn-box-shadow: none; |
143 | $btn-focus-box-shadow: none; | |
144 | $btn-active-box-shadow: none; | |
97ed546d | 145 | |
97ed546d S |
146 | $btn-primary-bg: $red_900; |
147 | $btn-primary-border: $red_900; | |
148 | ||
149 | $btn-secondary-color: $blue_grey_600; | |
150 | $btn-secondary-bg: $white !default; | |
151 | $btn-secondary-border: $blue_grey_600; | |
152 | ||
153 | $btn-info-color: $white !default; | |
154 | $btn-info-bg: $brand-info !default; | |
155 | $btn-info-border: $btn-info-bg !default; | |
156 | ||
157 | $btn-success-color: $white !default; | |
158 | $btn-success-bg: $brand-success !default; | |
159 | $btn-success-border: $btn-success-bg !default; | |
160 | ||
161 | $btn-warning-color: $white !default; | |
162 | $btn-warning-bg: $brand-warning !default; | |
163 | $btn-warning-border: $btn-warning-bg !default; | |
164 | ||
165 | $btn-danger-color: $white !default; | |
166 | $btn-danger-bg: $brand-danger !default; | |
167 | $btn-danger-border: $btn-danger-bg !default; | |
168 | ||
b6d1f3b7 S |
169 | $btn-red900-color: $white !important; |
170 | $btn-red900-bg: $red_900; | |
9ce2074c S |
171 | $btn-red900-border: $btn-red900-bg; |
172 | ||
173 | $btn-white-color: $red_900; | |
174 | $btn-white-bg: $white; | |
175 | $btn-white-border: $btn-white-bg; | |
176 | ||
177 | $btn-bluegrey900-color: $white; | |
178 | $btn-bluegrey900-bg: $blue_grey_900; | |
179 | $btn-bluegrey900-border: $btn-bluegrey900-bg; | |
b6d1f3b7 | 180 | |
97ed546d S |
181 | $btn-link-disabled-color: $gray-light !default; |
182 | ||
49baba87 S |
183 | $btn-padding-x-sm: 8px; |
184 | $btn-padding-y-sm: 4px; | |
97ed546d | 185 | |
49baba87 S |
186 | $btn-padding-x-lg: 32px; |
187 | $btn-padding-y-lg: 12px; | |
97ed546d | 188 | |
49baba87 S |
189 | $btn-block-spacing-y: 8px; |
190 | $btn-toolbar-margin: 8px; | |
97ed546d S |
191 | |
192 | // Allows for customizing button radius independently from global border radius | |
49baba87 | 193 | $btn-border-radius-lg: 2px; |
97ed546d S |
194 | |
195 | ||
196 | $input-btn-border-width: $border-width; | |
197 | ||
198 | // Navs | |
49baba87 S |
199 | $nav-item-margin: 24px; |
200 | $nav-item-inline-spacer: 16px; | |
201 | $nav-link-padding: 8px 24px; | |
97ed546d S |
202 | $nav-link-hover-bg: $gray-lighter !default; |
203 | $nav-disabled-link-color: $gray-light !default; | |
1e5bc9c9 S |
204 | |
205 | // Navbar | |
1e5bc9c9 S |
206 | $navbar-padding-x: $spacer; |
207 | $navbar-padding-y: $spacer; |