fix select input color; closes #1143

docs/resources/changelog.md

@@ -21,6 +21,7 @@ New versions of Shoelace are released as-needed and generally occur when a criti
 - Fixed a bug in `<sl-select>` that caused tags to not be rounded when using the `pill` attribute [#1117](https://github.com/shoelace-style/shoelace/issues/1117)
 - Fixed a bug in `<sl-select>` where the `sl-change` and `sl-input` events didn't weren't emitted when removing tags [#1119](https://github.com/shoelace-style/shoelace/issues/1119)
 - Fixed a bug in `<sl-select>` that caused the listbox to scroll to the first selected item when selecting multiple items [#1138](https://github.com/shoelace-style/shoelace/issues/1138)
+- Fixed a bug in `<sl-select>` where the input color and input hover color wasn't using the correct design tokens [#1143](https://github.com/shoelace-style/shoelace/issues/1143)
 - Fixed a bug in `<sl-color-picker>` that logged a console error when parsing swatches with whitespace
 - Fixed a bug in `<sl-color-picker>` that caused selected colors to be wrong due to incorrect HSV calculations
 - Fixed a bug in `<sl-color-picker>` that prevented the initial value from being set as a property [#1141](https://github.com/shoelace-style/shoelace/issues/1141)

src/components/select/select.styles.ts

@@ -56,6 +56,7 @@ export default css`
     font: inherit;
     border: none;
     background: none;
+    color: var(--sl-input-color);
     cursor: inherit;
     overflow: hidden;
     padding: 0;
@@ -63,6 +64,10 @@ export default css`
     -webkit-appearance: none;
   }
 
+  .select:not(.select--disabled):hover .select__display-input {
+    color: var(--sl-input-color-hover);
+  }
+
   .select__display-input:focus {
     outline: none;
   }