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

Optimization, small tailwind tweaks

Browse Source
This commit is contained in:
Colin Kallemein
2024-07-06 23:31:37 +02:00
parent 5fad4583ad
commit dfe5550fa6
14 changed files with 66 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/screens/Characters.vue
View File

@ -3,7 +3,7 @@
<div class="absolute bg-[url('/assets/shapes/select-screen-bg-shape.svg')] bg-no-repeat bg-center w-full h-full"></div>
<div class="ui-wrapper h-dvh flex flex-col justify-center items-center gap-[80px] px-[80px]">
<div class="filler"></div>
<div class="characters-wrapper flex justify-center flex-wrap gap-[60px] w-full max-h-[650px] overflow-auto" v-if="!isLoading">
<div class="flex justify-center flex-wrap gap-[60px] w-full max-h-[650px] overflow-auto" v-if="!isLoading">
<div v-for="character in characters" :key="character.id" class="character m-[15px] w-[170px] h-[275px] flex flex-col rounded-[20px] relative bg-[url('/assets/shapes/character-select-shape.svg')] bg-no-repeat shadow-character" :class="{ active: selected_character == character.id }">
<input class="opacity-0 h-full w-full absolute m-0 z-10" type="radio" :id="character.id" name="character" :value="character.id" v-model="selected_character" />
<label class="font-bold absolute left-1/2 top-[20px] max-w-[130px] translate-x-[-50%] translate-y-[-50%] text-center text-ellipsis overflow-hidden whitespace-nowrap drop-shadow-text" :for="character.id">{{ character.name }}</label>
@ -116,14 +116,10 @@ onBeforeUnmount(() => {
</script>
<style lang="scss">
@import '@/assets/scss/main';
.characters-wrapper {
.character {
&.active {
.selected-character {
@apply max-w-[170px];
}
.character {
&.active {
.selected-character {
@apply max-w-[170px];
}
}
}