web-development/onmyoji-deck-builder
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

centering chosen cards in deck

Browse Source
This commit is contained in:
Daniel Tomlinson
2021-03-17 15:19:26 +00:00
parent 268cc5f32c
commit 31015e8b31
1 changed files with 23 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/views/DeckBuilder.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<v-container> <v-container fluid px-16 pb-10>
<v-row> <v-row>
<v-col cols="12"> <v-col cols="12">
<div class="text-center"> <div class="text-center">
@@ -78,7 +78,7 @@
</div> </div>
<div cols="12"> <div cols="12">
<!-- {{ index }} --> <!-- {{ index }} -->
{{selected_shikigami_decks[index][index].length}} <!-- {{ selected_shikigami_decks[index][index].length }} -->
<v-select <v-select
v-model="selected_shikigami_decks[index][index]" v-model="selected_shikigami_decks[index][index]"
v-on:input="limit_decks" v-on:input="limit_decks"
@@ -91,7 +91,7 @@
persistent-hint persistent-hint
return-object return-object
> >
<template v-slot:selection="{data, pos}"> <template v-slot:selection="{ data, pos }">
<v-chip <v-chip
v-if="pos === 0" v-if="pos === 0"
v-bind="data.attrs" v-bind="data.attrs"
@@ -104,32 +104,35 @@
>{{ data.item.name }}</v-chip >{{ data.item.name }}</v-chip
> >
<span v-if="pos === 1" class="grey--text caption"> <span v-if="pos === 1" class="grey--text caption">
(+{{ selected_shikigami_decks[index][index].length - 1 }} others) (+{{ selected_shikigami_decks[index][index].length - 1 }}
others)
</span></template </span></template
> >
</v-select> </v-select>
</div> </div>
</div> </div>
</v-col> </v-col>
<v-col cols="10"> <v-col cols="10" class="d-flex align-center">
<div cols="12"> <div cols="12">
<!-- {{ selected_shikigami_decks[index][index] }} --> <!-- {{ selected_shikigami_decks[index][index] }} -->
</div> </div>
<v-row cols="12" class="d-flex"> <v-row cols="12" class="">
<v-card <v-card
v-for="i in selected_shikigami_decks[index][index]" v-for="i in selected_shikigami_decks[index][index]"
:key="i.id" :key="i.id"
width="12.4%" width="12.4%"
color="#070042" color="#070042"
> class=""
<div class="text-center"> >
<!-- {{ i.name }} --> <!-- <div class="text-center">
</div> {{ i.name }}
<v-img </div> -->
:src="require(`@/assets/deck_of_cards/${i.url}`)" <div class="">
class="deck-card" <v-img
></v-img :src="require(`@/assets/deck_of_cards/${i.url}`)"
></v-card> class="deck-card"
></v-img></div
></v-card>
</v-row> </v-row>
</v-col> </v-col>
</v-row> </v-row>