|
|
@@ -537,39 +537,71 @@
|
|
|
gap: 3px;
|
|
|
}
|
|
|
|
|
|
- /* 页面标题装饰 */
|
|
|
- .page-header {
|
|
|
- text-align: center;
|
|
|
- margin-bottom: 25px;
|
|
|
+// /* 页面标题装饰 */
|
|
|
+// .page-header {
|
|
|
+// text-align: center;
|
|
|
+// margin-bottom: 25px;
|
|
|
+// }
|
|
|
+
|
|
|
+// .page-title {
|
|
|
+// font-size: 28px;
|
|
|
+// font-weight: 800;
|
|
|
+// color: $text-dark;
|
|
|
+// margin-bottom: 8px;
|
|
|
+// background: linear-gradient(90deg, #3367d6, #4285f4);
|
|
|
+// //webkit-background-clip: text;
|
|
|
+// -webkit-text-fill-color: transparent;
|
|
|
+// position: relative;
|
|
|
+// display: inline-block;
|
|
|
+// }
|
|
|
+
|
|
|
+// .page-subtitle {
|
|
|
+// color: $text-light;
|
|
|
+// font-size: 16px;
|
|
|
+// max-width: 300px;
|
|
|
+// margin: 0 auto;
|
|
|
+// }
|
|
|
+
|
|
|
+// /* 装饰元素 */
|
|
|
+// .decor-circle {
|
|
|
+// position: absolute;
|
|
|
+// width: 200px;
|
|
|
+// height: 200px;
|
|
|
+// border-radius: 50%;
|
|
|
+// background: linear-gradient(135deg, rgba(66, 133, 244, 0.1) 0%, rgba(66, 133, 244, 0.05) 100%);
|
|
|
+// z-index: -1;
|
|
|
+// }
|
|
|
+/* ===== 修复标题显示问题 ===== */
|
|
|
+.page-header {
|
|
|
+ position: relative;
|
|
|
+ z-index: 10; /* 确保标题在装饰层之上 */
|
|
|
+ margin: 0 0 20px 0;
|
|
|
}
|
|
|
|
|
|
.page-title {
|
|
|
- font-size: 28px;
|
|
|
- font-weight: 800;
|
|
|
- color: $text-dark;
|
|
|
- margin-bottom: 8px;
|
|
|
- background: linear-gradient(90deg, #3367d6, #4285f4);
|
|
|
- //webkit-background-clip: text;
|
|
|
- -webkit-text-fill-color: transparent;
|
|
|
- position: relative;
|
|
|
+ color: #000000; /* 强制黑色字体 */
|
|
|
+ background: white; /* 白色背景 */
|
|
|
display: inline-block;
|
|
|
+ padding: 8px 20px;
|
|
|
+ border-radius: 30px;
|
|
|
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
|
+ position: relative;
|
|
|
+ z-index: 20; /* 高于装饰元素 */
|
|
|
+ font-weight: 600; /* 可选：加粗字体 */
|
|
|
}
|
|
|
|
|
|
.page-subtitle {
|
|
|
- color: $text-light;
|
|
|
- font-size: 16px;
|
|
|
- max-width: 300px;
|
|
|
- margin: 0 auto;
|
|
|
+ color: #555555; /* 深灰色副标题 */
|
|
|
+ background: white;
|
|
|
+ display: inline-block;
|
|
|
+ padding: 5px 15px;
|
|
|
+ border-radius: 20px;
|
|
|
+ margin-top: 8px;
|
|
|
}
|
|
|
|
|
|
- /* 装饰元素 */
|
|
|
+ /* 确保装饰圆圈不会覆盖标题 */
|
|
|
.decor-circle {
|
|
|
- position: absolute;
|
|
|
- width: 200px;
|
|
|
- height: 200px;
|
|
|
- border-radius: 50%;
|
|
|
- background: linear-gradient(135deg, rgba(66, 133, 244, 0.1) 0%, rgba(66, 133, 244, 0.05) 100%);
|
|
|
- z-index: -1;
|
|
|
+ z-index: 1 !important; /* 强制装饰元素在底层 */
|
|
|
}
|
|
|
|
|
|
.circle-1 {
|
|
|
@@ -727,4 +759,5 @@
|
|
|
background: linear-gradient(90deg, $primary, $primary-dark);
|
|
|
border-radius: 3px;
|
|
|
transition: width 0.3s ease;
|
|
|
- }
|
|
|
+ }
|
|
|
+
|
