diff --git a/packages/theme/styles/components.scss b/packages/theme/styles/components.scss index 51f5fbf52b..f1faf264c3 100644 --- a/packages/theme/styles/components.scss +++ b/packages/theme/styles/components.scss @@ -431,27 +431,17 @@ } } } - &.marker-visible.checked { - .marker { - background-color: var(--primary-button-disabled); - - &::after { - content: ''; - } - } - } &.disabled { cursor: not-allowed; - .marker { - background-color: var(--primary-button-disabled); - border-color: transparent; - } - &.checked { - marker::after { - content: ''; - opacity: 0.4; + .marker { + background-color: var(--primary-button-disabled); + + &::after { + content: ''; + background-color: var(--primary-button-disabled-color); + } } } diff --git a/packages/ui/src/components/RadioButton.svelte b/packages/ui/src/components/RadioButton.svelte index bc72f71c96..5fbe1fe429 100644 --- a/packages/ui/src/components/RadioButton.svelte +++ b/packages/ui/src/components/RadioButton.svelte @@ -29,7 +29,6 @@ export let action: () => void = () => {} export let gap: 'large' | 'small' | 'medium' | 'none' = 'none' export let labelGap: 'large' | 'medium' = 'medium' - export let isMarkerVisible: boolean = false @@ -39,7 +38,6 @@ class:disabled class:checked={group === value} tabindex="-1" - class:marker-visible={isMarkerVisible} on:click={() => { if (!disabled && group !== value) action() }}