Move subname to its own row to make space
This commit is contained in:
parent
b9e0d096ba
commit
10396b24f1
2 changed files with 35 additions and 6 deletions
|
@ -2,12 +2,19 @@
|
|||
<section class="decklist">
|
||||
<article v-for="(card, i) in cards" :key="i">
|
||||
<div class="amt">{{ card.howmany }}</div>
|
||||
<div class="name">{{ fullName(card.data) }}</div>
|
||||
<div class="fullname">
|
||||
<div class="name">{{ card.data.Name }}</div>
|
||||
<div class="subname">
|
||||
{{ card.data.Subname ? card.data.Subname : "" }}
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/scss/_variables";
|
||||
|
||||
.decklist {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -15,17 +22,38 @@
|
|||
article {
|
||||
display: flex;
|
||||
align-content: space-between;
|
||||
align-items: center;
|
||||
border: 1px solid $grey;
|
||||
border-radius: 10px;
|
||||
padding: 5px 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.fullname {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.amt {
|
||||
margin: 0 5px;
|
||||
margin: 0 10pt;
|
||||
font-weight: bold;
|
||||
&:after {
|
||||
content: "x";
|
||||
content: " x";
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
font-family: $fantasy;
|
||||
font-size: 10.5pt;
|
||||
line-height: 1rem;
|
||||
}
|
||||
|
||||
.subname {
|
||||
color: $grey-light;
|
||||
font-size: 10pt;
|
||||
line-height: 1rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script lang="ts">
|
||||
|
|
|
@ -101,9 +101,11 @@
|
|||
}
|
||||
|
||||
.decklist {
|
||||
padding: 10px;
|
||||
padding-top: 15px;
|
||||
grid-column: 2;
|
||||
header {
|
||||
padding: 10px;
|
||||
padding-top: 15px;
|
||||
padding-left: 1rem;
|
||||
color: $primary-text;
|
||||
font-family: $fantasy;
|
||||
h1 {
|
||||
|
@ -111,7 +113,6 @@
|
|||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
.colorfilter,
|
||||
|
|
Loading…
Reference in a new issue