MediaWiki:Gadget-calc.css
Revision as of 19:19, 3 October 2022 by Jacmob (talk | contribs) (Created page with ".jcConfig { display: none; } .jcTable { margin: 0 !important; } .jcTable th { text-align: left !important; } .jcSubmit img { margin: 0 auto; } div > .jcTable .jsCalc-field.oo-ui-fieldLayout:before, div > .jcTable .jsCalc-field.oo-ui-fieldLayout:after, div > .jcTable .jsCalc-group.oo-ui-layout:before, div > .jcTable .jsCalc-group.oo-ui-layout:after { display: none; } div > .jcTable .jsCalc-group.oo-ui-layout:before, div > .jcTable .jsCalc-group.oo-ui-layout:a...")
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
1 .jcConfig {
2 display: none;
3 }
4
5 .jcTable {
6 margin: 0 !important;
7 }
8
9 .jcTable th {
10 text-align: left !important;
11 }
12
13 .jcSubmit img {
14 margin: 0 auto;
15 }
16
17 div > .jcTable .jsCalc-field.oo-ui-fieldLayout:before,
18 div > .jcTable .jsCalc-field.oo-ui-fieldLayout:after,
19 div > .jcTable .jsCalc-group.oo-ui-layout:before,
20 div > .jcTable .jsCalc-group.oo-ui-layout:after {
21 display: none;
22 }
23
24 div > .jcTable .jsCalc-group.oo-ui-layout:before,
25 div > .jcTable .jsCalc-group.oo-ui-layout:after {
26 display: none;
27 clear: both;
28 }
29
30 div > .jcTable .jsCalc-field,
31 div > .jcTable .jsCalc-group {
32 display: block;
33 clear: both;
34 }
35
36 .jsCalc-field.jsCalc-field-hs .oo-ui-fieldLayout-field .oo-ui-actionFieldLayout-input,
37 .jsCalc-field.jsCalc-field-hs .oo-ui-fieldLayout-field .oo-ui-actionFieldLayout-button {
38 display: inline-block;
39 }
40
41 /* Position toggle buttons same as other inputs */
42 .oo-ui-fieldLayout.jsCalc-field-togglebutton.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header {
43 width: 35%;
44 margin-right: 5%;
45 }
46
47 /* Style empty fixed field */
48 .jsCalc-field-fixed > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field > .oo-ui-labelElement-label:empty {
49 width: 50%;
50 background-color: #fff;
51 border: 1px solid #a2a9b1;
52 border-radius: 2px;
53 padding: 0.57142857em 0.57142857em 0.5em;
54 box-shadow: inset 0 0 0 1px transparent;
55 transition: border-color 200ms cubic-bezier(0.4, 0.55, 0.55, 1), box-shadow 200ms cubic-bezier(0.4, 0.55, 0.55, 1);
56 }
57
58 .jsCalc-field-fixed > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field > .oo-ui-labelElement-label:empty::before {
59 content: '\200B';
60 }
61
62 body.wgl-darkmode .jsCalc-field-fixed > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field > .oo-ui-labelElement-label:empty {
63 background-color: #384766;
64 border-color: #475980;
65 }
66
67 /* Action fields spacing, number field spaceing */
68 .jsCalc-field-combobox .oo-ui-comboBoxInputWidget-field,
69 .jsCalc-field-int .oo-ui-numberInputWidget-field,
70 .jsCalc-field-number .oo-ui-numberInputWidget-field {
71 border-spacing: 0;
72 }
73
74 /* Messages and errors spacing */
75 .oo-ui-fieldLayout-messages > li {
76 border-spacing: 0;
77 margin-left: 40%;
78 }
79
80 /**
81 * Styles for grouped inputs
82 * Also removes OO.ui.HorizontalLayout styling
83 **/
84
85 /** why not just use the correct widgets to use here instead of faking them?
86 * would reduce the need to duplicate these styles */
87 .oo-ui-horizontalLayout.jsCalc-group > .oo-ui-layout,
88 .oo-ui-horizontalLayout.jsCalc-group > .oo-ui-widget {
89 display: block;
90 margin: 0;
91 }
92
93 .oo-ui-horizontalLayout.jsCalc-group {
94 padding: 5px;
95 border: 1px solid var(--sidebar);
96 border-radius: 2px;
97 margin-top: 5px;
98 margin-bottom: 5px;
99 }
100
101 body.wgl-darkmode .oo-ui-horizontalLayout.jsCalc-group {
102 border-color: #3f5073;
103 }
104
105 .oo-ui-horizontalLayout.jsCalc-group > .jsCalc-grouplabel {
106 width: 35%;
107 text-align: right;
108 font-weight: bold;
109 font-size: 1.14285714em;
110 }
111
112 .oo-ui-optionWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
113 overflow: visible;
114 }