|
@@ -215,7 +215,7 @@ watch(() => global.inputLine, () => {
|
|
|
<span class="back-icon">←</span>
|
|
<span class="back-icon">←</span>
|
|
|
<span>返回首页</span>
|
|
<span>返回首页</span>
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="app-title">商小川智能助手</div>
|
|
|
|
|
|
|
+ <h1 class="app-title">商小川<span>智能助手</span></h1>
|
|
|
<div class="nav-spacer"></div>
|
|
<div class="nav-spacer"></div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
@@ -543,18 +543,18 @@ watch(() => global.inputLine, () => {
|
|
|
padding: 0.875rem 2.5rem;
|
|
padding: 0.875rem 2.5rem;
|
|
|
border-radius: 3.125rem; /* 胶囊形状 */
|
|
border-radius: 3.125rem; /* 胶囊形状 */
|
|
|
border: 1px solid rgba(255, 255, 255, 0.4);
|
|
border: 1px solid rgba(255, 255, 255, 0.4);
|
|
|
- background: linear-gradient(145deg, #d4ebf7, #b8daf0);
|
|
|
|
|
|
|
+ background: #ffffff;
|
|
|
box-shadow:
|
|
box-shadow:
|
|
|
- -10px -10px 20px rgba(255, 255, 255, 0.8),
|
|
|
|
|
- 10px 10px 20px rgba(176, 210, 232, 0.6),
|
|
|
|
|
|
|
+ -10px -10px 20px #ffffff,
|
|
|
|
|
+ 10px 10px 20px #d1d9e6,
|
|
|
inset 1px 1px 0px rgba(255, 255, 255, 1);
|
|
inset 1px 1px 0px rgba(255, 255, 255, 1);
|
|
|
- color: #5a8fb5;
|
|
|
|
|
|
|
+ color: #aab2bd;
|
|
|
font-size: 1.125rem;
|
|
font-size: 1.125rem;
|
|
|
font-weight: 400;
|
|
font-weight: 400;
|
|
|
letter-spacing: 0.125rem;
|
|
letter-spacing: 0.125rem;
|
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
transition: all 0.3s ease;
|
|
transition: all 0.3s ease;
|
|
|
- text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.8);
|
|
|
|
|
|
|
+ text-shadow: 1px 1px 0 #ffffff;
|
|
|
min-width: 100px;
|
|
min-width: 100px;
|
|
|
min-height: 50px;
|
|
min-height: 50px;
|
|
|
justify-content: center;
|
|
justify-content: center;
|
|
@@ -562,17 +562,17 @@ watch(() => global.inputLine, () => {
|
|
|
&:hover {
|
|
&:hover {
|
|
|
transform: translateY(-2px);
|
|
transform: translateY(-2px);
|
|
|
box-shadow:
|
|
box-shadow:
|
|
|
- -12px -12px 24px rgba(255, 255, 255, 0.9),
|
|
|
|
|
- 12px 12px 24px rgba(176, 210, 232, 0.7),
|
|
|
|
|
|
|
+ -12px -12px 24px #ffffff,
|
|
|
|
|
+ 12px 12px 24px #c8d0e7,
|
|
|
inset 1px 1px 0px rgba(255, 255, 255, 1);
|
|
inset 1px 1px 0px rgba(255, 255, 255, 1);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
&:active {
|
|
&:active {
|
|
|
transform: translateY(0);
|
|
transform: translateY(0);
|
|
|
- background: #b8daf0;
|
|
|
|
|
|
|
+ background: #f5f5f5;
|
|
|
box-shadow:
|
|
box-shadow:
|
|
|
- inset 6px 6px 12px rgba(176, 210, 232, 0.6),
|
|
|
|
|
- inset -6px -6px 12px rgba(255, 255, 255, 0.8);
|
|
|
|
|
|
|
+ inset 6px 6px 12px #d1d9e6,
|
|
|
|
|
+ inset -6px -6px 12px #ffffff;
|
|
|
border: 1px solid transparent;
|
|
border: 1px solid transparent;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -582,9 +582,22 @@ watch(() => global.inputLine, () => {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.app-title {
|
|
.app-title {
|
|
|
- font-size: 1.75rem;
|
|
|
|
|
- font-weight: 600;
|
|
|
|
|
- color: #101333;
|
|
|
|
|
|
|
+ font-size: 3rem;
|
|
|
|
|
+ font-weight: 700;
|
|
|
|
|
+ color: #555964;
|
|
|
|
|
+ letter-spacing: 0.125rem;
|
|
|
|
|
+ margin: 0;
|
|
|
|
|
+ /* 核心:文字双重阴影营造新拟态效果 */
|
|
|
|
|
+ text-shadow:
|
|
|
|
|
+ 4px 4px 8px #d1d9e6, /* 右下深色阴影 */
|
|
|
|
|
+ -4px -4px 8px #ffffff; /* 左上高光 */
|
|
|
|
|
+
|
|
|
|
|
+ /* 让"智能助手"四个字稍微淡一点,突出"商小川" */
|
|
|
|
|
+ span {
|
|
|
|
|
+ font-weight: 300;
|
|
|
|
|
+ color: #8990a0;
|
|
|
|
|
+ font-size: 0.8em; /* 稍微小一点 */
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.nav-spacer {
|
|
.nav-spacer {
|