优化各种分辨率下标签图标的显示

This commit is contained in:
jmal 2024-03-15 15:18:27 +08:00
parent 0f073e6c81
commit 3620763129
3 changed files with 25 additions and 16 deletions

View File

@ -32,14 +32,12 @@
</div> </div>
<div v-if="item.tags && item.tags.length > 0 && !public"> <div v-if="item.tags && item.tags.length > 0 && !public">
<div v-if="pc"> <div v-if="pc">
<svg-icon v-if="!grid" class="pc list icon-tag" icon-class="tag2"/> <svg-icon v-if="grid" class="pc grid icon-tag" icon-class="tag2" :style="{left: 14 * index -9 + 'px', color: tag.color}" v-for="(tag,index) in item.tags.slice(0, 7)" :key="index"/>
<span v-if="grid"> <svg-icon v-else class="pc list icon-tag" icon-class="tag2" :style="{left: 14 * index + 3 + 'px', color: tag.color}" v-for="(tag,index) in item.tags.slice(0, 5)" :key="index"/>
<svg-icon class="pc grid icon-tag" icon-class="tag2" :style="{left: 14 * index -9 + 'px', color: tag.color}" v-for="(tag,index) in item.tags.slice(0, 7)" :key="index"/>
</span>
</div> </div>
<div v-else> <div v-else>
<svg-icon v-if="!grid" class="mobile list icon-tag" icon-class="tag2"/> <svg-icon v-if="grid" class="mobile grid icon-tag" icon-class="tag2" :style="{left: 1 * index + 'rem', color: tag.color}" v-for="(tag,index) in item.tags.slice(0, 5)" :key="index"/>
<svg-icon v-if="grid" class="mobile grid icon-tag" icon-class="tag2"/> <svg-icon v-else class="mobile list icon-tag" icon-class="tag2" :style="{left: 1 * index + 'rem', color: tag.color}" v-for="(tag,index) in item.tags.slice(0, 3)" :key="index"/>
</div> </div>
</div> </div>
<div v-if="item.ossFolder && !public"> <div v-if="item.ossFolder && !public">
@ -256,23 +254,27 @@ export default {
.pc.grid.icon-tag { .pc.grid.icon-tag {
font-size: 14px; font-size: 14px;
left: 0; left: 0;
bottom: -18px; bottom: -10px;
} }
.mobile.grid.icon-tag { .mobile.grid.icon-tag {
width: 1.3rem; width: 1rem;
height: 1.3rem; height: 1rem;
margin-left: 2.8rem; left: 0;
bottom: 1.6rem;
} }
.pc.list.icon-tag { .pc.list.icon-tag {
font-size: 1rem; font-size: 12px;
right: 1.3rem; left: 3px;
bottom: 3px;
} }
.mobile.list.icon-tag { .mobile.list.icon-tag {
font-size: 0.5rem; width: 1rem;
margin-left: 0.5rem; height: 1rem;
left: 0;
bottom: 0;
} }
.oss-folder { .oss-folder {

View File

@ -382,11 +382,15 @@ export default {
text-align: center; text-align: center;
position: relative; position: relative;
> > > .icon-favorite { >>>.icon-favorite {
display: none; display: none;
} }
> > > .icon-share { >>>.icon-share {
display: none;
}
>>>.icon-tag {
display: none; display: none;
} }

View File

@ -4175,6 +4175,9 @@ export default {
>>> .icon-share { >>> .icon-share {
display: none; display: none;
} }
>>> .icon-tag {
display: none;
}
} }
.drawer-icon-font >>> .svg-icon { .drawer-icon-font >>> .svg-icon {