gotosocial/web/source/css/components/forms.css
2024-11-05 15:53:22 +01:00

68 lines
1.1 KiB
CSS

input, select, textarea, .input {
box-sizing: border-box;
border: 0.15rem solid $input-border;
border-radius: 0.1rem;
color: $fg;
background: $input-bg;
width: 100%;
font-family: 'Noto Sans', sans-serif;
font-size: 1rem;
padding: 0.3rem;
&:focus, &:active {
border-color: $input-focus-border;
}
&:invalid, .invalid & {
border-color: $input-error-border;
}
&:disabled {
background: transparent;
}
&::placeholder {
opacity: 1;
color: $fg-reduced
}
}
.button, button {
border-radius: $br-inner;
color: $button-fg;
background: $button-bg;
box-shadow: $boxshadow;
border: $button-border;
text-decoration: none;
font-size: 1.2rem;
font-weight: bold;
padding: 0.5rem;
border: none;
cursor: pointer;
text-align: center;
font-family: 'Noto Sans', sans-serif;
&.danger {
color: $button-danger-fg;
background: $button-danger-bg;
&:hover {
background: $button-danger-hover-bg;
}
}
&:disabled,
&.disabled {
color: $white2;
background: $gray2;
cursor: not-allowed;
&:hover {
background: $gray3;
}
}
&:hover {
background: $button-hover-bg;
}
}