优化会员信息模块及首页组件,清理冗余图片资源
This commit is contained in:
@@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<view class="skeleton" :style="{ padding: padding }">
|
||||
<slot />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
defineProps({
|
||||
padding: {
|
||||
type: String,
|
||||
default: '20rpx'
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.skeleton {
|
||||
background-color: #f5f5f5;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
:deep(.skeleton-shimmer) {
|
||||
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
|
||||
background-size: 200% 100%;
|
||||
animation: shimmer 1.5s infinite;
|
||||
}
|
||||
|
||||
:deep(.skeleton-line) {
|
||||
height: 32rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
:deep(.skeleton-block) {
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
:deep(.skeleton-circle) {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
@keyframes shimmer {
|
||||
0% { background-position: 200% 0; }
|
||||
100% { background-position: -200% 0; }
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user