fix: prevent boxShadow and ring styles inheritance NO-JIRA

VirtusLab · Nov 22, 2023 · e7d14b2 · e7d14b2
1 parent d4d07c0
commit e7d14b2
Show file tree

Hide file tree

Showing 8 changed files with 13 additions and 3 deletions.
diff --git a/src/components/Button/Button.styles.ts b/src/components/Button/Button.styles.ts
@@ -315,6 +315,7 @@ const commonConfig = {
 
 const defaultButtonConfig = {
   ...commonConfig,
+  ring: 'unset',
   boxShadow: '$elevation-bottom-100',
   appearance: {
     primary: {

diff --git a/src/components/Checkbox/Checkbox.styles.ts b/src/components/Checkbox/Checkbox.styles.ts
@@ -50,8 +50,9 @@ export const defaultConfig = {
           hover: '$color-interaction-default-hover',
         },
       },
-      ring: '$border-width-focus',
       borderRadius: '$border-radius-medium',
+      boxShadow: '0 0 #0000',
+      ring: '$border-width-focus',
       ringInset: true,
       ringColor: {
         _: '$color-interaction-border-neutral-normal',

diff --git a/src/components/Counter/Counter.styles.ts b/src/components/Counter/Counter.styles.ts
@@ -28,12 +28,14 @@ export const defaultConfig = {
     default: {
       emphasis: {
         high: {
+          boxShadow: '0 0 #0000',
           ring: '$border-width-small',
           ringColor: '$color-border-neutral-strong',
           backgroundColor: '$color-background-default',
           color: '$color-content-primary',
         },
         low: {
+          boxShadow: '0 0 #0000',
           ring: '$border-width-small',
           ringColor: '$color-border-neutral-subtle',
           backgroundColor: '$color-background-default',

diff --git a/src/components/InlineBanner/InlineBanner.styles.ts b/src/components/InlineBanner/InlineBanner.styles.ts
@@ -28,6 +28,7 @@ export const defaultConfig = {
   p: '$space-component-padding-xLarge',
   gap: '$space-component-gap-large',
   borderRadius: '$border-radius-large',
+  boxShadow: '0 0 #0000',
   ring: '$border-width-small',
   ringInset: true,
   intent: {

diff --git a/src/components/RadioButton/RadioButton.styles.ts b/src/components/RadioButton/RadioButton.styles.ts
@@ -36,11 +36,12 @@ export const defaultConfig = {
       alignItems: 'center',
       flexShrink: 0,
       backgroundColor: '$color-interaction-background-formField',
+      borderRadius: '$border-radius-full',
+      boxShadow: '0 0 #0000',
       ring: {
         _: '$border-width-focus',
         checked: '5px',
       },
-      borderRadius: '$border-radius-full',
       ringInset: true,
       ringColor: {
         _: '$color-interaction-border-neutral-normal',

diff --git a/src/components/SocialButton/SocialButton.styles.ts b/src/components/SocialButton/SocialButton.styles.ts
@@ -36,7 +36,9 @@ export const defaultConfig = {
         selected: '$color-action-outline-selected',
       },
     },
-    primary: {},
+    primary: {
+      ring: 'unset',
+    },
   },
 } satisfies SocialButtonConfig;
 

diff --git a/src/components/StatusDot/StatusDot.styles.ts b/src/components/StatusDot/StatusDot.styles.ts
@@ -23,6 +23,7 @@ export const defaultConfig = {
     },
   },
   hasStroke: {
+    boxShadow: '0 0 #0000',
     ring: '$border-width-medium',
     ringColor: '$color-border-inverted',
   },

diff --git a/src/components/TextInput/TextInput.styles.ts b/src/components/TextInput/TextInput.styles.ts
@@ -31,6 +31,7 @@ export const defaultConfig = {
   padding: '$space-component-padding-small $space-component-padding-large',
   flexShrink: 0,
   ringInset: true,
+  boxShadow: '0 0 #0000',
   ring: '$border-width-small',
   ringColor: {
     _: '$color-interaction-border-neutral-normal',