Increase opacity on placeholder in Select (#4369)

cultureamp · Nov 27, 2023 · 379d301 · 379d301
1 parent 5baff64
commit 379d301
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 19 deletions.
diff --git a/.changeset/honest-weeks-sniff.md b/.changeset/honest-weeks-sniff.md
@@ -0,0 +1,5 @@
+---
+"@kaizen/components": patch
+---
+
+Change placeholder opacity on Select
diff --git a/packages/components/src/Select/Select.module.scss b/packages/components/src/Select/Select.module.scss
@@ -5,7 +5,7 @@
 
 // Should match the values for the Input component
 $input-height: 48px;
-$input-placeholder-opacity: 0.5;
+$input-placeholder-opacity: 0.7;
 
 $focus-border-color: $color-blue-500;
 

diff --git a/packages/components/src/Select/_docs/Select.stickersheet.stories.tsx b/packages/components/src/Select/_docs/Select.stickersheet.stories.tsx
@@ -14,11 +14,6 @@ export default {
     a11y: {
       config: {
         rules: [
-          {
-            // Placeholders do not pass color contrast
-            id: "color-contrast",
-            enabled: false,
-          },
           {
             // React-select's list structure missing when there are no options (third-party a11y issue)
             id: "aria-required-children",

diff --git a/packages/components/src/Select/_docs/Select.stories.tsx b/packages/components/src/Select/_docs/Select.stories.tsx
@@ -41,19 +41,6 @@ const meta = {
     options: OPTIONS,
     label: "Select",
   },
-  parameters: {
-    a11y: {
-      config: {
-        rules: [
-          {
-            // Placeholders do not pass color contrast
-            id: "color-contrast",
-            enabled: false,
-          },
-        ],
-      },
-    },
-  },
 } satisfies Meta<typeof Select>
 
 export default meta