2026-01-09 14:53:42 +08:00

38 lines
878 B
Vue

<template>
<view class="card">
<view v-if="$slots.header" class="header">
<slot name="header"></slot>
</view>
<view class="default">
<slot></slot>
</view>
<view v-if="$slots.footer" class="footer">
<slot name="footer"></slot>
</view>
</view>
</template>
<style lang="scss" scoped>
.card {
margin: 0 25rpx 25rpx;
font-size: 24rpx;
overflow: hidden;
border-radius: 15rpx;
box-shadow: 0 0 6px 1px #cacaca;
color: #656565;
.header {
padding: 20rpx;
background-color: #4d80f0;
border-radius: 15rpx 15rpx 0 0;
color: #fff;
}
.default {
padding: 25rpx 20rpx;
font-size: 26rpx;
}
.footer {
padding: 20rpx;
border-radius: 0 0 15rpx 15rpx;
padding: 0 20rpx 30rpx;
}
}
</style>