Files
kairos_miniapp/pages/home/index.scss
2026-03-27 17:55:18 +08:00

132 lines
1.9 KiB
SCSS

page {
background-color: rgba(247, 249, 252, 1);
padding-bottom: 160rpx;
}
.header {
background: var(--background);
color: white;
padding: 30rpx;
.h-1 {
display: flex;
gap: 30rpx;
.left {
flex: 1;
.t-1 {
font-size: 60rpx;
font-weight: 700;
}
.t-2 {
font-size: 28rpx;
}
}
.right {
width: 140rpx;
aspect-ratio: 1;
background-color: rgba(255, 255, 255, 0.2);
border-radius: 20rpx;
.d {
font-weight: 700;
font-size: 60rpx;
}
.c {
font-size: 24rpx;
}
}
}
.h-2 {
margin-top: 30rpx;
background-color: rgba(255, 255, 255, 0.15);
padding: 30rpx;
border-radius: 30rpx;
.title {
margin-bottom: 20rpx;
}
.num {
font-weight: 700;
}
}
}
.list {
padding: 30rpx;
.item {
background-color: white;
box-shadow: 0 4rpx 8rpx rgba(11, 27, 61, 0.04);
border-radius: 20rpx;
padding: 30rpx;
--color: rgba(0, 106, 106, 0.1);
align-items: flex-start;
gap: 30rpx;
&+.item {
margin-top: 30rpx;
}
.icon {
width: 90rpx;
aspect-ratio: 1;
border-radius: 20rpx;
background-color: var(--back);
color: rgba(99, 63, 0, 1);
}
.content {
flex: 1;
--td-tag-default-light-color: var(--back);
--td-tag-default-font-color: var(--color);
.time {
margin-left: 20rpx;
color: rgba(69, 70, 78, 1);
font-size: 28rpx;
}
.title {
font-weight: 700;
margin-top: 10rpx;
}
.desc {
color: rgb(154, 156, 158);
font-size: 28rpx;
margin-top: 10rpx;
}
}
.btn {
width: fit-content;
font-size: 28rpx;
margin: 20rpx 0 0;
background-color: rgba(242, 244, 247, 1);
color: rgba(0, 106, 106, 1);
&.active {
opacity: 0.7;
background-color: rgba(232, 245, 233, 1);
color: rgba(46, 139, 87, 1);
}
}
}
}
.tip {
margin: 0 30rpx;
padding: 30rpx;
background-color: rgba(0, 106, 106, 0.08);
border-radius: 30rpx;
color: rgba(0, 106, 106, 1);
font-size: 28rpx;
}