diff --git a/ui/components/ui/toggle-button/index.scss b/ui/components/ui/toggle-button/index.scss index e37833c1c..57bbd4505 100644 --- a/ui/components/ui/toggle-button/index.scss +++ b/ui/components/ui/toggle-button/index.scss @@ -33,4 +33,8 @@ visibility: hidden; } } + + &--disabled { + opacity: 0.5; + } } diff --git a/ui/components/ui/toggle-button/toggle-button.component.js b/ui/components/ui/toggle-button/toggle-button.component.js index d16bcfcfc..2c935ad90 100644 --- a/ui/components/ui/toggle-button/toggle-button.component.js +++ b/ui/components/ui/toggle-button/toggle-button.component.js @@ -47,15 +47,19 @@ const colors = { }; const ToggleButton = (props) => { - const { value, onToggle, offLabel, onLabel } = props; + const { value, onToggle, offLabel, onLabel, disabled } = props; const modifier = value ? 'on' : 'off'; return ( -
+
setLedgerLivePreference(!value)} offLabel={t('off')} onLabel={t('on')} + disabled={getPlatform() === PLATFORM_FIREFOX} />