Left: | ||
Right: |
LEFT | RIGHT |
---|---|
1 * | 1 * |
2 { | 2 { |
3 font-family: Arial, sans; | 3 font-family: Arial, sans; |
4 font-size: 16px; | 4 font-size: 16px; |
5 } | 5 } |
6 | 6 |
7 body | 7 body |
8 { | 8 { |
9 margin: 0; | 9 margin: 0; |
10 line-height: 1.5; | 10 line-height: 1.5; |
(...skipping 180 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
191 | 191 |
192 .content a, | 192 .content a, |
193 .content a:visited | 193 .content a:visited |
194 { | 194 { |
195 color: #c70d2c; | 195 color: #c70d2c; |
196 } | 196 } |
197 | 197 |
198 /* Buttons | 198 /* Buttons |
199 ******************************************************************************/ | 199 ******************************************************************************/ |
200 | 200 |
201 .button | 201 .button |
ire
2017/11/27 19:48:22
According to the style guide, buttons should be 50
juliandoucette
2017/12/04 13:34:05
The 50px height was specified based on a larger fo
ire
2017/12/05 10:28:01
Alright, if Paul is fine with it then that's fine
| |
202 { | 202 { |
203 padding: 0.5em 2em; | 203 padding: 0.5em 2em; |
204 border: none; | 204 border: none; |
205 text-align: center; | |
205 } | 206 } |
206 | 207 |
207 .button:hover, | 208 .button:hover, |
208 .button:active, | 209 .button:active, |
209 .button:focus | 210 .button:focus |
210 { | 211 { |
211 text-decoration: none; | 212 text-decoration: none; |
212 } | 213 } |
213 | 214 |
214 @media(max-width: 767px) | 215 @media(max-width: 767px) |
(...skipping 15 matching lines...) Expand all Loading... | |
230 .button.primary:hover | 231 .button.primary:hover |
231 { | 232 { |
232 background-color: #E00F32; | 233 background-color: #E00F32; |
233 } | 234 } |
234 | 235 |
235 .button.primary:active | 236 .button.primary:active |
236 { | 237 { |
237 background-color: #AD102A; | 238 background-color: #AD102A; |
238 } | 239 } |
239 | 240 |
240 .bg-accent .button.secondary | 241 .button.inverse, |
242 a.button.inverse | |
241 { | 243 { |
242 background: none; | 244 background: none; |
243 color: #fff; | 245 color: #fff; |
244 margin-left: 2px; | 246 margin-left: 2px; |
245 margin-right: 2px; | 247 margin-right: 2px; |
246 border: 1px solid #fff; | 248 border: 1px solid #fff; |
247 } | 249 } |
248 | 250 |
249 .bg-accent .button.secondary:hover, | 251 .button.inverse:hover, |
250 .bg-accent .button.secondary:focus | 252 .button.inverse:focus |
251 { | 253 { |
252 box-shadow: inset 0 0 0 2px #fff; | 254 box-shadow: inset 0 0 0 2px #fff; |
253 } | 255 } |
254 | 256 |
255 .bg-accent .button.secondary:active | 257 .button.inverse:active |
258 { | |
259 background-color: #fff; | |
260 } | |
261 | |
262 .bg-accent .button.inverse:active | |
256 { | 263 { |
257 color: #077CA6; | 264 color: #077CA6; |
258 background-color: #fff; | |
259 } | 265 } |
260 | 266 |
261 /******************************************************************************* | 267 /******************************************************************************* |
262 * .bg-* utilities | 268 * .bg-* utilities |
263 ******************************************************************************/ | 269 ******************************************************************************/ |
264 | 270 |
265 .bg-accent | 271 .bg-accent |
266 { | 272 { |
267 color: #fff; | 273 color: #fff; |
268 background-color: #077CA6; | 274 background-color: #077CA6; |
(...skipping 428 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
697 { | 703 { |
698 display: none; | 704 display: none; |
699 } | 705 } |
700 | 706 |
701 /* overriding display:none above */ | 707 /* overriding display:none above */ |
702 #footer #social-list | 708 #footer #social-list |
703 { | 709 { |
704 display: block; | 710 display: block; |
705 } | 711 } |
706 } | 712 } |
LEFT | RIGHT |