优化各种分辨率下标签图标的显示
This commit is contained in:
parent
0f073e6c81
commit
3620763129
@ -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 {
|
||||||
|
|||||||
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -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 {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user