miniProgram/subpages/myMattress/myMattress.wxss

/* subpages/myMattress/myMattress.wxss */
page {
    background-color: #F8F9FA;
}

.mattress-list {
    display: flex;
    width: 100vw;
    flex-direction: column;
    padding-bottom: 180rpx;
    align-items: center;
}

.mattress-item {
    display: flex;
    flex-direction: row;
    margin-top: 30rpx;
    align-items: center;
    width: 670rpx;
    height: 236rpx;
    background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
    box-shadow: 20rpx 8rpx 20rpx 0rpx rgba(219, 225, 231, 0.2);
    border-radius: 28rpx;
    position: relative;
}

.item-cover {
    width: 176rpx;
    height: 176rpx;
    margin-left: 30rpx;
    display: block;
}

.right-content {
    flex: 1;
    margin-right: 30rpx;
    margin-left: 30rpx;
    display: flex;
    height: 176rpx;
    justify-content: space-between;
    flex-direction: column;
}

.item-title {
    font-size: 32rpx;
    color: #333333;
}

.item-sn {
    font-size: 24rpx;
    color: #666666;
}

.item-user {
    font-size: 24rpx;
    color: #666666;
}

.item-online {
    display: block;
    width: fit-content;
    padding: 2rpx 10rpx;
    border-radius: 40rpx;
    font-size: 20rpx;
    color: #0BC3AA;
    background: linear-gradient(90deg, #E7FAF4 11%, rgba(237, 255, 249, 0.78) 100%);
    box-sizing: border-box;
}

.item-offline {
    display: block;
    width: fit-content;
    padding: 2rpx 10rpx;
    border-radius: 40rpx;
    font-size: 20rpx;
    color: #FF424F;
    background: #FFF3F3;
    box-sizing: border-box;
}

.menu-btn {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 70rpx;
    width: 90rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.bottom-view {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.bottom-btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom: 80rpx;
    margin-top: 16rpx;
    color: #FFFFFF;
    height: 84rpx;
    font-size: 32rpx;
    width: 630rpx;
    border-radius: 40rpx;
    background: linear-gradient(315deg, #0ABCA4 0%, rgba(11, 195, 170, 0.8) 100%);
}