Skip to content

Commit 658b7f7

Browse files
jawinnjawinn
committed
fix: undefined and duplicated variable after merging main
fix(slider): remove duplicated values Remove a large number of duplicate values causing stylelint "Unexpected duplicate" warnings. It looks like things got doubled up somehow in a previous rebase or merge. This included duplicate t-shirt size classes. Also moves root styles block under the custom property definitions to be consistent with other components. fix(combobox): fixes undefined and duplicated values
1 parent 3968090 commit 658b7f7

File tree

3 files changed

+26
-81
lines changed

3 files changed

+26
-81
lines changed

‎components/combobox/index.css

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,6 @@
1212
*/
1313

1414
.spectrum-Combobox {
15-
--spectrum-combobox-border-color-default: var(--spectrum-gray-500);
16-
--spectrum-combobox-border-color-hover: var(--spectrum-gray-600);
17-
--spectrum-combobox-border-color-focus: var(--spectrum-gray-800);
18-
--spectrum-combobox-border-color-focus-hover: var(--spectrum-gray-900);
19-
--spectrum-combobox-border-color-key-focus: var(--spectrum-gray-800);
20-
21-
--spectrum-combobox-background-color-disabled: var(--spectrum-gray-25);
22-
2315
--spectrum-combobox-block-size: var(--spectrum-component-height-100);
2416
--spectrum-combobox-icon-size: var(--spectrum-workflow-icon-size-100);
2517
--spectrum-combobox-font-size: var(--spectrum-font-size-100);
@@ -56,6 +48,7 @@
5648
--spectrum-combobox-border-color-focus: var(--spectrum-gray-800);
5749
--spectrum-combobox-border-color-focus-hover: var(--spectrum-gray-900);
5850
--spectrum-combobox-border-color-key-focus: var(--spectrum-gray-800);
51+
--spectrum-combobox-border-color-disabled: var(--spectrum-disabled-border-color);
5952

6053
--spectrum-combobox-border-color-invalid-default: var(--spectrum-negative-border-color-default);
6154
--spectrum-combobox-border-color-invalid-hover: var(--spectrum-negative-border-color-hover);
@@ -83,7 +76,7 @@
8376

8477
--mod-textfield-border-width: var(--mod-combobox-border-width, var(--spectrum-combobox-border-width));
8578
--mod-textfield-border-color: var(--mod-combobox-border-color-default, var(--spectrum-combobox-border-color-default));
86-
--mod-textfield-border-color-disabled: var(--mod-combobox-border-color-disabled, var(--spectrum-combobox-border-color-disabled));
79+
--mod-textfield-border-color-disabled: var(--mod-combobox-border-color-disabled, transparent);
8780
--mod-textfield-border-color-focus: var(--mod-combobox-border-color-focus, var(--spectrum-combobox-border-color-focus));
8881
--mod-textfield-border-color-focus-hover: var(--mod-combobox-border-color-focus-hover, var(--spectrum-combobox-border-color-focus-hover));
8982
--mod-textfield-border-color-hover: var(--mod-combobox-border-color-hover, var(--spectrum-combobox-border-color-hover));
@@ -104,15 +97,15 @@
10497
--mod-picker-button-background-color: var(--mod-combobox-background-color-default);
10598
--mod-picker-button-background-color-disabled: var(--mod-combobox-background-color-disabled);
10699
--mod-picker-button-font-color-disabled: var(--mod-combobox-font-color-disabled);
107-
--mod-picker-button-border-color-disabled: var(--mod-combobox-border-color-disabled, var(--spectrum-combobox-border-color-disabled));
108100
/* @passthroughs end -- settings for nested Picker Button component */
109101

110102
/*** Read-only Colors ***/
111103
--spectrum-combobox-readonly-input-background-color: var(--spectrum-gray-50);
104+
--spectrum-combobox-readonly-input-border-color: var(--spectrum-gray-500);
112105
--spectrum-combobox-readonly-border-color-invalid-default: var(--spectrum-negative-border-color-default);
113106
--spectrum-combobox-readonly-background-color-disabled: var(--spectrum-disabled-background-color);
114107
--spectrum-combobox-readonly-text-color-disabled: var(--spectrum-disabled-content-color);
115-
--spectrum-combobox-readonly-border-color-disabled: var(--spectrum-disabled-border-color);
108+
--spectrum-combobox-border-color-disabled: var(--spectrum-disabled-border-color);
116109
}
117110

118111
.spectrum-Combobox--sizeS {
@@ -248,7 +241,7 @@
248241

249242
&.is-disabled .spectrum-Combobox-input:read-only {
250243
background-color: var(--mod-textfield-background-color-disabled, var(--spectrum-combobox-readonly-background-color-disabled));
251-
border-color: var(--mod-combobox-readonly-border-color-disabled, var(--spectrum-combobox-readonly-border-color-disabled, transparent));
244+
border-color: transparent;
252245
color: var(--highcontrast-textfield-text-color-disabled, var(--mod-textfield-text-color-disabled, var(--spectrum-combobox-readonly-text-color-disabled)));
253246

254247
&:hover {
@@ -435,7 +428,7 @@
435428

436429
&.is-disabled .spectrum-Combobox-input:read-only {
437430
color: var(--highcontrast-textfield-text-color-disabled, var(--mod-textfield-text-color-disabled, var(--spectrum-combobox-readonly-text-color-disabled)));
438-
border-color: var(--mod-textfield-border-color-disabled, var(--spectrum-combobox-readonly-border-color-disabled));
431+
border-color: var(--mod-textfield-border-color-disabled, var(--spectrum-combobox-border-color-disabled));
439432
}
440433
}
441434
}

‎components/slider/dist/metadata.json

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -84,9 +84,6 @@
8484
".spectrum-Slider.is-disabled.spectrum-Slider--filled .spectrum-Slider-track:first-child:before",
8585
".spectrum-Slider.is-disabled.spectrum-Slider--range .spectrum-Slider-track:not(:first-of-type, :last-of-type):before",
8686
".spectrum-Slider.spectrum-Slider--ramp .spectrum-Slider-handle",
87-
".spectrum-Slider.spectrum-Slider--sizeL",
88-
".spectrum-Slider.spectrum-Slider--sizeS",
89-
".spectrum-Slider.spectrum-Slider--sizeXL",
9087
".spectrum-Slider:dir(rtl)",
9188
".spectrum-Slider:dir(rtl) .spectrum-Slider-handle:before",
9289
".spectrum-Slider:not(.is-disabled, .spectrum-Slider--filled, .spectrum-Slider--range) .spectrum-Slider-controls.is-focused",

‎components/slider/index.css

Lines changed: 20 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -12,42 +12,6 @@
1212
*/
1313

1414
.spectrum-Slider {
15-
--spectrum-slider-track-color: var(--spectrum-gray-200);
16-
--spectrum-slider-track-fill-color: var(--spectrum-gray-700);
17-
--spectrum-slider-ramp-track-color: var(--spectrum-gray-400);
18-
--spectrum-slider-ramp-track-color-disabled: var(--spectrum-gray-100);
19-
20-
--spectrum-slider-handle-background-color: transparent;
21-
--spectrum-slider-handle-background-color-disabled: transparent;
22-
--spectrum-slider-ramp-handle-background-color: var(--spectrum-gray-75);
23-
--spectrum-slider-ticks-handle-background-color: var(--spectrum-gray-75);
24-
--spectrum-slider-handle-border-color: var(--spectrum-gray-700);
25-
--spectrum-slider-handle-disabled-background-color: var(--spectrum-gray-75);
26-
27-
--spectrum-slider-tick-mark-color: var(--spectrum-gray-200);
28-
29-
--spectrum-slider-handle-border-color-hover: var(--spectrum-gray-800);
30-
--spectrum-slider-handle-border-color-down: var(--spectrum-gray-800);
31-
--spectrum-slider-handle-border-color-key-focus: var(--spectrum-gray-800);
32-
--spectrum-slider-handle-focus-ring-color-key-focus: var(--spectrum-focus-indicator-color);
33-
34-
--spectrum-slider-track-corner-radius: 2px;
35-
36-
--spectrum-slider-handle-border-radius: var(--spectrum-corner-radius-500);
37-
38-
&.spectrum-Slider--sizeS {
39-
--spectrum-slider-handle-border-radius: var(--spectrum-corner-radius-500);
40-
}
41-
42-
&.spectrum-Slider--sizeL {
43-
--spectrum-slider-handle-border-radius: calc(var(--spectrum-corner-radius-500) * 4);
44-
}
45-
46-
&.spectrum-Slider--sizeXL {
47-
--spectrum-slider-handle-border-radius: calc(var(--spectrum-corner-radius-500) * 4);
48-
}
49-
50-
/* default sizing, matches t-shirt size M */
5115
--spectrum-slider-font-size: var(--spectrum-font-size-75);
5216
--spectrum-slider-handle-size: var(--spectrum-slider-handle-size-medium);
5317
--spectrum-slider-control-height: var(--spectrum-component-height-100);
@@ -104,30 +68,9 @@
10468
/* values */
10569
--spectrum-slider-input-left: calc(var(--spectrum-slider-handle-margin-left) / 4);
10670
--spectrum-slider-track-handleoffset: var(--spectrum-slider-handle-gap);
107-
10871
--spectrum-slider-range-track-reset: 0;
109-
11072
--spectrum-slider-track-corner-radius: 2px;
111-
11273
--spectrum-slider-handle-border-radius: var(--spectrum-corner-radius-500);
113-
114-
position: relative;
115-
116-
/* Don't let z-index'd child elements float above other things on the page */
117-
z-index: 0;
118-
display: block;
119-
min-inline-size: var(--mod-slider-min-size, var(--spectrum-slider-min-size));
120-
121-
user-select: none;
122-
123-
&:dir(rtl),
124-
&:dir(rtl) {
125-
--spectrum-logical-rotation: matrix(-1, 0, 0, 1, 0, 0);
126-
}
127-
128-
&:not(.spectrum-Slider--sideLabel) .spectrum-Slider-labelContainer + .spectrum-Slider-controls:has(.spectrum-Slider-ramp) {
129-
margin-block-start: calc(var(--mod-slider-ramp-track-height, var(--spectrum-slider-ramp-track-height)) / 2);
130-
}
13174
}
13275

13376
.spectrum-Slider--sizeS {
@@ -169,6 +112,26 @@
169112
--spectrum-slider-value-inline-size: 22px;
170113
}
171114

115+
.spectrum-Slider {
116+
position: relative;
117+
118+
/* Don't let z-index'd child elements float above other things on the page */
119+
z-index: 0;
120+
display: block;
121+
min-inline-size: var(--mod-slider-min-size, var(--spectrum-slider-min-size));
122+
123+
user-select: none;
124+
125+
&:dir(rtl),
126+
&:dir(rtl) {
127+
--spectrum-logical-rotation: matrix(-1, 0, 0, 1, 0, 0);
128+
}
129+
130+
&:not(.spectrum-Slider--sideLabel) .spectrum-Slider-labelContainer + .spectrum-Slider-controls:has(.spectrum-Slider-ramp) {
131+
margin-block-start: calc(var(--mod-slider-ramp-track-height, var(--spectrum-slider-ramp-track-height)) / 2);
132+
}
133+
}
134+
172135
.spectrum-Slider--sideLabel {
173136
display: flex;
174137
align-items: center;
@@ -593,12 +556,6 @@
593556
&::before {
594557
background: var(--highcontrast-slider-track-color-static, var(--mod-slider-track-color, var(--spectrum-slider-track-color)));
595558
}
596-
597-
/* Styles below are applied to the sibling spectrum-Slider-track when filled-offset variant is activated */
598-
& ~ .spectrum-Slider-track::before {
599-
border-start-end-radius: var(--mod-slider-track-corner-radius, var(--spectrum-slider-track-corner-radius));
600-
border-end-end-radius: var(--mod-slider-track-corner-radius, var(--spectrum-slider-track-corner-radius));
601-
}
602559
}
603560

604561
/* All variants other than filled-offset get a new track color for highcontrast mode */
@@ -683,8 +640,6 @@
683640
.spectrum-Slider-track {
684641
&:not(:first-of-type, :last-of-type)::before {
685642
background: var(--highcontrast-slider-filled-track-fill-color, var(--mod-slider-track-fill-color, var(--spectrum-slider-track-fill-color)));
686-
border-start-end-radius: 0;
687-
border-end-end-radius: 0;
688643
}
689644
}
690645
}

0 commit comments

Comments
 (0)