refactor: Remove unused CSS properties and update file-input styling

Amsterdam · May 17, 2024 · 930006b · 930006b
1 parent dea8cff
commit 930006b
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/packages/css/src/components/file-input/file-input.scss b/packages/css/src/components/file-input/file-input.scss
@@ -8,16 +8,19 @@
 @mixin reset-button {
   border: 0;
   border-radius: 0; // Reset rounded borders on iOS devices
+  box-sizing: border-box;
 }
 
 .ams-file-input {
+  background-color: var(--ams-file-input-background-color);
   border: var(--ams-file-input-border);
   color: var(--ams-file-input-color);
   cursor: var(--ams-file-input-cursor);
   font-family: var(--ams-file-input-font-family);
   font-size: var(--ams-file-input-font-size);
   font-weight: var(--ams-file-input-font-weight);
   line-height: var(--ams-file-input-line-height);
+  max-inline-size: 100%;
   outline-offset: var(--ams-file-input-outline-offset);
   padding-block: var(--ams-file-input-padding-block);
   padding-inline: var(--ams-file-input-padding-inline);
@@ -32,12 +35,13 @@
 }
 
 .ams-file-input::file-selector-button {
+  appearance: none;
   background-color: var(--ams-file-input-file-selector-button-background-color);
   box-shadow: var(--ams-file-input-file-selector-button-box-shadow);
   color: var(--ams-file-input-file-selector-button-color);
   cursor: var(--ams-file-input-file-selector-button-cursor);
   font-family: inherit;
-  font-weight: inherit;
+  font-size: inherit;
   margin-inline-end: var(--ams-file-input-file-selector-button-margin-inline-end);
   padding-block: var(--ams-file-input-file-selector-button-padding-block);
   padding-inline: var(--ams-file-input-file-selector-button-padding-inline);

diff --git a/proprietary/tokens/src/components/ams/file-input.tokens.json b/proprietary/tokens/src/components/ams/file-input.tokens.json
@@ -1,6 +1,7 @@
 {
   "ams": {
     "file-input": {
+      "background-color": { "value": "{ams.color.primary-white}" },
       "border": { "value": "{ams.border.width.sm} dashed {ams.color.neutral-grey3}" },
       "color": { "value": "{ams.color.primary-black}" },
       "cursor": { "value": "{ams.action.activate.cursor}" },
@@ -16,9 +17,9 @@
         "cursor": { "value": "{ams.action.disabled.cursor}" }
       },
       "file-selector-button": {
-        "background-color": { "value": "{ams.color.primary-white}" },
         "color": { "value": "{ams.color.primary-blue}" },
         "cursor": { "value": "{ams.action.activate.cursor}" },
+        "background-color": { "value": "{ams.color.primary-white}" },
         "box-shadow": { "value": "inset 0 0 0 {ams.border.width.md} {ams.color.primary-blue}" },
         "margin-inline-end": { "value": "{ams.space.inside.md}" },
         "padding-block": { "value": "{ams.space.inside.xs}" },