annika/isl-vue3
1
0
Fork 0
mirror of https://forgejo.merr.is/annika/isl-vue3.git synced 2025-12-14 06:13:22 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

More Bug Fixes and Tooltip Adjustments

Browse source
This commit is contained in:
Annika Merris 2024-01-21 22:14:29 -05:00
parent 10684ad79c
commit d30bde5c4d
8 changed files with 66 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/components/IntimacyPower/SpecialItemsCard.vue
View file

@ -86,10 +86,10 @@ const getColor = computed(() => (rarity: number): string => {
:headers="headers"
>
<template v-slot:item.1.itemName="{ item }">
<v-tooltip activator="parent" v-if="item[1].tooltip != undefined">
<v-card variant="text" density="compact">
<v-card-title>Origin: {{ item[1].origin }}</v-card-title>
<v-card-text>{{ item[1].tooltip }}</v-card-text>
<v-tooltip activator="parent" v-if="item[1].tooltip != undefined" content-class="custom-tooltip">
<v-card variant="text" density="compact" max-width="25vw">
<v-card-title class="px-2">Origin: {{ item[1].origin }}</v-card-title>
<v-card-text class="px-2" v-if="item[1].tooltip !== ''">{{ item[1].tooltip }}</v-card-text>
</v-card>
</v-tooltip>
<v-chip :color="`${getColor(item[1].rarity)}`">
@ -133,17 +133,7 @@ const getColor = computed(() => (rarity: number): string => {
</template>
<style lang="scss" scoped>
@use '@/styles/settings.scss';
.common {
background-color: map-get(settings.$green, 'lighten-4');
}
.rare {
background-color: map-get(settings.$blue, 'lighten-4');
}
.epic {
background-color: map-get(settings.$purple, 'lighten-4');
}
.legendary {
background-color: map-get(settings.$amber, 'lighten-4');
:global(.custom-tooltip) {
padding: 0 !important;
}
</style>