Skip to content

Commit 915c291

Browse files
philwarehamphilwareham
committed
Save a few bytes
1 parent 371f2cd commit 915c291

19 files changed

+174
-174
lines changed

‎src/assets/sass/designpatterns.scss‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
========================================================================== */
66

77
body {
8-
background-color: var(--color-background);
8+
background-color: var(--color-bkgd);
99
color: var(--color-text);
1010
}
1111

@@ -53,19 +53,19 @@ $colors: (
5353
"nav-hover": var(--color-nav-hover),
5454
"nav-hover-selected": var(--color-nav-hover-selected),
5555
"nav-active": var(--color-nav-active),
56-
"background": var(--color-background),
57-
"background-box": var(--color-background-box),
56+
"background": var(--color-bkgd),
57+
"background-box": var(--color-bkgd-box),
5858
"highlight-box": var(--color-highlight-box),
5959
"strong-highlight-box": var(--color-strong-highlight-box),
6060
"highlight": var(--color-highlight),
6161
"success-text": var(--color-success-text),
62-
"success-background": var(--color-success-background),
62+
"success-background": var(--color-success-bkgd),
6363
"warning-text": var(--color-warning-text),
64-
"warning-background": var(--color-warning-background),
64+
"warning-background": var(--color-warning-bkgd),
6565
"error-text": var(--color-error-text),
66-
"error-background": var(--color-error-background),
66+
"error-background": var(--color-error-bkgd),
6767
"info-text": var(--color-info-text),
68-
"info-background": var(--color-info-background)
68+
"info-background": var(--color-info-bkgd)
6969
);
7070

7171
.design-patterns--color {
@@ -180,7 +180,7 @@ $colors: (
180180
overflow-x: hidden;
181181
overflow-y: auto;
182182
border-right: 1px solid var(--color-border);
183-
background-color: var(--color-background-box);
183+
background-color: var(--color-bkgd-box);
184184
box-shadow: inset -0.25em 0 0.25em -0.25em rgba(0, 0, 0, 0.2);
185185
}
186186

‎src/assets/sass/modules/_alerts.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -66,22 +66,22 @@
6666

6767
&.success {
6868
border-color: var(--color-success-border);
69-
background: var(--color-success-background);
69+
background: var(--color-success-bkgd);
7070
}
7171

7272
&.warning {
7373
border-color: var(--color-warning-border);
74-
background: var(--color-warning-background);
74+
background: var(--color-warning-bkgd);
7575
}
7676

7777
&.error {
7878
border-color: var(--color-error-border);
79-
background: var(--color-error-background);
79+
background: var(--color-error-bkgd);
8080
}
8181

8282
&.information {
8383
border-color: var(--color-info-border);
84-
background: var(--color-info-background);
84+
background: var(--color-info-bkgd);
8585
}
8686
}
8787

‎src/assets/sass/modules/_blog.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@
6666

6767
a:hover,
6868
a:active {
69-
border-color: var(--color-button-primary-border-interact);
69+
border-color: var(--color-btn-primary-border-interact);
7070
background-color: var(--color-highlight-enforced);
7171
color: var(--color-text-button);
7272
text-decoration: none;
@@ -95,13 +95,13 @@
9595
a,
9696
.article-author,
9797
.compatibility {
98-
border-color: var(--color-background-form);
99-
background: var(--color-background-form);
98+
border-color: var(--color-bkgd-form);
99+
background: var(--color-bkgd-form);
100100
}
101101

102102
a:hover,
103103
a:active {
104-
border-color: var(--color-button-primary-border-interact);
104+
border-color: var(--color-btn-primary-border-interact);
105105
background-color: var(--color-highlight-enforced);
106106
}
107107

‎src/assets/sass/modules/_breadcrumbs.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
.breadcrumbs {
1818
margin: 0 -1.3333333em;
1919
padding: 0.5em 1.3333333em; // 6px / 12px + 16px / 12px
20-
background-color: var(--color-background-box);
20+
background-color: var(--color-bkgd-box);
2121
list-style: none;
2222
font-size: setup.$small-font-size;
2323

‎src/assets/sass/modules/_buttons.scss‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -34,17 +34,17 @@ button,
3434
[type="reset"],
3535
[type="submit"],
3636
.button {
37-
@include setup.gradient-linear(var(--color-button-grad-from), var(--color-button-grad-to));
37+
@include setup.gradient-linear(var(--color-btn-grad-from), var(--color-btn-grad-to));
3838

3939
display: inline-block;
4040
position: relative;
4141
width: auto;
4242
height: auto;
4343
padding: 0.25em 1em; // 4px / 16px
44-
border: 1px solid var(--color-button-border);
44+
border: 1px solid var(--color-btn-border);
4545
border-radius: 1em;
4646
background-clip: padding-box;
47-
box-shadow: 0 2px 0 var(--color-button-shadow);
47+
box-shadow: 0 2px 0 var(--color-btn-shadow);
4848
color: var(--color-text-button);
4949
font-weight: normal;
5050
text-align: center;
@@ -54,7 +54,7 @@ button,
5454

5555
&:hover,
5656
&:active {
57-
border-color: var(--color-button-border-interact);
57+
border-color: var(--color-btn-border-interact);
5858
color: var(--color-text-button-interact);
5959
text-decoration: none;
6060
}
@@ -86,15 +86,15 @@ button,
8686
*/
8787

8888
.button-primary {
89-
@include setup.gradient-linear(var(--color-button-primary-grad-from), var(--color-button-primary-grad-to));
89+
@include setup.gradient-linear(var(--color-btn-primary-grad-from), var(--color-btn-primary-grad-to));
9090

91-
border-color: var(--color-button-primary-border);
92-
box-shadow: 0 2px 0 var(--color-button-primary-shadow);
91+
border-color: var(--color-btn-primary-border);
92+
box-shadow: 0 2px 0 var(--color-btn-primary-shadow);
9393
font-weight: bolder;
9494

9595
&:hover,
9696
&:active {
97-
border-color: var(--color-button-primary-border-interact);
97+
border-color: var(--color-btn-primary-border-interact);
9898
}
9999

100100
&:active {
@@ -143,7 +143,7 @@ button,
143143
display: inline-block;
144144
margin: -0.5em 0 -0.5em 0.25em;
145145
padding: 0.5em 0 0.5em 0.5em;
146-
border-left: 1px solid var(--color-button-primary-shadow);
146+
border-left: 1px solid var(--color-btn-primary-shadow);
147147
font-weight: normal;
148148
}
149149

@@ -169,5 +169,5 @@ button[disabled],
169169
[type="submit"][disabled],
170170
.button.disabled {
171171
top: 0 !important;
172-
background: var(--color-button-background-disabled) !important;
172+
background: var(--color-btn-background-disabled) !important;
173173
}

‎src/assets/sass/modules/_cards.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@
6565
.card-header,
6666
.card-footer {
6767
padding: 0.33rem 1rem;
68-
background: var(--color-background-box);
68+
background: var(--color-bkgd-box);
6969
}
7070

7171
.card-header {

‎src/assets/sass/modules/_comments.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,14 +15,14 @@
1515
margin-bottom: 0.5em;
1616
padding: 1px 1em;
1717
border-radius: setup.$border-radius;
18-
background: var(--color-background-box);
18+
background: var(--color-bkgd-box);
1919
word-wrap: break-word;
2020

2121
code,
2222
kbd,
2323
pre,
2424
samp {
25-
background: var(--color-background);
25+
background: var(--color-bkgd);
2626
}
2727
}
2828

@@ -32,7 +32,7 @@
3232
kbd,
3333
pre,
3434
samp {
35-
background: var(--color-background-form);
35+
background: var(--color-bkgd-form);
3636
}
3737
}
3838
}
@@ -62,7 +62,7 @@
6262
background: var(--color-highlight-box);
6363

6464
blockquote {
65-
background: var(--color-background);
65+
background: var(--color-bkgd);
6666
}
6767
}
6868

‎src/assets/sass/modules/_forms.scss‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ textarea {
107107
padding: 0.25em 0.1875em; // 8px / 16px + 3px / 16px
108108
border: 1px solid var(--color-border);
109109
border-radius: 0;
110-
background: var(--color-background-form);
110+
background: var(--color-bkgd-form);
111111
appearance: none; /* 1 */
112112

113113
&:hover {
@@ -163,7 +163,7 @@ textarea {
163163
height: 16px;
164164
padding: 0; /* 1 */
165165
border: 1px solid var(--color-border-extra-dark);
166-
background: var(--color-background-form);
166+
background: var(--color-bkgd-form);
167167
appearance: none;
168168

169169
+ label {
@@ -229,7 +229,7 @@ textarea {
229229

230230
&:hover,
231231
&:active {
232-
background-color: var(--color-text-heading);
232+
background-color: var(--color-heading);
233233
}
234234

235235
&:focus {
@@ -264,7 +264,7 @@ textarea {
264264
[type="radio"]:checked {
265265
&:hover,
266266
&:active {
267-
border-color: var(--color-text-heading);
267+
border-color: var(--color-heading);
268268
}
269269

270270
&:focus {
@@ -297,7 +297,7 @@ textarea {
297297

298298
select {
299299
padding-right: 1.5em; // 24px / 16px
300-
background: var(--color-background-form) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='5' viewBox='0 0 17 5'%3E%3Cpolygon fill='%23333' points='0,0 5,5 10,0'/%3E%3C/svg%3E") right center no-repeat;
300+
background: var(--color-bkgd-form) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='5' viewBox='0 0 17 5'%3E%3Cpolygon fill='%23333' points='0,0 5,5 10,0'/%3E%3C/svg%3E") right center no-repeat;
301301
background-size: 1.0625em 0.3125em; // 17px / 16px, 5px / 16px
302302
text-transform: none;
303303
}
@@ -369,7 +369,7 @@ textarea {
369369
span.disabled {
370370
border: 1px solid var(--color-border) !important;
371371
opacity: 0.33 !important;
372-
background-color: var(--color-background-form-disabled) !important;
372+
background-color: var(--color-bkgd-form-disabled) !important;
373373
box-shadow: none !important;
374374
cursor: default !important; /* 1 */
375375
}

‎src/assets/sass/modules/_layout.scss‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ body {
2020

2121
@include setup.dark-mode {
2222
body {
23-
background-color: var(--color-background-form);
23+
background-color: var(--color-bkgd-form);
2424
}
2525
}
2626

@@ -85,7 +85,7 @@ noscript {
8585
.wrapper {
8686
margin: -1px 0;
8787
padding: 1px 0;
88-
background: var(--color-background);
88+
background: var(--color-bkgd);
8989
color: var(--color-text);
9090
}
9191

@@ -102,7 +102,7 @@ noscript {
102102

103103
#dynamic-header {
104104
border-bottom: 2px solid var(--color-text);
105-
background: var(--color-background);
105+
background: var(--color-bkgd);
106106
color: var(--color-text);
107107

108108
.js & {
@@ -134,7 +134,7 @@ noscript {
134134
.wrapper-footer {
135135
flex: 1;
136136
padding-bottom: 0.5em;
137-
border-top: 1px solid var(--color-background);
137+
border-top: 1px solid var(--color-bkgd);
138138
}
139139

140140
@include setup.dark-mode {
@@ -209,8 +209,8 @@ noscript {
209209
height: 34px;
210210
padding-left: 32px;
211211
transition: width 0.2s ease-in-out;
212-
border-color: var(--color-background);
213-
background: var(--color-background-form) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='%23333'%3E%3Cpath d='M4,13c0-5,4-9,9-9s9,4,9,9s-4,9-9,9S4,18,4,13z M13,19c3.3,0,6-2.7,6-6s-2.7-6-6-6s-6,2.7-6,6S9.7,19,13,19z'/%3E%3Cpath d='M17.5,19l1.5-1.5l4.5,3L28,25c0,0,0,1.5-0.8,2.2S25,28,25,28l-4.5-4.5L17.5,19z'/%3E%3C/g%3E%3C/svg%3E") no-repeat left center;
212+
border-color: var(--color-bkgd);
213+
background: var(--color-bkgd-form) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='%23333'%3E%3Cpath d='M4,13c0-5,4-9,9-9s9,4,9,9s-4,9-9,9S4,18,4,13z M13,19c3.3,0,6-2.7,6-6s-2.7-6-6-6s-6,2.7-6,6S9.7,19,13,19z'/%3E%3Cpath d='M17.5,19l1.5-1.5l4.5,3L28,25c0,0,0,1.5-0.8,2.2S25,28,25,28l-4.5-4.5L17.5,19z'/%3E%3C/g%3E%3C/svg%3E") no-repeat left center;
214214
background-size: 32px 32px;
215215

216216
&:focus {
@@ -221,11 +221,11 @@ noscript {
221221

222222
@include setup.dark-mode {
223223
.search-form [type="search"] {
224-
background-color: var(--color-background);
224+
background-color: var(--color-bkgd);
225225
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='%23ced4da'%3E%3Cpath d='M4,13c0-5,4-9,9-9s9,4,9,9s-4,9-9,9S4,18,4,13z M13,19c3.3,0,6-2.7,6-6s-2.7-6-6-6s-6,2.7-6,6S9.7,19,13,19z'/%3E%3Cpath d='M17.5,19l1.5-1.5l4.5,3L28,25c0,0,0,1.5-0.8,2.2S25,28,25,28l-4.5-4.5L17.5,19z'/%3E%3C/g%3E%3C/svg%3E");
226226

227227
&:focus {
228-
background-color: var(--color-background-form);
228+
background-color: var(--color-bkgd-form);
229229
}
230230
}
231231
}
@@ -323,7 +323,7 @@ section {
323323
}
324324

325325
.zebra {
326-
background-color: var(--color-background-zebra);
326+
background-color: var(--color-bkgd-zebra);
327327
}
328328

329329
.animation-wrapper {
@@ -653,20 +653,20 @@ main .layout-4col-3span {
653653
.count-bubble {
654654
position: relative;
655655
padding: 0.375em; // 6px / 16px
656-
border: 1px solid var(--color-button-border);
656+
border: 1px solid var(--color-btn-border);
657657
border-radius: 0.25em; // 4px / 16px
658-
background: var(--color-background);
658+
background: var(--color-bkgd);
659659
color: var(--color-text-button);
660660
font-weight: bolder;
661661

662662
&:hover {
663-
border-color: var(--color-button-border-interact);
663+
border-color: var(--color-btn-border-interact);
664664
filter: brightness(1.05);
665665
color: var(--color-text-button-interact);
666666
text-decoration: none;
667667

668668
&::before {
669-
border-color: transparent var(--color-button-border-interact);
669+
border-color: transparent var(--color-btn-border-interact);
670670
}
671671
}
672672

@@ -691,7 +691,7 @@ main .layout-4col-3span {
691691
margin-top: -8px;
692692
border-width: 8px 8px 8px 0;
693693
border-style: solid;
694-
border-color: transparent var(--color-background);
694+
border-color: transparent var(--color-bkgd);
695695
}
696696

697697
.count-bubble::before {
@@ -705,5 +705,5 @@ main .layout-4col-3span {
705705
margin-top: -8px;
706706
border-width: 8px 8px 8px 0;
707707
border-style: solid;
708-
border-color: transparent var(--color-button-border);
708+
border-color: transparent var(--color-btn-border);
709709
}

‎src/assets/sass/modules/_links.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,12 +43,12 @@ h4,
4343
h5,
4444
h6 {
4545
a {
46-
color: var(--color-text-heading);
46+
color: var(--color-heading);
4747

4848
&:hover,
4949
&:active {
50-
color: var(--color-text-heading);
51-
text-decoration-color: rgba(var(--color-text-heading), 0.5); /* 1 */
50+
color: var(--color-heading);
51+
text-decoration-color: rgba(var(--color-heading), 0.5); /* 1 */
5252
}
5353
}
5454
}

0 commit comments

Comments
 (0)