Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Unify focus states in <Checkbox>, <Radio>, <Toggle>, and <YesNo> components

Browse Source 
[MAILPOET-4546]
This commit is contained in:
 Ján Mikláš
2024-10-08 17:04:18 -05:00
committed by Ján Mikláš
parent 712481c426
commit 43f95d21fd
5 changed files with 17 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
mailpoet/assets/css/src/generic/_forms-checkbox.scss
View File

@ -21,7 +21,7 @@
&:focus {
~ .mailpoet-form-checkbox-control {
border: 2px solid $color-input-border;
border-color: $color-input-border-focus;
}
}
}

2
mailpoet/assets/css/src/generic/_forms-radio.scss
View File

@ -21,7 +21,7 @@
&:focus {
~ .mailpoet-form-radio-control {
border: 2px solid $color-input-border;
border-color: $color-input-border-focus;
}
}
}

6
mailpoet/assets/css/src/generic/_forms-toggle.scss
View File

@ -12,6 +12,12 @@
opacity: 0;
position: absolute;
width: 1px;
&:focus {
~ .mailpoet-form-toggle-control {
border-color: $color-input-border-focus;
}
}
}
}

7
mailpoet/assets/css/src/generic/_forms-yesno.scss
View File

@ -25,6 +25,13 @@
opacity: 0;
position: absolute;
width: 1px;
&:focus {
~ .mailpoet-form-yesno-control {
box-shadow: 0 0 0 1px $color-input-border-focus;
z-index: 1;
}
}
}
}

2
mailpoet/assets/css/src/settings/_colors.scss
View File

@ -31,6 +31,7 @@ $color-tertiary-hover: darken($color-tertiary, 10%);
$color-tertiary-light: #dcdcde;
$color-grey-0: #f6f7f7;
$color-tertiary-light-hover: darken($color-tertiary-light, 10%);
$color-tertiary-light-focus: #777;
$color-tertiary-light-background: rgba($color-tertiary-light, 0.3);
$color-destructive: #b52727;
$color-destructive-hover: #a02222;
@ -46,6 +47,7 @@ $color-text-dark: #2c3338;
// Form colors
$color-input-background: #fdfdff;
$color-input-border: $color-tertiary-light-hover;
$color-input-border-focus: $color-tertiary-light-focus;
$color-input-error: #f00;
$color-input-success: #7ed321;