Mercurial > libervia-templates
comparison sat_templates/templates/default/static/styles.css @ 204:e9bbf4462ea8
css: misc changes
- anchor links in list elements can now be displayed more obviously using "list__item--show-links" class
- specific style for disabled button
- adapted form styles to new "select" field
- other small changes, see diff
author | Goffi <goffi@goffi.org> |
---|---|
date | Sun, 26 May 2019 22:09:49 +0200 |
parents | a1fa6744c78e |
children | bf33342902ed |
comparison
equal
deleted
inserted
replaced
203:bdc578994b97 | 204:e9bbf4462ea8 |
---|---|
50 width: 100%; | 50 width: 100%; |
51 /* this value is used when js is not enabled */ | 51 /* this value is used when js is not enabled */ |
52 height: 100%; | 52 height: 100%; |
53 } | 53 } |
54 | 54 |
55 address { | |
56 font-style: inherit; | |
57 } | |
58 | |
55 #main_area { | 59 #main_area { |
56 flex: 1; | 60 flex: 1; |
57 display: flex; | 61 display: flex; |
58 flex-direction: column; | 62 flex-direction: column; |
59 box-sizing: border-box; | 63 box-sizing: border-box; |
74 .page__footer span { | 78 .page__footer span { |
75 background: white; | 79 background: white; |
76 padding: 0 0.3em; | 80 padding: 0 0.3em; |
77 border-radius: 0.5em; | 81 border-radius: 0.5em; |
78 } | 82 } |
79 | |
80 | 83 |
81 .post_confirm { | 84 .post_confirm { |
82 text-align: center; | 85 text-align: center; |
83 background-color: lightgreen; | 86 background-color: lightgreen; |
84 padding: 1em; | 87 padding: 1em; |
181 cursor: pointer; | 184 cursor: pointer; |
182 } | 185 } |
183 | 186 |
184 .btn-fold:hover { | 187 .btn-fold:hover { |
185 font-weight: bold; | 188 font-weight: bold; |
189 } | |
190 | |
191 .btn:disabled { | |
192 color: #fff; | |
193 background-color: #eee; | |
194 border-color: #aaa; | |
195 } | |
196 | |
197 .center { | |
198 text-align: center; | |
186 } | 199 } |
187 | 200 |
188 /** Labels **/ | 201 /** Labels **/ |
189 | 202 |
190 .labels { | 203 .labels { |
213 .labels a>span:hover { | 226 .labels a>span:hover { |
214 box-shadow: 0px 0px 6px 1px #000; | 227 box-shadow: 0px 0px 6px 1px #000; |
215 } | 228 } |
216 | 229 |
217 /** heading **/ | 230 /** heading **/ |
231 | |
218 .heading__subtitle { | 232 .heading__subtitle { |
219 font-size: 2em; | 233 font-size: 2em; |
220 text-align: center; | 234 text-align: center; |
235 } | |
236 | |
237 .heading--plain { | |
238 background: var(--color-sec--light); | |
221 } | 239 } |
222 | 240 |
223 /** instructions **/ | 241 /** instructions **/ |
224 | 242 |
225 .instructions--head { | 243 .instructions--head { |
306 } | 324 } |
307 | 325 |
308 .link--center { | 326 .link--center { |
309 display: block; | 327 display: block; |
310 text-align: center; | 328 text-align: center; |
329 } | |
330 | |
331 .inline { | |
332 display: inline; | |
311 } | 333 } |
312 | 334 |
313 /********* | 335 /********* |
314 * pages * | 336 * pages * |
315 *********/ | 337 *********/ |
371 border-color: silver; | 393 border-color: silver; |
372 border-width: 1px 0; | 394 border-width: 1px 0; |
373 } | 395 } |
374 | 396 |
375 .box--paper { | 397 .box--paper { |
376 text-align: center; | 398 text-align: justify; |
377 font-variant: small-caps; | 399 font-variant: small-caps; |
378 border: none; | 400 border: none; |
379 } | 401 } |
380 | 402 |
381 .box--comment { | 403 .box--comment { |
609 } | 631 } |
610 | 632 |
611 .list__item--selected { | 633 .list__item--selected { |
612 font-weight: bold; | 634 font-weight: bold; |
613 text-decoration: underline; | 635 text-decoration: underline; |
636 } | |
637 | |
638 .list__item--show-links>a { | |
639 text-decoration: underline; | |
640 color: inherit; | |
641 } | |
642 | |
643 .list__item--show-links>a:hover { | |
644 color: var(--color-sec--dark); | |
614 } | 645 } |
615 | 646 |
616 /********* | 647 /********* |
617 * Grids * | 648 * Grids * |
618 *********/ | 649 *********/ |
1012 | 1043 |
1013 .form__panel--vertical .form_input { | 1044 .form__panel--vertical .form_input { |
1014 margin: 0.5em 0; | 1045 margin: 0.5em 0; |
1015 } | 1046 } |
1016 | 1047 |
1017 .form__panel--center textarea,input:not([type="radio"]) { | 1048 .form__panel--center label, |
1049 .form__panel--center textarea, | |
1050 .form__panel--center select, | |
1051 .form__panel--center input:not([type="radio"]) | |
1052 { | |
1018 display: block; | 1053 display: block; |
1019 margin-left: auto; | 1054 margin-left: auto; |
1020 margin-right: auto; | 1055 margin-right: auto; |
1021 } | 1056 } |
1022 | 1057 |
1023 .form__panel--center label { | 1058 .form__panel--center label { |
1024 text-align: center; | 1059 text-align: center; |
1025 } | 1060 } |
1026 | 1061 |
1027 .form__field--tiny>input { | 1062 .form__field--tiny>input, |
1063 select.form__field--tiny | |
1064 { | |
1028 box-sizing: border-box; | 1065 box-sizing: border-box; |
1029 width: 3em; | 1066 width: 3em; |
1030 } | 1067 } |
1031 | 1068 |
1032 .form__field--small>input { | 1069 .form__field--small>input, |
1070 select.form__field--small | |
1071 { | |
1033 box-sizing: border-box; | 1072 box-sizing: border-box; |
1034 width: 20em; | 1073 width: 20em; |
1035 max-width: 95%; | 1074 max-width: 95%; |
1036 } | 1075 } |
1037 | 1076 |
1038 .form__field--medium>input { | 1077 .form__field--medium>input, |
1078 select.form__field--medium | |
1079 { | |
1039 box-sizing: border-box; | 1080 box-sizing: border-box; |
1040 width: 50em; | 1081 width: 50em; |
1041 max-width: 95%; | 1082 max-width: 95%; |
1042 } | 1083 } |
1043 | 1084 |
1044 .form__field--big>input,textarea { | 1085 .form__field--big>input, |
1086 .form__field--big>textarea, | |
1087 select.form__field--big | |
1088 { | |
1045 box-sizing: border-box; | 1089 box-sizing: border-box; |
1046 width: 100%; | 1090 width: 100%; |
1047 } | 1091 } |
1048 | 1092 |
1049 /************* | 1093 /************* |
1315 display: flex; | 1359 display: flex; |
1316 flex-direction: column; | 1360 flex-direction: column; |
1317 padding: 2em; | 1361 padding: 2em; |
1318 } | 1362 } |
1319 | 1363 |
1320 .form__field--big>input,textarea { | 1364 .form__field--big>input, |
1365 .form__field--big>textarea, | |
1366 select.form__field--big | |
1367 { | |
1321 box-sizing: border-box; | 1368 box-sizing: border-box; |
1322 width: 95%; | 1369 width: 95%; |
1323 } | 1370 } |
1324 | 1371 |
1325 .form--single input:not([type="submit"]) { | 1372 .form--single input:not([type="submit"]) { |