diff --git a/src/components/ColorPicker.css b/src/components/ColorPicker.css index 9adae99a..d652e076 100644 --- a/src/components/ColorPicker.css +++ b/src/components/ColorPicker.css @@ -99,7 +99,6 @@ border-radius: 0px 4px 4px 0px; float: left; padding-left: 0.5em; - text-transform: lowercase; } .color-picker-label-swatch { @@ -108,13 +107,3 @@ margin-right: 0.25rem; border: 1px solid #dee2e6; } - -.color-picker-swatch-input { - font-size: 1rem; - display: inline-block; - width: 6.25rem; - border-radius: 2px; - padding: 0.125em 0.25em; - border: 1px solid #dee2e6; - text-transform: lowercase; -} diff --git a/src/components/ColorPicker.tsx b/src/components/ColorPicker.tsx index 8c8c747d..3876283a 100644 --- a/src/components/ColorPicker.tsx +++ b/src/components/ColorPicker.tsx @@ -131,7 +131,7 @@ const ColorInput = React.forwardRef( className="color-picker-input" aria-label={label} onChange={e => { - const value = e.target.value; + const value = e.target.value.toLowerCase(); if (value.match(colorRegex)) { onChange(value === "transparent" ? "transparent" : "#" + value); }