Cleanup styling, added global styling

This commit is contained in:
2024-06-04 20:31:27 +02:00
parent 398be02486
commit 3257a3511a
5 changed files with 27 additions and 52 deletions

View File

@ -25,7 +25,7 @@
</div>
<div class="button-wrapper">
<button :disabled="!selected_character" @click="select_character()">
<button class="btn-purple" :disabled="!selected_character" @click="select_character()">
Play
<img src="/assets/icons/arrow.svg">
</button>
@ -45,10 +45,10 @@
<input v-model="name" name="name" id="name" />
</div>
<div class="submit">
<button type="submit">Create</button>
<button class="btn-purple" type="submit">Create</button>
</div>
</form>
<button @click="isModalOpen = false">Cancel</button>
<button class="btn-purple" @click="isModalOpen = false">Cancel</button>
</template>
</Modal>
</template>
@ -138,15 +138,12 @@ function create() {
background-image: none;
button {
background-color: transparent;
border: none;
height: 100%;
width: 100%;
padding: 40px 0;
display: flex;
flex-direction: column;
justify-content: space-between;
text-align: center;
&::before {
content: '';
}
@ -157,7 +154,6 @@ function create() {
}
span {
align-self: center;
color: $white;
font-size: 16px;
}
}
@ -198,7 +194,6 @@ function create() {
}
label {
color: $white;
font-weight: bold;
position: absolute;
top: 20px;
@ -209,7 +204,6 @@ function create() {
button.delete {
background-color: $red;
border: none;
width: 30px;
height: 30px;
padding: 5px;
@ -231,7 +225,6 @@ function create() {
width: 100%;
text-align: center;
transform: translateY(50%);
color: $white;
z-index: 1;
}
@ -251,19 +244,14 @@ function create() {
button {
padding: 8px 10px 8px 20px;
min-width: 6.25rem;
text-align: center;
position: relative;
background-color: rgba($purple, 0.75);
border: rgba($white, 0.35) 1px solid;
border-radius: 5px;
color: $white;
font-size: 18px;
display: flex;
gap: 10px;
align-items: center;
span {
color: $white;
margin: auto;
}