Optimized and cleaned up more scss

This commit is contained in:
2024-06-04 21:27:17 +02:00
parent 3257a3511a
commit 4f96fb5824
7 changed files with 75 additions and 85 deletions

View File

@ -99,8 +99,8 @@ function create() {
.character-select-screen {
background: #dddddd;
.ui-wrapper {
// vertical and vertical center
height: 100vh;
display: flex;
flex-direction: column;
@ -123,11 +123,10 @@ function create() {
height: 275px;
display: flex;
flex-direction: column;
background-image: url('/assets/shapes/character-select-shape-unselected.svg');
background-repeat: no-repeat;
border-radius: 20px;
position: relative;
background-repeat: no-repeat;
background-image: url('/assets/shapes/character-select-shape-unselected.svg');
&.active {
background-image: url('/assets/shapes/character-select-shape.svg');
@ -152,11 +151,13 @@ function create() {
height: 100px;
margin: auto;
}
span {
align-self: center;
font-size: 16px;
}
}
&::before,
&::after {
display: none;
@ -184,7 +185,6 @@ function create() {
border-radius: 0 0 20px 20px;
}
// hide the radio buttons
input[type='radio'] {
opacity: 0;
height: 100%;
@ -208,11 +208,11 @@ function create() {
height: 30px;
padding: 5px;
border-radius: 100%;
z-index: 1;
position: absolute;
right: -10px;
top: 5px;
transform: translateY(-50%);
position: absolute;
z-index: 1;
&:hover {
background-color: $dark-red;
@ -228,7 +228,6 @@ function create() {
z-index: 1;
}
// img under the label
.sprite-container {
display: flex;
flex-direction: column;
@ -241,6 +240,7 @@ function create() {
.button-wrapper {
display: flex;
gap: 30px;
button {
padding: 8px 10px 8px 20px;
min-width: 6.25rem;
@ -260,10 +260,6 @@ function create() {
opacity: 0.3;
}
&:hover {
background-color: rgba($lilac, 0.75);
}
&:disabled {
background-color: rgba($purple, 0.5);
cursor: not-allowed;