show item names in collection cards
This commit is contained in:
parent
7f9398efbd
commit
c90da7ad4e
3 changed files with 32 additions and 1 deletions
|
|
@ -54,6 +54,7 @@
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@use '$src/themes/spacing' as *;
|
@use '$src/themes/spacing' as *;
|
||||||
|
@use '$src/themes/typography' as typography;
|
||||||
|
|
||||||
.character-card {
|
.character-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -103,6 +104,12 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.character-name {
|
.character-name {
|
||||||
display: none;
|
font-size: typography.$font-small;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
text-align: center;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -35,10 +35,12 @@
|
||||||
ulb={summon.summon?.uncap?.ulb}
|
ulb={summon.summon?.uncap?.ulb}
|
||||||
transcendence={summon.summon?.uncap?.transcendence}
|
transcendence={summon.summon?.uncap?.transcendence}
|
||||||
/>
|
/>
|
||||||
|
<span class="summon-name">{displayName}</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@use '$src/themes/spacing' as *;
|
@use '$src/themes/spacing' as *;
|
||||||
|
@use '$src/themes/typography' as typography;
|
||||||
|
|
||||||
.summon-card {
|
.summon-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -76,4 +78,14 @@
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.summon-name {
|
||||||
|
font-size: typography.$font-small;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
text-align: center;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -40,10 +40,12 @@
|
||||||
ulb={weapon.weapon?.uncap?.ulb}
|
ulb={weapon.weapon?.uncap?.ulb}
|
||||||
transcendence={weapon.weapon?.uncap?.transcendence}
|
transcendence={weapon.weapon?.uncap?.transcendence}
|
||||||
/>
|
/>
|
||||||
|
<span class="weapon-name">{displayName}</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@use '$src/themes/spacing' as *;
|
@use '$src/themes/spacing' as *;
|
||||||
|
@use '$src/themes/typography' as typography;
|
||||||
|
|
||||||
.weapon-card {
|
.weapon-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -81,4 +83,14 @@
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.weapon-name {
|
||||||
|
font-size: typography.$font-small;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
text-align: center;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue