1 line
4.9 KiB
Plaintext
1 line
4.9 KiB
Plaintext
.dance-container{background:linear-gradient(180deg,#2c2c54,#40407a);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh}.status-bar{align-items:center;display:-webkit-flex;display:flex;justify-content:space-between;padding:60rpx 40rpx 20rpx}.status-bar .time{color:#fff;font-size:32rpx;font-weight:600}.status-bar .status-icons{align-items:center;display:-webkit-flex;display:flex}.status-bar .status-icons .signal-icon{color:#fff;font-size:28rpx}.banner-swiper{height:450rpx;margin-bottom:60rpx}.top-banner{height:100%;padding:40rpx;position:relative}.top-banner .banner-content{align-items:flex-start;display:-webkit-flex;display:flex;height:100%;justify-content:space-between}.top-banner .left-section{display:-webkit-flex;display:flex;flex-direction:column}.top-banner .left-section .main-title,.top-banner .left-section .sub-title{color:#fff;display:block;font-size:90rpx;font-weight:900;line-height:.9;margin-bottom:10rpx}.top-banner .right-section{align-items:flex-start;display:-webkit-flex;display:flex;position:relative}.top-banner .right-section .dance-emoji{font-size:100rpx;left:-60rpx;position:absolute;top:-20rpx;z-index:1}.top-banner .right-section .promo-card{border-radius:24rpx;box-shadow:0 12rpx 40rpx rgba(0,0,0,.15);color:#fff;padding:32rpx;position:relative;width:320rpx}.top-banner .right-section .promo-card .card-header{align-items:flex-start;display:-webkit-flex;display:flex;justify-content:space-between;margin-bottom:24rpx}.top-banner .right-section .promo-card .card-header .card-subtitle,.top-banner .right-section .promo-card .card-header .card-title{display:block;font-size:40rpx;font-weight:900;line-height:1}.top-banner .right-section .promo-card .card-header .balloon-icon,.top-banner .right-section .promo-card .card-header .music-icon,.top-banner .right-section .promo-card .card-header .trophy-icon{font-size:32rpx}.top-banner .right-section .promo-card .card-content{margin-bottom:24rpx}.top-banner .right-section .promo-card .card-content .card-info{display:block;font-size:24rpx;margin-bottom:4rpx;opacity:.9}.top-banner .right-section .promo-card .card-footer{align-items:center;display:-webkit-flex;display:flex;justify-content:space-between}.top-banner .right-section .promo-card .card-footer .discount-badge{backdrop-filter:blur(10rpx);background:hsla(0,0%,100%,.25);border-radius:12rpx;padding:12rpx 20rpx}.top-banner .right-section .promo-card .card-footer .discount-badge .badge-text{color:#fff;display:block;font-size:20rpx;font-weight:700;line-height:1.2}.top-banner .right-section .promo-card .card-footer .price-section{align-items:baseline;display:-webkit-flex;display:flex;gap:8rpx}.top-banner .right-section .promo-card .card-footer .price-section .discount-label{font-size:24rpx;font-weight:500}.top-banner .right-section .promo-card .card-footer .price-section .price-value{font-size:36rpx;font-weight:900}.top-banner .right-section .hot-class-card{background:linear-gradient(135deg,#ff6b6b,#ffa726)}.top-banner .right-section .event-card{background:linear-gradient(135deg,#4ecdc4,#44a08d)}.top-banner .right-section .new-arrival-card{background:linear-gradient(135deg,#667eea,#764ba2)}.dance-grid{margin-bottom:120rpx;padding:0 40rpx}.dance-grid .dance-row{display:-webkit-flex;display:flex;gap:30rpx;margin-bottom:30rpx}.dance-grid .dance-item{border-radius:20rpx;box-shadow:0 8rpx 32rpx rgba(0,0,0,.12),0 2rpx 8rpx rgba(0,0,0,.08);flex:1;overflow:hidden;padding:50rpx 30rpx;position:relative;text-align:center}.dance-grid .dance-item .dance-content{position:relative;z-index:2}.dance-grid .dance-item .dance-content .dance-title{color:#fff;display:block;font-size:32rpx;font-weight:700;margin-bottom:8rpx}.dance-grid .dance-item .dance-content .dance-subtitle{color:hsla(0,0%,100%,.8);font-size:22rpx;font-weight:500;letter-spacing:1rpx;opacity:.8}.dance-grid .dance-item:active{transform:scale(.96);transition:all .2s ease}.dance-grid .street-dance{background:linear-gradient(135deg,#ffeaa7,#fab1a0)}.dance-grid .ballet-dance{background:linear-gradient(135deg,#74b9ff,#0984e3)}.dance-grid .machine-dance{background:linear-gradient(135deg,#55efc4,#00b894)}.dance-grid .classical-dance{background:linear-gradient(135deg,#fdcb6e,#e17055)}.dance-grid .latin-dance{background:linear-gradient(135deg,#a29bfe,#6c5ce7)}.dance-grid .modern-dance{background:linear-gradient(135deg,#fd79a8,#e84393)}.bottom-nav{backdrop-filter:blur(20px);background:rgba(44,44,84,.95);border-top:1px solid hsla(0,0%,100%,.1);bottom:0;display:-webkit-flex;display:flex;left:0;padding:30rpx 40rpx;position:fixed;right:0}.bottom-nav .nav-item{flex:1;position:relative;text-align:center}.bottom-nav .nav-item .nav-text{color:hsla(0,0%,100%,.6);font-size:28rpx;font-weight:500}.bottom-nav .nav-item.active .nav-text{color:#ff6b9d;font-weight:700}.bottom-nav .nav-item.active .nav-underline{background:#ff6b9d;border-radius:2rpx;bottom:-15rpx;height:4rpx;left:50%;position:absolute;transform:translateX(-50%);width:50rpx} |