Mercurial > libervia-templates
comparison default/static/styles.css @ 128:4f27ce980ced
css: started to refactor CSS class to follow BEM conventions
author | Goffi <goffi@goffi.org> |
---|---|
date | Sat, 24 Mar 2018 11:14:14 +0100 |
parents | 9d95b58200df |
children | ca42dc037bbf |
comparison
equal
deleted
inserted
replaced
127:27d6453a6209 | 128:4f27ce980ced |
---|---|
1 :root { | |
2 --select-bg-color: #ddd; | |
3 } | |
4 | |
5 | |
1 html { | 6 html { |
2 font-family: "sat-base-font"; | 7 font-family: "sat-base-font"; |
3 } | 8 } |
4 | 9 |
5 body { | 10 body { |
72 | 77 |
73 .button:hover { | 78 .button:hover { |
74 background-color: #bc0000; | 79 background-color: #bc0000; |
75 } | 80 } |
76 | 81 |
82 .instructions--head { | |
83 font-size: 1.5em; | |
84 text-align: center; | |
85 } | |
86 | |
87 .instructions--alt { | |
88 text-align: center; | |
89 font-style: italic; | |
90 } | |
91 | |
92 /*** icons ***/ | |
93 | |
94 .icon--medium { | |
95 height: 3em; | |
96 display: block; | |
97 margin: 0 auto; | |
98 } | |
99 | |
100 .icon--small { | |
101 height: 1em; | |
102 } | |
103 | |
104 .icon--soft { | |
105 fill: #777; | |
106 } | |
107 | |
108 .icon__name { | |
109 | |
110 } | |
111 | |
77 /*** Messages ***/ | 112 /*** Messages ***/ |
78 | 113 |
79 .message_info { | 114 .message--info { |
80 max-width: 500px; | 115 max-width: 500px; |
81 margin: 0 auto; | 116 margin: 0 auto; |
82 padding: 1em; | 117 padding: 1em; |
83 text-align: justify; | 118 text-align: justify; |
84 } | 119 } |
85 | 120 |
86 .message_info pre { | 121 .message--info pre { |
87 background: #ddd; | 122 background: #ddd; |
88 padding: 1em; | 123 padding: 1em; |
89 } | 124 } |
90 | 125 |
91 /*** Menus ***/ | 126 /*** Menus ***/ |
92 | 127 |
93 .menu ul { | 128 .menu ul { |
94 display: flex; | 129 display: flex; |
95 padding: 0; | |
96 margin-top: 8px; | 130 margin-top: 8px; |
97 list-style: none; | 131 list-style: none; |
98 } | 132 } |
99 | 133 |
100 .menu a { | 134 .menu a { |
218 font-weight: bold; | 252 font-weight: bold; |
219 } | 253 } |
220 | 254 |
221 /*** Forms ***/ | 255 /*** Forms ***/ |
222 | 256 |
257 /* a form with only one field */ | |
258 | |
259 .form_single { | |
260 text-align: center; | |
261 } | |
262 | |
263 .form_single input:not([type="submit"]) { | |
264 margin: 0 1em; | |
265 width: 15em; | |
266 border-radius: 0.7em; | |
267 outline: none; | |
268 border: 1px solid black; | |
269 padding: 0.4em; | |
270 box-shadow: none; | |
271 } | |
272 | |
273 | |
223 .form_submit { | 274 .form_submit { |
224 margin: 1em auto 0; | 275 margin: 1em auto 0; |
225 display: block; | 276 display: block; |
277 } | |
278 | |
279 .form_jid { | |
280 text-align: center; | |
226 } | 281 } |
227 | 282 |
228 /* Textboxes */ | 283 /* Textboxes */ |
229 | 284 |
230 form.textbox>* { | 285 form.textbox>* { |
364 | 419 |
365 .prev_next_links ul { | 420 .prev_next_links ul { |
366 padding: 0 6em; | 421 padding: 0 6em; |
367 } | 422 } |
368 | 423 |
369 } | 424 .instructions--alt { |
425 padding-top: 3rem; | |
426 } | |
427 | |
428 /*** forms ***/ | |
429 | |
430 .form_single .form_submit.button { | |
431 display: inline; | |
432 } | |
433 } |