imshvc/noxious_client
1
0
Fork 0
forked from noxious/client
Code Pull Requests Activity

Remove modal- classes and re implemented styling

Browse Source
This commit is contained in:
Colin Kallemein
2024-07-04 23:19:22 +02:00
parent d15e5f796f
commit 5dd8664c34
9 changed files with 38 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/screens/Characters.vue
View File

@ -40,23 +40,19 @@
<Modal :isModalOpen="isModalOpen" @modal:close="isModalOpen = false">
<template #modalHeader>
<h3 class="modal-title">Create your character</h3>
<h3 class="m-0 font-medium shrink-0">Create your character</h3>
</template>
<template #modalBody>
<div class="container character-form">
<form method="post" @submit.prevent="create" class="modal-form">
<div class="form-fields">
<div class="form-field">
<label for="name">Name</label>
<input class="input-cyan" v-model="name" name="name" id="name" />
</div>
</div>
<div class="submit">
<button class="btn-cyan" type="submit">CREATE</button>
<div class="m-[15px] character-form">
<form method="post" @submit.prevent="create" class="inline">
<div class="flex flex-col mb-5">
<label class="mb-1.5 font-titles" for="name">Name</label>
<input class="input-cyan max-w-[250px]" v-model="name" name="name" id="name" />
</div>
<button class="btn-cyan py-1.5 px-[15px] mr-[20px] min-w-[100px] inline-block" type="submit">CREATE</button>
</form>
<button class="btn-cyan" @click="isModalOpen = false">CANCEL</button>
<button class="btn-cyan py-1.5 px-[15px] min-w-[100px] inline-block" @click="isModalOpen = false">CANCEL</button>
</div>
</template>
</Modal>
@ -322,9 +318,5 @@ onBeforeUnmount(() => {
}
}
}
.modal-title {
margin: 0;
}
}
</style>