106 lines
2.5 KiB
SCSS
106 lines
2.5 KiB
SCSS
.form-check-label
|
|
{
|
|
text-transform: uppercase;
|
|
color: #0dcaf0;
|
|
font-family: "Varta", sans-serif;
|
|
font-size: 1.2rem;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.form-switch .form-check-input
|
|
{
|
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'-4%20-4%208%208'%3E%3Ccircle%20r%3D'3'%20fill%3D'%230dcaf0'%2F%3E%3C%2Fsvg%3E");
|
|
background-color: transparent;
|
|
border-color: #0dcaf0;
|
|
margin-top: 0;
|
|
transition: all .15s cubic-bezier(0, .8, .2, 1);
|
|
|
|
&:focus
|
|
{
|
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'-4%20-4%208%208'%3E%3Ccircle%20r%3D'3'%20fill%3D'%230dcaf0'%2F%3E%3C%2Fsvg%3E");
|
|
}
|
|
|
|
&:checked
|
|
{
|
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'-4%20-4%208%208'%3E%3Ccircle%20r%3D'3'%20fill%3D'%2310182b'%2F%3E%3C%2Fsvg%3E");
|
|
background-color: #0dcaf0;
|
|
box-shadow: 0 0 0 1px #10182b inset;
|
|
|
|
&:focus
|
|
{
|
|
box-shadow: 0 0 0 1px #10182b inset, 0 0 0 0.25rem rgba(13, 110, 253, .25);
|
|
}
|
|
}
|
|
}
|
|
|
|
.form-switch
|
|
{
|
|
min-height: auto;
|
|
}
|
|
|
|
:-webkit-autofill,
|
|
:-webkit-autofill:hover,
|
|
:-webkit-autofill:focus
|
|
{
|
|
-webkit-text-fill-color: #ff9c07 !important; // Hack because color cannot be overridden
|
|
-webkit-box-shadow: 0 0 0px 1000px #0f1626 inset; // Hack because background-color cannot be overridden
|
|
}
|
|
|
|
.form-control, .form-select
|
|
{
|
|
border-color: rgb(0 231 255 / 75%);
|
|
background-color: transparent;
|
|
color: #ff9c07;
|
|
border-radius: 3rem;
|
|
|
|
&:focus, &:active
|
|
{
|
|
background-color: transparent;
|
|
color: #ff9c07;
|
|
}
|
|
|
|
&:focus
|
|
{
|
|
border-color: #00e7ff;
|
|
box-shadow: 0 0 .75rem -.1rem #00e7ff, 0 0 0.25rem #00e7ff, 0 0 .5rem -.25rem #00e7ff inset;
|
|
}
|
|
|
|
&:disabled, &[readonly]
|
|
{
|
|
background-color: transparent;
|
|
color: rgba(255, 156, 7, .5);
|
|
border-color: rgba(0, 231, 255, .25);
|
|
}
|
|
|
|
&::placeholder
|
|
{
|
|
color: rgba(13, 202, 240, .35);
|
|
}
|
|
|
|
&:-ms-input-placeholder
|
|
{
|
|
color: rgba(13, 202, 240, .35);
|
|
}
|
|
|
|
&::-ms-input-placeholder
|
|
{
|
|
color: rgba(13, 202, 240, .35);
|
|
}
|
|
}
|
|
|
|
.form-select
|
|
{
|
|
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%230596b2' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
|
|
|
|
option
|
|
{
|
|
background: #11182b;
|
|
}
|
|
}
|
|
|
|
.form-floating > label
|
|
{
|
|
padding: 1.25rem .75rem;
|
|
opacity: .65;
|
|
}
|