Skip to content

Commit d67d181

Browse files
rmrayarmraya
committed
Updated for release 8.6.0
1 parent acbbdf3 commit d67d181

16 files changed

Lines changed: 638 additions & 101 deletions

‎css/dark.css‎

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,96 @@ input:disabled {
104104
width: calc(100% - 8px);
105105
}
106106

107+
input[type=radio] {
108+
appearance: none;
109+
-webkit-appearance: none;
110+
width: 20px;
111+
height: 20px;
112+
border: none;
113+
vertical-align: middle;
114+
margin: 0px 0px 0px 4px;
115+
background-color: transparent;
116+
background-repeat: no-repeat;
117+
background-position: center;
118+
background-size: auto;
119+
/* unchecked: original radio.svg at native size */
120+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%236DBBFF'><path d='M480.28-96Q401-96 331-126t-122.5-82.5Q156-261 126-330.96t-30-149.5Q96-560 126-629.5q30-69.5 82.5-122T330.96-834q69.96-30 149.5-30t149.04 30q69.5 30 122 82.5T834-629.28q30 69.73 30 149Q864-401 834-331t-82.5 122.5Q699-156 629.28-126q-69.73 30-149 30Zm-.28-72q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Z'/></svg>");
121+
}
122+
input[type=radio]:checked {
123+
appearance: none;
124+
-webkit-appearance: none;
125+
width: 20px;
126+
height: 20px;
127+
border: none;
128+
vertical-align: middle;
129+
margin: 0px 0px 0px 4px;
130+
background-color: transparent;
131+
background-repeat: no-repeat;
132+
background-position: center;
133+
background-size: auto;
134+
/* checked: original selectedradio.svg at native size */
135+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%236DBBFF'><path d='M480.23-288Q560-288 616-344.23q56-56.22 56-136Q672-560 615.77-616q-56.22-56-136-56Q400-672 344-615.77q-56 56.22-56 136Q288-400 344.23-344q56.22 56 136 56Zm.05 192Q401-96 331-126t-122.5-82.5Q156-261 126-330.96t-30-149.5Q96-560 126-629.5q30-69.5 82.5-122T330.96-834q69.96-30 149.5-30t149.04 30q69.5 30 122 82.5T834-629.28q30 69.73 30 149Q864-401 834-331t-82.5 122.5Q699-156 629.28-126q-69.73 30-149 30Zm-.05-72q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Z'/></svg>");
136+
}
137+
138+
input[type=checkbox] {
139+
appearance: none;
140+
-webkit-appearance: none;
141+
width: 20px;
142+
height: 20px;
143+
border: none;
144+
vertical-align: middle;
145+
margin: 0px 0px 0px 4px;
146+
background-color: transparent;
147+
background-repeat: no-repeat;
148+
background-position: center;
149+
background-size: auto;
150+
/* unchecked: original checkbox.svg at native size */
151+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%236DBBFF'><path d='M216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Z'/></svg>");
152+
}
153+
input[type=checkbox]:checked {
154+
appearance: none;
155+
-webkit-appearance: none;
156+
width: 20px;
157+
height: 20px;
158+
border: none;
159+
vertical-align: middle;
160+
margin: 0px 0px 0px 4px;
161+
background-color: transparent;
162+
background-repeat: no-repeat;
163+
background-position: center;
164+
background-size: auto;
165+
/* checked: original selectedbox.svg at native size */
166+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%236DBBFF'><path d='m429-336 238-237-51-51-187 186-85-84-51 51 136 135ZM216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Zm0-528v528-528Z'/></svg>");
167+
}
168+
input[type=checkbox]:disabled {
169+
appearance: none;
170+
-webkit-appearance: none;
171+
width: 20px;
172+
height: 20px;
173+
border: none;
174+
vertical-align: middle;
175+
margin: 0px 0px 0px 4px;
176+
background-color: transparent;
177+
background-repeat: no-repeat;
178+
background-position: center;
179+
background-size: auto;
180+
/* unchecked: original checkbox.svg at native size */
181+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%23a29e9d'><path d='M216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Z'/></svg>");
182+
}
183+
input[type=checkbox]:disabled+label {
184+
color: var(--gray90);
185+
}
186+
/* prevent general input:focus border from applying */
187+
input[type=checkbox]:focus {
188+
outline: none;
189+
border: none !important;
190+
}
191+
192+
input[type=radio]:focus {
193+
outline: none;
194+
border: none !important;
195+
}
196+
107197
select {
108198
background-color: var(--gray150);
109199
color: var(--gray30);
@@ -153,6 +243,7 @@ button:hover {
153243
.row {
154244
display: flex;
155245
flex-direction: row;
246+
align-items: center;
156247
width: 100%;
157248
padding: 0;
158249
}
@@ -188,6 +279,7 @@ button:hover {
188279
label {
189280
padding-left: 4px;
190281
padding-right: 4px;
282+
vertical-align: middle;
191283
}
192284

193285
.column {

‎css/highcontrast.css‎

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,101 @@ input:disabled {
103103
width: calc(100% - 8px);
104104
}
105105

106+
input[type=radio] {
107+
appearance: none;
108+
-webkit-appearance: none;
109+
width: 20px;
110+
height: 20px;
111+
border: none;
112+
vertical-align: middle;
113+
margin: 0px 0px 0px 4px;
114+
background-color: transparent;
115+
background-repeat: no-repeat;
116+
background-position: center;
117+
background-size: auto;
118+
/* unchecked: original radio.svg at native size */
119+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%236DBBFF'><path d='M480.28-96Q401-96 331-126t-122.5-82.5Q156-261 126-330.96t-30-149.5Q96-560 126-629.5q30-69.5 82.5-122T330.96-834q69.96-30 149.5-30t149.04 30q69.5 30 122 82.5T834-629.28q30 69.73 30 149Q864-401 834-331t-82.5 122.5Q699-156 629.28-126q-69.73 30-149 30Zm-.28-72q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Z'/></svg>");
120+
}
121+
122+
input[type=radio]:checked {
123+
appearance: none;
124+
-webkit-appearance: none;
125+
width: 20px;
126+
height: 20px;
127+
border: none;
128+
vertical-align: middle;
129+
margin: 0px 0px 0px 4px;
130+
background-color: transparent;
131+
background-repeat: no-repeat;
132+
background-position: center;
133+
background-size: auto;
134+
/* checked: original selectedradio.svg at native size */
135+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%236DBBFF'><path d='M480.23-288Q560-288 616-344.23q56-56.22 56-136Q672-560 615.77-616q-56.22-56-136-56Q400-672 344-615.77q-56 56.22-56 136Q288-400 344.23-344q56.22 56 136 56Zm.05 192Q401-96 331-126t-122.5-82.5Q156-261 126-330.96t-30-149.5Q96-560 126-629.5q30-69.5 82.5-122T330.96-834q69.96-30 149.5-30t149.04 30q69.5 30 122 82.5T834-629.28q30 69.73 30 149Q864-401 834-331t-82.5 122.5Q699-156 629.28-126q-69.73 30-149 30Zm-.05-72q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Z'/></svg>");
136+
}
137+
138+
input[type=checkbox] {
139+
appearance: none;
140+
-webkit-appearance: none;
141+
width: 20px;
142+
height: 20px;
143+
border: none;
144+
vertical-align: middle;
145+
margin: 0px 0px 0px 4px;
146+
background-color: transparent;
147+
background-repeat: no-repeat;
148+
background-position: center;
149+
background-size: auto;
150+
/* unchecked: original checkbox.svg at native size */
151+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%236DBBFF'><path d='M216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Z'/></svg>");
152+
}
153+
154+
input[type=checkbox]:checked {
155+
appearance: none;
156+
-webkit-appearance: none;
157+
width: 20px;
158+
height: 20px;
159+
border: none;
160+
vertical-align: middle;
161+
margin: 0px 0px 0px 4px;
162+
background-color: transparent;
163+
background-repeat: no-repeat;
164+
background-position: center;
165+
background-size: auto;
166+
/* checked: original selectedbox.svg at native size */
167+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%236DBBFF'><path d='m429-336 238-237-51-51-187 186-85-84-51 51 136 135ZM216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Zm0-528v528-528Z'/></svg>");
168+
}
169+
170+
input[type=checkbox]:disabled {
171+
appearance: none;
172+
-webkit-appearance: none;
173+
width: 20px;
174+
height: 20px;
175+
border: none;
176+
vertical-align: middle;
177+
margin: 0px 0px 0px 4px;
178+
background-color: transparent;
179+
background-repeat: no-repeat;
180+
background-position: center;
181+
background-size: auto;
182+
/* unchecked: original checkbox.svg at native size */
183+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%235e5857'><path d='M216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Z'/></svg>");
184+
}
185+
186+
input[type=checkbox]:disabled+label {
187+
color: var(--gray130);
188+
}
189+
190+
/* prevent general input:focus border from applying */
191+
input[type=checkbox]:focus {
192+
outline: none;
193+
border: none !important;
194+
}
195+
196+
input[type=radio]:focus {
197+
outline: none;
198+
border: none !important;
199+
}
200+
106201
select {
107202
background-color: var(--black);
108203
color: var(--white);
@@ -152,6 +247,7 @@ button:hover {
152247
.row {
153248
display: flex;
154249
flex-direction: row;
250+
align-items: center;
155251
width: 100%;
156252
padding: 0;
157253
}
@@ -187,6 +283,7 @@ button:hover {
187283
label {
188284
padding-left: 4px;
189285
padding-right: 4px;
286+
vertical-align: middle;
190287
}
191288

192289
.column {

‎css/light.css‎

Lines changed: 101 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ td.list {
7979
/* inputs */
8080

8181
input {
82-
background-color: var(--gray20);
82+
background-color: var(--gray10);
8383
color: var(--gray190);
8484
border: 1px solid var(--gray190);
8585
height: 1.4rem;
@@ -104,8 +104,103 @@ input:disabled {
104104
width: calc(100% - 8px);
105105
}
106106

107+
input[type=radio] {
108+
appearance: none;
109+
-webkit-appearance: none;
110+
width: 20px;
111+
height: 20px;
112+
border: none;
113+
vertical-align: middle;
114+
margin: 0px 0px 0px 4px;
115+
background-color: transparent;
116+
background-repeat: no-repeat;
117+
background-position: center;
118+
background-size: auto;
119+
/* unchecked: original radio.svg at native size */
120+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%230F4C81'><path d='M480.28-96Q401-96 331-126t-122.5-82.5Q156-261 126-330.96t-30-149.5Q96-560 126-629.5q30-69.5 82.5-122T330.96-834q69.96-30 149.5-30t149.04 30q69.5 30 122 82.5T834-629.28q30 69.73 30 149Q864-401 834-331t-82.5 122.5Q699-156 629.28-126q-69.73 30-149 30Zm-.28-72q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Z'/></svg>");
121+
}
122+
123+
input[type=radio]:checked {
124+
appearance: none;
125+
-webkit-appearance: none;
126+
width: 20px;
127+
height: 20px;
128+
border: none;
129+
vertical-align: middle;
130+
margin: 0px 0px 0px 4px;
131+
background-color: transparent;
132+
background-repeat: no-repeat;
133+
background-position: center;
134+
background-size: auto;
135+
/* checked: original selectedradio.svg at native size */
136+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%230F4C81'><path d='M480.23-288Q560-288 616-344.23q56-56.22 56-136Q672-560 615.77-616q-56.22-56-136-56Q400-672 344-615.77q-56 56.22-56 136Q288-400 344.23-344q56.22 56 136 56Zm.05 192Q401-96 331-126t-122.5-82.5Q156-261 126-330.96t-30-149.5Q96-560 126-629.5q30-69.5 82.5-122T330.96-834q69.96-30 149.5-30t149.04 30q69.5 30 122 82.5T834-629.28q30 69.73 30 149Q864-401 834-331t-82.5 122.5Q699-156 629.28-126q-69.73 30-149 30Zm-.05-72q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Z'/></svg>");
137+
}
138+
139+
input[type=checkbox] {
140+
appearance: none;
141+
-webkit-appearance: none;
142+
width: 20px;
143+
height: 20px;
144+
border: none;
145+
vertical-align: middle;
146+
margin: 0px 0px 0px 4px;
147+
background-color: transparent;
148+
background-repeat: no-repeat;
149+
background-position: center;
150+
background-size: auto;
151+
/* unchecked: original checkbox.svg at native size */
152+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%230F4C81'><path d='M216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Z'/></svg>");
153+
}
154+
155+
input[type=checkbox]:checked {
156+
appearance: none;
157+
-webkit-appearance: none;
158+
width: 20px;
159+
height: 20px;
160+
border: none;
161+
vertical-align: middle;
162+
margin: 0px 0px 0px 4px;
163+
background-color: transparent;
164+
background-repeat: no-repeat;
165+
background-position: center;
166+
background-size: auto;
167+
/* checked: original selectedbox.svg at native size */
168+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%230F4C81'><path d='m429-336 238-237-51-51-187 186-85-84-51 51 136 135ZM216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Zm0-528v528-528Z'/></svg>");
169+
}
170+
171+
input[type=checkbox]:disabled {
172+
appearance: none;
173+
-webkit-appearance: none;
174+
width: 20px;
175+
height: 20px;
176+
border: none;
177+
vertical-align: middle;
178+
margin: 0px 0px 0px 4px;
179+
background-color: transparent;
180+
background-repeat: no-repeat;
181+
background-position: center;
182+
background-size: auto;
183+
/* unchecked: original checkbox.svg at native size */
184+
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%23cbc6c4'><path d='M216-144q-29.7 0-50.85-21.15Q144-186.3 144-216v-528q0-29.7 21.15-50.85Q186.3-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29.7-21.15 50.85Q773.7-144 744-144H216Zm0-72h528v-528H216v528Z'/></svg>");
185+
}
186+
187+
input[type=checkbox]:disabled+label {
188+
color: var(--gray60);
189+
}
190+
191+
/* prevent general input:focus border from applying */
192+
input[type=checkbox]:focus {
193+
outline: none;
194+
border: none !important;
195+
}
196+
197+
input[type=radio]:focus {
198+
outline: none;
199+
border: none !important;
200+
}
201+
107202
select {
108-
background-color: var(--gray20);
203+
background-color: var(--gray10);
109204
color: var(--gray190);
110205
border: 1px solid var(--gray190);
111206
font-size: 1em;
@@ -120,7 +215,7 @@ select:focus {
120215

121216
option {
122217
font-size: 1em;
123-
background-color: var(--gray20);
218+
background-color: var(--gray10);
124219
color: var(--gray190);
125220
}
126221

@@ -153,6 +248,7 @@ button:hover {
153248
.row {
154249
display: flex;
155250
flex-direction: row;
251+
align-items: center;
156252
width: 100%;
157253
padding: 0;
158254
}
@@ -188,6 +284,7 @@ button:hover {
188284
label {
189285
padding-left: 4px;
190286
padding-right: 4px;
287+
vertical-align: middle;
191288
}
192289

193290
.column {
@@ -302,7 +399,7 @@ svg {
302399
.appStatus {
303400
position: fixed;
304401
bottom: 0;
305-
background: linear-gradient(to right, transparent,var(--themePrimary) 20%, var(--themePrimary) 80%, transparent 100%);
402+
background: linear-gradient(to right, transparent, var(--themePrimary) 20%, var(--themePrimary) 80%, transparent 100%);
306403
padding: 4px;
307404
text-align: center;
308405
}

0 commit comments

Comments
 (0)