Fun/TeyvatGuide
1
0
Fork 0
mirror of https://github.com/BTMuli/TeyvatGuide.git synced 2025-12-12 09:18:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

💄 调整innerIcon

Browse Source
This commit is contained in:
目棃
2024-11-21 09:01:48 +08:00
parent 3fd33176a4
commit 5f77344fa3
1 changed files with 9 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/components/app/t-item-box.vue
View File

@@ -1,22 +1,14 @@
<template> <template>
<div class="tib-box"> <div class="tib-box">
<div class="tib-bg"> <div class="tib-bg">
<slot name="bg"> <slot name="bg"><img :src="props.modelValue.bg" alt="bg" /></slot>
<img :src="props.modelValue.bg" alt="bg" />
</slot>
</div> </div>
<div class="tib-icon"> <div class="tib-icon">
<slot name="icon"> <slot name="icon"><img :src="props.modelValue.icon" alt="icon" /></slot>
<img :src="props.modelValue.icon" alt="icon" />
</slot>
</div> </div>
<div class="tib-cover"> <div class="tib-cover">
<div class="tib-lt"> <div class="tib-lt"><img :src="props.modelValue.lt" alt="lt" /></div>
<img :src="props.modelValue.lt" alt="lt" /> <div v-show="props.modelValue.rt" class="tib-rt">{{ props.modelValue.rt }}</div>
</div>
<div v-show="props.modelValue.rt" class="tib-rt">
{{ props.modelValue.rt }}
</div>
<div class="tib-inner"> <div class="tib-inner">
<slot name="inner-icon"> <slot name="inner-icon">
<img <img
@@ -32,13 +24,13 @@
</div> </div>
<div v-if="props.modelValue.display === 'outer'" class="tib-outer"> <div v-if="props.modelValue.display === 'outer'" class="tib-outer">
<slot name="outer-text"> <slot name="outer-text">
<span>{{ props.modelValue.outerText }}</span> <span :title="props.modelValue.innerText">{{ props.modelValue.outerText }}</span>
</slot> </slot>
</div> </div>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
export interface TItemBoxData { export type TItemBoxData = {
bg: string; bg: string;
icon: string; icon: string;
size: string; size: string;
@@ -55,11 +47,8 @@ export interface TItemBoxData {
outerHeight?: number; outerHeight?: number;
outerText?: string; outerText?: string;
innerBlur?: string; innerBlur?: string;
} };
type TItemBoxProps = { modelValue: TItemBoxData };
interface TItemBoxProps {
modelValue: TItemBoxData;
}
const props = defineProps<TItemBoxProps>(); const props = defineProps<TItemBoxProps>();
const size = props.modelValue.size; const size = props.modelValue.size;
@@ -179,7 +168,7 @@ const innerBlur = props.modelValue.innerBlur ?? "0";
.tib-inner img { .tib-inner img {
width: v-bind(sizeInner); width: v-bind(sizeInner);
height: v-bind(sizeInner); height: v-bind(sizeInner);
margin-right: 5px; padding: 1px;
} }
.tib-inner span { .tib-inner span {