Radio button style fixes

This commit is contained in:
James Lyne 2021-05-28 00:14:27 +01:00
parent d5ed9392a0
commit dc4bb67a5e
2 changed files with 11 additions and 5 deletions

View File

@ -13,11 +13,11 @@
@mixin button {
appearance: none;
border: none;
box-shadow: none;
background-color: var(--background-base);
color: var(--text-base);
border-radius: var(--border-radius);
border: none;
cursor: pointer;
display: block;
text-align: center;
@ -27,6 +27,7 @@
font-family: Raleway, sans-serif;
box-sizing: border-box;
text-shadow: none;
user-select: none;
.svg-icon {
display: inline-block;
@ -52,9 +53,10 @@
@mixin button-focused {
outline: var(--outline-focus) auto thick !important;
background-color: var(--background-base);
color: var(--text-base);
//background-color: var(--background-base);
//color: var(--text-base);
z-index: 1;
border-color: var(--background-dark);
}
@mixin button-active {

View File

@ -187,9 +187,10 @@ input {
& + label {
@include button;
margin-bottom: 0.1rem;
}
&:hover + label, &:checked + label {
& + label:hover, &:checked + label {
@include button-hovered;
position: relative;
}
@ -201,6 +202,10 @@ input {
&:active + label {
@include button-active;
}
&:disabled + label {
@include button-disabled;
}
}
& > li > button, & > input[type=radio] + label {
@ -211,7 +216,6 @@ input {
text-align: left;
min-height: 3.2rem;
border-radius: 0.5rem;
border-bottom: 0.1rem solid transparent;
}
}