Generateurv2/frontend/styles/room/input.module.scss
2022-05-18 10:15:54 +02:00

85 lines
1.5 KiB
SCSS

@import "../variables";
/* .input-challenge {
background-color: transparent;
border: none;
border-bottom: 1px solid $border;
color: whitesmoke;
width: 50px;
padding: 5px;
&:focus {
border: none;
outline: none;
border-bottom: 1px solid $border;
background-color: rgba($background, 0.3);
}
} */
.span {
border: 2px solid #666;
/* box-sizing: border-box; */
/* padding: 0.5em 1em; */
//padding: 0.5em 1em;
outline: 0;
background-color: transparent;
border: none;
border-bottom: 1px solid $border;
color: whitesmoke;
padding: 5px;
}
.input {
width: 6em;
//padding: 0.5em 1em;
font-size: 1em;
outline: 0;
background-color: transparent;
border: none;
border-bottom: 1.5px solid lighten($color: $border, $amount: 10);
color: whitesmoke;
min-width: 50px;
padding: 5px;
max-width: 200px;
&:focus {
border: none;
outline: none;
border-bottom: 1px solid $border;
background-color: rgba($background, 0.3);
}
}
.span {
position: absolute;
left: -9999px;
display: inline-block;
// min-width: 6em;
}
.valid {
border-bottom: 2px solid $green;
color: $green;
font-weight: 600;
}
.invalid {
border-bottom: 2px solid $red;
color: $red;
font-weight: 900;
}
/* .disabled{
background: rgba($background, 0.2);
} */
.withoutCorrection {
border-bottom: 2px solid grey;
color: grey;
font-weight: 600;
}
.correction-menu {
position: absolute;
top: -80%;
background-color: blue;
}