angestoepselt/homepage
5
0
Fork 0
mirror of https://codeberg.org/angestoepselt/homepage.git synced 2025-05-24 14:46:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

make distinction between selected, unselected and disabled radio buttons clearer

Browse source
This commit is contained in:
Alexej Rotar 2023-11-20 18:12:46 +01:00
parent 2fca260bfe
commit 2f34ca8637
1 changed files with 7 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
styles/components/_form-elements.scss
View file

@ -112,8 +112,8 @@
&:checked { &:checked {
+ .form-input > label { + .form-input > label {
font-weight: typography.$emphasized-weight; font-weight: typography.$emphasized-weight;
color: colors.$teal-800; color: colors.$gray-50;
border-color: colors.$teal-800; background-color: colors.$gray-600;
@include colors.coderdojo-theme { @include colors.coderdojo-theme {
color: colors.$orange-500; color: colors.$orange-500;
@ -121,6 +121,7 @@
&::before { &::before {
opacity: 1; opacity: 1;
color: colors.$gray-600;
} }
} }
} }
@ -130,10 +131,13 @@
} }
&:disabled + .form-input > label { &:disabled + .form-input > label {
background-color: colors.$gray-300; color: colors.$gray-600;
border-color: colors.$gray-600;
border: 1px solid colors.$gray-300;
&:hover { &:hover {
cursor: default; cursor: default;
background-color: colors.$gray-50;
} }
} }
} }