aoshisen/card
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 背景颜色

Browse Source
This commit is contained in:
aoshisen 2026-02-06 11:07:51 +08:00
parent 75761d90e0
commit aa52a881b2
1 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/Card.vue
View File

@ -23,7 +23,8 @@ img {
<!-- 利用这个元素承载 style 穿透到hover-tilt 内 --> <!-- 利用这个元素承载 style 穿透到hover-tilt 内 -->
<div class="container" :style="borderRadiusStyle"> <div class="container" :style="borderRadiusStyle">
<hover-tilt v-bind="tilt_store.tiltProps" class="hover-tilt specular-highlight"> <hover-tilt v-bind="tilt_store.tiltProps" class="hover-tilt specular-highlight">
<img :src="store.formData.image?.src ?? 'https://images.pokemontcg.io/swsh4/25_hires.png'" :style="store.imageStyle" /> <img :src="store.formData.image?.src ?? 'https://images.pokemontcg.io/swsh4/25_hires.png'"
:style="store.imageStyle" />
</hover-tilt> </hover-tilt>
</div> </div>
</template> </template>
@ -32,13 +33,20 @@ img {
.container { .container {
.hover-tilt { .hover-tilt {
&::part(tilt), &::part(tilt) {
&::part(container) {
&::before { &::before {
border-radius: var(--border-radius, 0px); border-radius: var(--border-radius, 0px);
overflow: hidden; overflow: hidden;
} }
} }
&::part(container) {
&::before {
border-radius: var(--border-radius, 0px);
overflow: hidden;
background-image: none !important;
}
}
} }
} }
</style> </style>