style(小程序): 题目去外层大卡片融入页面背景,选项选中态统一蓝紫渐变白字并修调研页暗色残留
This commit is contained in:
@@ -249,10 +249,16 @@ page { -ms-overflow-style: none; scrollbar-width: none; }
|
||||
border-color: rgba(98, 132, 255, 0.5);
|
||||
}
|
||||
|
||||
/* 一题一屏:卡片更突出,题目/选项更大 */
|
||||
/* 一题一屏:不再包大卡片,题目直接融入页面背景(选项保留玻璃药丸),题目/选项更大 */
|
||||
.ot-qcard.one {
|
||||
margin-top: 8px;
|
||||
padding: 44px 32px;
|
||||
background: transparent;
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
margin-top: 0;
|
||||
padding: 12px 8px 0;
|
||||
}
|
||||
|
||||
.ot-qcard.one .ot-qtext {
|
||||
@@ -304,9 +310,15 @@ page { -ms-overflow-style: none; scrollbar-width: none; }
|
||||
padding: 20px 22px;
|
||||
}
|
||||
|
||||
/* 选中态全站统一:蓝紫渐变 + 白字 */
|
||||
.ot-opt.sel {
|
||||
border-color: #6284ff;
|
||||
background: rgba(99, 132, 255, 0.08);
|
||||
border-color: transparent;
|
||||
background: linear-gradient(135deg, #6b8bff, #8f7bff);
|
||||
box-shadow: 0 8rpx 24rpx rgba(98, 132, 255, 0.28);
|
||||
}
|
||||
|
||||
.ot-opt.sel .opt-text {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.opt-key {
|
||||
@@ -317,7 +329,7 @@ page { -ms-overflow-style: none; scrollbar-width: none; }
|
||||
}
|
||||
|
||||
.ot-opt.sel .opt-key {
|
||||
color: #6284ff;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.opt-text {
|
||||
@@ -405,7 +417,21 @@ page { -ms-overflow-style: none; scrollbar-width: none; }
|
||||
}
|
||||
.page-navbar-col { display: flex; flex-direction: column; }
|
||||
.page-navbar-no { font-family: 'BubbledotICG', monospace; color: #a3abc9; font-size: 26rpx; letter-spacing: 2rpx; line-height: 1.15; }
|
||||
.page-navbar-titlerow { display: flex; align-items: baseline; gap: 16rpx; line-height: 1.15; }
|
||||
.page-navbar-titlerow { display: flex; align-items: center; gap: 16rpx; line-height: 1.15; }
|
||||
/* 标题区返回按钮:玻璃圆形 + 线性箭头(沉浸式导航下唯一返回入口) */
|
||||
.page-navbar-back {
|
||||
width: 56rpx; height: 56rpx; border-radius: 50%;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
background: rgba(255, 255, 255, 0.55);
|
||||
backdrop-filter: blur(20rpx) saturate(160%);
|
||||
-webkit-backdrop-filter: blur(20rpx) saturate(160%);
|
||||
border: 1px solid rgba(99, 132, 255, 0.22);
|
||||
color: #5a6aa3;
|
||||
box-shadow: 0 4rpx 14rpx rgba(59, 79, 125, 0.10);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.page-navbar-back .ic { width: 30rpx; height: 30rpx; }
|
||||
.page-navbar-back.pressed { opacity: 0.65; }
|
||||
.page-navbar-title {
|
||||
font-size: 40rpx; font-weight: 800; letter-spacing: -0.5rpx; line-height: 1.15;
|
||||
background: linear-gradient(120deg, #8fc3ff 0%, #a8a0ff 45%, #e0a0ff 80%, #7fe0ff 100%);
|
||||
|
||||
@@ -97,7 +97,7 @@
|
||||
.sv-progress {
|
||||
height: 12rpx;
|
||||
border-radius: 999px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
background: rgba(99, 132, 255, 0.14);
|
||||
margin: 22rpx 0 18rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
@@ -111,7 +111,7 @@
|
||||
.sv-part {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #a8c4ff;
|
||||
color: #6284ff;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
@@ -128,14 +128,16 @@
|
||||
margin: 8rpx 0 20rpx;
|
||||
}
|
||||
|
||||
/* ---------- 问题卡片 ---------- */
|
||||
/* ---------- 题目区(不包大卡片,直接融入页面背景) ---------- */
|
||||
.sv-qcard {
|
||||
background: rgba(255,255,255,0.55); backdrop-filter: blur(20px) saturate(160%); -webkit-backdrop-filter: blur(20px) saturate(160%);
|
||||
border: 1rpx solid rgba(99, 132, 255, 0.14);
|
||||
border-radius: 20px;
|
||||
padding: 34rpx 32rpx;
|
||||
margin-top: 8rpx;
|
||||
box-shadow: 0 12rpx 40rpx rgba(0, 0, 0, 0.45);
|
||||
background: transparent;
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
padding: 16rpx 8rpx 0;
|
||||
margin-top: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.sv-qnum {
|
||||
display: flex;
|
||||
@@ -147,11 +149,11 @@
|
||||
}
|
||||
.sv-qnum .sv-flag {
|
||||
font-size: 20rpx;
|
||||
color: #a8c4ff;
|
||||
color: #6284ff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.sv-check {
|
||||
color: #a8c4ff;
|
||||
color: #6284ff;
|
||||
font-size: 24rpx;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
@@ -188,15 +190,15 @@
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
.sv-opt.sel {
|
||||
border-color: #a8c4ff;
|
||||
background: rgba(160, 180, 255,0.08);
|
||||
box-shadow: 0 0 0 1rpx rgba(160, 180, 255,0.5), 0 0 22rpx rgba(160, 180, 255,0.14);
|
||||
border-color: transparent;
|
||||
background: linear-gradient(135deg, #6b8bff, #8f7bff);
|
||||
box-shadow: 0 8rpx 24rpx rgba(98, 132, 255, 0.28);
|
||||
}
|
||||
.sv-opt-dot {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid #5b5b5b;
|
||||
border: 2rpx solid #8a94c0;
|
||||
flex-shrink: 0;
|
||||
margin-top: 4rpx;
|
||||
display: flex;
|
||||
@@ -206,11 +208,11 @@
|
||||
color: transparent;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
.sv-opt.sel .sv-opt-text { color: #fff; }
|
||||
.sv-opt.sel .sv-opt-dot {
|
||||
border-color: #a8c4ff;
|
||||
background: #a8c4ff;
|
||||
color: #000;
|
||||
box-shadow: 0 0 10rpx rgba(160, 180, 255,0.6);
|
||||
border-color: #fff;
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
}
|
||||
.sv-opt-text {
|
||||
font-size: 27rpx;
|
||||
@@ -236,9 +238,9 @@
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
.sv-lk.sel {
|
||||
border-color: #a8c4ff;
|
||||
background: rgba(160, 180, 255,0.08);
|
||||
box-shadow: 0 0 0 1rpx rgba(160, 180, 255,0.5), 0 0 22rpx rgba(160, 180, 255,0.14);
|
||||
border-color: transparent;
|
||||
background: linear-gradient(135deg, #6b8bff, #8f7bff);
|
||||
box-shadow: 0 8rpx 24rpx rgba(98, 132, 255, 0.28);
|
||||
}
|
||||
.sv-lk-v {
|
||||
width: 48rpx;
|
||||
@@ -255,9 +257,11 @@
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
.sv-lk.sel .sv-lk-v {
|
||||
background: linear-gradient(135deg, #5b8cff, #9d6bff);
|
||||
color: #000;
|
||||
box-shadow: 0 0 14rpx rgba(160, 180, 255,0.55);
|
||||
background: rgba(255, 255, 255, 0.22);
|
||||
color: #fff;
|
||||
}
|
||||
.sv-lk.sel .sv-lk-l {
|
||||
color: #fff;
|
||||
}
|
||||
.sv-lk-l {
|
||||
font-size: 28rpx;
|
||||
|
||||
Reference in New Issue
Block a user