锁定 Outpost 主路径主题，并优化地图编辑属性面板浅色对比。
统一 outpost-light/purple/blue 壳层 token，修复扩展字段与操作按钮在浅色下的可读性。 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
zhaowei.huang
Cursor
@@ -4,17 +4,10 @@
|
||||
<div class="bg-overlay" />
|
||||
<div class="bg-orb bg-orb-a" />
|
||||
<div class="bg-orb bg-orb-b" />
|
||||
<div class="bg-orb bg-orb-c" />
|
||||
<div class="bg-stars" aria-hidden="true">
|
||||
<span v-for="(s, i) in starStyles" :key="i" :style="s" />
|
||||
</div>
|
||||
|
||||
<div class="login-card">
|
||||
<!-- 左侧品牌 hero -->
|
||||
<div class="hero">
|
||||
<div class="hero-stars" aria-hidden="true">
|
||||
<span v-for="(s, i) in heroStarStyles" :key="i" :style="s" />
|
||||
</div>
|
||||
<div class="hero-brand">
|
||||
<span class="hero-mark">
|
||||
<img src="/FRLD-logo-white-no_title.png" alt="迷毂" class="hero-mark-img" />
|
||||
@@ -212,25 +205,6 @@ const rules: FormRules = {
|
||||
|
||||
const year = computed(() => new Date().getFullYear())
|
||||
|
||||
// 生成 n 个随机分布、随机大小与闪烁节奏的小白点，营造梦幻星点。
|
||||
function makeStars(n: number): Record<string, string>[] {
|
||||
return Array.from({ length: n }, () => {
|
||||
const size = 1.5 + Math.random() * 2.8
|
||||
return {
|
||||
top: `${Math.random() * 100}%`,
|
||||
left: `${Math.random() * 100}%`,
|
||||
width: `${size}px`,
|
||||
height: `${size}px`,
|
||||
opacity: `${0.35 + Math.random() * 0.5}`,
|
||||
animationDelay: `${-Math.random() * 6}s`,
|
||||
animationDuration: `${2.6 + Math.random() * 3.4}s`
|
||||
} as Record<string, string>
|
||||
})
|
||||
}
|
||||
// 背景层（卡片之外）+ 品牌区（卡片内深色区）两组星点
|
||||
const starStyles = makeStars(48)
|
||||
const heroStarStyles = makeStars(22)
|
||||
|
||||
async function submit() {
|
||||
if (!formRef.value) return
|
||||
await formRef.value.validate(async (ok) => {
|
||||
@@ -269,13 +243,8 @@ async function submit() {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* ════════════════════════════════════════════════════════════════════════
|
||||
* 登录页固定配色（不随全局主题切换变化）。
|
||||
* 统一用一组本地 --lg-* 变量（午夜靛蓝 + 青色霓虹），保证无论用户切到哪个
|
||||
* 主题，登录界面始终是同一套高级、克制的深色质感。
|
||||
* ════════════════════════════════════════════════════════════════════════ */
|
||||
/* Outpost 登录：纸白主区 + plum 品牌柱（对齐 fairylandtech.amerc.ai） */
|
||||
.login-page {
|
||||
/* 梦幻晨曦渐变：粉紫(左上) → 蓝紫(中) → 淡蓝(右下)，高明度柔光，参考产品视觉稿。 */
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
@@ -283,11 +252,11 @@ async function submit() {
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
background:
|
||||
radial-gradient(ellipse 75% 55% at 16% 14%, #dcbef7 0%, transparent 55%),
|
||||
radial-gradient(ellipse 80% 65% at 86% 90%, #abc9f5 0%, transparent 58%),
|
||||
linear-gradient(135deg, #cbb2f0 0%, #b7adec 46%, #a7c6f2 100%);
|
||||
color: var(--lg-text);
|
||||
font-family: 'PingFang SC', 'Microsoft YaHei', 'Segoe UI', sans-serif;
|
||||
radial-gradient(ellipse 70% 50% at 15% 10%, rgba(117, 67, 232, 0.14), transparent 55%),
|
||||
radial-gradient(ellipse 60% 45% at 90% 85%, rgba(155, 124, 255, 0.1), transparent 50%),
|
||||
#f6f3fb;
|
||||
color: #28213a;
|
||||
font-family: 'Inter', 'PingFang SC', 'Microsoft YaHei', 'Segoe UI', sans-serif;
|
||||
}
|
||||
|
||||
/* ===== 背景层 ===== */
|
||||
@@ -329,25 +298,18 @@ async function submit() {
|
||||
animation: drift 20s ease-in-out infinite;
|
||||
}
|
||||
.bg-orb-a {
|
||||
width: 460px; height: 460px;
|
||||
top: -150px; left: -130px;
|
||||
background: radial-gradient(circle, var(--lg-primary-hover) 0%, var(--lg-primary) 52%, transparent 80%);
|
||||
opacity: 0.24;
|
||||
width: 420px; height: 420px;
|
||||
top: -140px; left: -100px;
|
||||
background: radial-gradient(circle, rgba(155, 124, 255, 0.55) 0%, rgba(117, 67, 232, 0.35) 55%, transparent 80%);
|
||||
opacity: 0.22;
|
||||
}
|
||||
.bg-orb-b {
|
||||
width: 600px; height: 600px;
|
||||
bottom: -220px; right: -190px;
|
||||
background: radial-gradient(circle, var(--lg-accent) 0%, var(--lg-primary-deep) 58%, transparent 86%);
|
||||
opacity: 0.18;
|
||||
width: 480px; height: 480px;
|
||||
bottom: -180px; right: -140px;
|
||||
background: radial-gradient(circle, rgba(117, 67, 232, 0.4) 0%, rgba(155, 124, 255, 0.2) 55%, transparent 85%);
|
||||
opacity: 0.16;
|
||||
animation-delay: -7s;
|
||||
}
|
||||
.bg-orb-c {
|
||||
width: 320px; height: 320px;
|
||||
top: 32%; right: 9%;
|
||||
background: radial-gradient(circle, var(--lg-primary-hover) 0%, var(--lg-primary) 60%, transparent 90%);
|
||||
opacity: 0.14;
|
||||
animation-delay: -13s;
|
||||
}
|
||||
@keyframes drift {
|
||||
0%, 100% { transform: translate(0, 0) scale(1); }
|
||||
50% { transform: translate(18px, -28px) scale(1.05); }
|
||||
@@ -368,7 +330,7 @@ async function submit() {
|
||||
50% { opacity: 0.95; transform: scale(1.2); }
|
||||
}
|
||||
|
||||
/* ===== 卡片：双栏 hero ===== */
|
||||
/* ===== 卡片：Outpost 纸白 + plum 品牌柱 ===== */
|
||||
.login-card {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
@@ -378,34 +340,19 @@ async function submit() {
|
||||
display: grid;
|
||||
grid-template-columns: 360px 1fr;
|
||||
overflow: hidden;
|
||||
border-radius: 22px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
/* 登录框本体：紫 → 靛蓝的「紫蓝混合」渐变，梦幻且不发灰；高不透明度保证文字清晰 */
|
||||
background:
|
||||
linear-gradient(140deg,
|
||||
rgba(48, 26, 96, 0.95) 0%,
|
||||
rgba(33, 26, 92, 0.955) 50%,
|
||||
rgba(22, 26, 84, 0.96) 100%);
|
||||
backdrop-filter: blur(26px) saturate(150%);
|
||||
-webkit-backdrop-filter: blur(26px) saturate(150%);
|
||||
border-radius: 20px;
|
||||
border: 1px solid rgba(40, 33, 58, 0.08);
|
||||
background: #fffefd;
|
||||
box-shadow:
|
||||
0 44px 110px rgba(0, 0, 0, 0.62),
|
||||
0 0 70px rgba(var(--lg-primary-rgb), 0.24),
|
||||
0 0 0 1px rgba(var(--lg-accent-rgb), 0.16) inset,
|
||||
0 1px 0 rgba(255, 255, 255, 0.18) inset;
|
||||
0 1px 2px rgba(40, 33, 58, 0.04),
|
||||
0 24px 56px rgba(54, 35, 78, 0.12);
|
||||
}
|
||||
/* 顶部霓虹高光线 */
|
||||
.login-card::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; left: 12%; right: 12%;
|
||||
height: 1px;
|
||||
background: linear-gradient(90deg,
|
||||
transparent 0%,
|
||||
rgba(var(--lg-accent-rgb), 0.55) 30%,
|
||||
rgba(255, 255, 255, 0.92) 50%,
|
||||
rgba(var(--lg-accent-rgb), 0.55) 70%,
|
||||
transparent 100%);
|
||||
background: linear-gradient(90deg, transparent 0%, rgba(117, 67, 232, 0.35) 50%, transparent 100%);
|
||||
pointer-events: none;
|
||||
z-index: 3;
|
||||
}
|
||||
@@ -415,12 +362,8 @@ async function submit() {
|
||||
position: relative;
|
||||
padding: 44px 34px 34px;
|
||||
color: #fff;
|
||||
/* 品牌区紫蓝混合：左上紫光球 + 右下蓝光球，叠在深紫底上 */
|
||||
background:
|
||||
radial-gradient(ellipse at 16% 18%, rgba(123, 77, 255, 0.34) 0%, transparent 56%),
|
||||
radial-gradient(ellipse at 88% 84%, rgba(94, 124, 255, 0.32) 0%, transparent 58%),
|
||||
linear-gradient(170deg, rgba(var(--lg-primary-rgb), 0.26) 0%, rgba(var(--lg-aside-rgb), 0.42) 60%, rgba(var(--lg-deep-rgb), 0.55) 100%);
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background: linear-gradient(165deg, #3f2454 0%, #241530 100%);
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.06);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
@@ -550,56 +493,53 @@ async function submit() {
|
||||
padding: 44px 44px 32px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
/* 表单侧：紫 → 蓝的洗光，与品牌区一致的「紫蓝混合」基调 */
|
||||
background:
|
||||
linear-gradient(135deg, rgba(123, 77, 255, 0.14) 0%, rgba(94, 124, 255, 0.10) 100%);
|
||||
background: #fffefd;
|
||||
color: #28213a;
|
||||
}
|
||||
.panel-head { margin-bottom: 26px; }
|
||||
.panel-title {
|
||||
font-size: 30px; font-weight: 700;
|
||||
letter-spacing: 12px;
|
||||
background: linear-gradient(135deg, #ffffff 0%, var(--lg-accent) 100%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
text-shadow: 0 0 22px rgba(var(--lg-primary-hover-rgb), 0.5);
|
||||
font-size: 28px; font-weight: 700;
|
||||
letter-spacing: 8px;
|
||||
color: #28213a;
|
||||
background: none;
|
||||
-webkit-text-fill-color: unset;
|
||||
text-shadow: none;
|
||||
}
|
||||
.panel-sub {
|
||||
margin-top: 6px;
|
||||
font-size: 12.5px;
|
||||
color: var(--lg-text-dim);
|
||||
color: #756d85;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.glass-form { flex: 1; display: flex; flex-direction: column; }
|
||||
.glass-form :deep(.el-form-item) { margin-bottom: 18px; }
|
||||
|
||||
/* 输入框 透明玻璃 */
|
||||
.glass-form :deep(.el-input__wrapper) {
|
||||
background: rgba(255, 255, 255, 0.06) !important;
|
||||
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16) inset !important;
|
||||
border-radius: 10px !important;
|
||||
transition: all .25s;
|
||||
background: #f6f3fb !important;
|
||||
box-shadow: 0 0 0 1px rgba(40, 33, 58, 0.1) inset !important;
|
||||
border-radius: 12px !important;
|
||||
transition: all .2s;
|
||||
}
|
||||
.glass-form :deep(.el-input__wrapper:hover) {
|
||||
background: rgba(255, 255, 255, 0.11) !important;
|
||||
box-shadow: 0 0 0 1px rgba(var(--lg-accent-rgb), 0.5) inset !important;
|
||||
background: #fbf9fd !important;
|
||||
box-shadow: 0 0 0 1px rgba(117, 67, 232, 0.35) inset !important;
|
||||
}
|
||||
.glass-form :deep(.el-input__wrapper.is-focus) {
|
||||
background: rgba(255, 255, 255, 0.13) !important;
|
||||
background: #fff !important;
|
||||
box-shadow:
|
||||
0 0 0 1px rgba(var(--lg-accent-rgb), 0.85) inset,
|
||||
0 0 20px rgba(var(--lg-primary-hover-rgb), 0.45) !important;
|
||||
0 0 0 1px rgba(117, 67, 232, 0.55) inset,
|
||||
0 0 0 3px rgba(117, 67, 232, 0.12) !important;
|
||||
}
|
||||
.glass-form :deep(.el-input__inner) {
|
||||
color: #fff !important;
|
||||
-webkit-text-fill-color: #fff !important;
|
||||
color: #28213a !important;
|
||||
-webkit-text-fill-color: #28213a !important;
|
||||
font-size: 14px;
|
||||
height: 42px;
|
||||
}
|
||||
.glass-form :deep(.el-input__inner::placeholder) { color: rgba(255, 255, 255, 0.42); }
|
||||
.glass-form :deep(.el-input__inner::placeholder) { color: #a8a0c0; }
|
||||
.glass-form :deep(.el-input__prefix-inner > :first-child),
|
||||
.glass-form :deep(.el-input__suffix-inner) { color: rgba(255, 255, 255, 0.55); }
|
||||
.glass-form :deep(.el-input__suffix-inner) { color: #756d85; }
|
||||
|
||||
/* scope 双卡 */
|
||||
.scope-item :deep(.el-form-item__content) { width: 100%; }
|
||||
@@ -611,45 +551,42 @@ async function submit() {
|
||||
display: flex; align-items: center; gap: 6px;
|
||||
margin-bottom: 8px;
|
||||
font-size: 12px;
|
||||
color: var(--lg-text-soft);
|
||||
color: #756d85;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.launch-mode-title { font-weight: 500; }
|
||||
.launch-mode-help {
|
||||
color: var(--lg-text-dim);
|
||||
color: #a8a0c0;
|
||||
cursor: help;
|
||||
font-size: 14px;
|
||||
}
|
||||
.launch-mode-help:hover { color: var(--lg-accent); }
|
||||
.launch-mode-help:hover { color: #7543e8; }
|
||||
.launch-wrap { margin-bottom: 4px; }
|
||||
.launch-tip { max-width: 280px; line-height: 1.6; font-size: 12px; }
|
||||
.launch-tip > div + div { margin-top: 6px; }
|
||||
.scope-tab {
|
||||
appearance: none;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.16);
|
||||
background: #f6f3fb;
|
||||
border: 1px solid rgba(40, 33, 58, 0.1);
|
||||
border-radius: 12px;
|
||||
padding: 14px 14px;
|
||||
display: flex; align-items: center; gap: 12px;
|
||||
color: rgba(255, 255, 255, 0.78);
|
||||
color: #28213a;
|
||||
cursor: pointer;
|
||||
transition: all .2s;
|
||||
text-align: left;
|
||||
}
|
||||
.scope-tab:hover {
|
||||
background: rgba(255, 255, 255, 0.11);
|
||||
color: #fff;
|
||||
background: #fbf9fd;
|
||||
border-color: rgba(117, 67, 232, 0.3);
|
||||
color: #28213a;
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
.scope-tab.active {
|
||||
background: linear-gradient(135deg,
|
||||
rgba(var(--lg-primary-rgb), 0.55) 0%,
|
||||
rgba(var(--lg-accent-rgb), 0.28) 100%);
|
||||
border-color: rgba(var(--lg-accent-rgb), 0.75);
|
||||
background: linear-gradient(135deg, #7543e8 0%, #9b7cff 100%);
|
||||
border-color: transparent;
|
||||
color: #fff;
|
||||
box-shadow:
|
||||
0 0 22px rgba(var(--lg-primary-hover-rgb), 0.45),
|
||||
0 0 0 1px rgba(var(--lg-accent-rgb), 0.45) inset;
|
||||
box-shadow: 0 8px 20px rgba(117, 67, 232, 0.28);
|
||||
}
|
||||
.scope-tab .el-icon { font-size: 20px; }
|
||||
.scope-meta { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
|
||||
@@ -660,107 +597,83 @@ async function submit() {
|
||||
.row { display: flex; align-items: center; }
|
||||
.row-between { justify-content: space-between; margin: -6px 0 10px; }
|
||||
.remember :deep(.el-checkbox__label) {
|
||||
color: rgba(255, 255, 255, 0.9) !important;
|
||||
color: #28213a !important;
|
||||
font-size: 12.5px;
|
||||
text-shadow: 0 1px 2px rgba(6, 9, 18, 0.4);
|
||||
text-shadow: none;
|
||||
}
|
||||
.remember :deep(.el-checkbox__inner) {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-color: rgba(255, 255, 255, 0.32);
|
||||
background: #fff;
|
||||
border-color: rgba(40, 33, 58, 0.25);
|
||||
}
|
||||
.remember :deep(.el-checkbox.is-checked .el-checkbox__inner) {
|
||||
background: var(--lg-primary);
|
||||
border-color: var(--lg-primary);
|
||||
background: #7543e8;
|
||||
border-color: #7543e8;
|
||||
}
|
||||
.adv-link { color: var(--lg-text-soft) !important; font-size: 12.5px; }
|
||||
.adv-link:hover { color: #fff !important; }
|
||||
.adv-link { color: #756d85 !important; font-size: 12.5px; }
|
||||
.adv-link:hover { color: #7543e8 !important; }
|
||||
|
||||
/* 高级折叠 */
|
||||
.adv-collapse { background: transparent !important; border: none !important; margin-bottom: 16px; }
|
||||
.adv-collapse :deep(.el-collapse-item__wrap),
|
||||
.adv-collapse :deep(.el-collapse-item__header) {
|
||||
background: transparent !important;
|
||||
border-color: rgba(255, 255, 255, 0.14) !important;
|
||||
color: var(--lg-text-soft) !important;
|
||||
border-color: rgba(40, 33, 58, 0.1) !important;
|
||||
color: #756d85 !important;
|
||||
}
|
||||
.adv-title { font-size: 12px; letter-spacing: 1px; }
|
||||
.adv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; padding-top: 6px; }
|
||||
.adv-grid :deep(.el-form-item__label) {
|
||||
color: var(--lg-text-soft);
|
||||
color: #756d85;
|
||||
font-size: 12px;
|
||||
}
|
||||
.adv-grid :deep(.el-input-number) { width: 100%; }
|
||||
.adv-grid :deep(.el-input-number .el-input__inner) { text-align: left; }
|
||||
|
||||
/* 登录按钮：靛蓝→青 霓虹 · 扫光动效 */
|
||||
.btn-login {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
height: 46px !important;
|
||||
border-radius: 10px;
|
||||
border-radius: 12px;
|
||||
margin-top: 6px;
|
||||
font-size: 15px;
|
||||
letter-spacing: 6px;
|
||||
font-weight: 600;
|
||||
color: #fff !important;
|
||||
background: linear-gradient(135deg, var(--lg-primary) 0%, var(--lg-primary-hover) 100%) !important;
|
||||
background: #7543e8 !important;
|
||||
border: none !important;
|
||||
box-shadow:
|
||||
0 12px 28px rgba(var(--lg-primary-rgb), 0.5),
|
||||
0 0 26px rgba(var(--lg-primary-hover-rgb), 0.36),
|
||||
0 0 0 1px rgba(255, 255, 255, 0.20) inset !important;
|
||||
transition: all .28s cubic-bezier(.25, .8, .25, 1);
|
||||
}
|
||||
.btn-login::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; left: -120%;
|
||||
width: 80%; height: 100%;
|
||||
background: linear-gradient(110deg,
|
||||
transparent 0%,
|
||||
rgba(255, 255, 255, 0.0) 30%,
|
||||
rgba(255, 255, 255, 0.38) 50%,
|
||||
rgba(255, 255, 255, 0.0) 70%,
|
||||
transparent 100%);
|
||||
transition: left .6s cubic-bezier(.25, .8, .25, 1);
|
||||
pointer-events: none;
|
||||
box-shadow: 0 10px 24px rgba(117, 67, 232, 0.28) !important;
|
||||
transition: all .2s ease;
|
||||
}
|
||||
.btn-login::after { display: none; }
|
||||
.btn-login:hover {
|
||||
transform: translateY(-2px);
|
||||
background: linear-gradient(135deg, var(--lg-primary-hover) 0%, var(--lg-accent) 130%) !important;
|
||||
box-shadow:
|
||||
0 18px 38px rgba(var(--lg-primary-rgb), 0.6),
|
||||
0 0 42px rgba(var(--lg-accent-rgb), 0.5),
|
||||
0 0 0 1px rgba(var(--lg-accent-rgb), 0.5) inset !important;
|
||||
transform: translateY(-1px);
|
||||
background: #8660f0 !important;
|
||||
box-shadow: 0 14px 28px rgba(117, 67, 232, 0.35) !important;
|
||||
}
|
||||
.btn-login:hover::after { left: 120%; }
|
||||
|
||||
.bottom-note {
|
||||
margin-top: 16px;
|
||||
font-size: 11.5px;
|
||||
color: var(--lg-text-dim);
|
||||
color: #756d85;
|
||||
text-align: center;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
/* 底部水印 */
|
||||
.footer-stamp {
|
||||
position: absolute;
|
||||
bottom: 18px; left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 11px;
|
||||
letter-spacing: 2px;
|
||||
color: rgba(45, 32, 78, 0.6);
|
||||
color: rgba(40, 33, 58, 0.45);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
/* 错误提示 */
|
||||
.glass-form :deep(.el-form-item__error) {
|
||||
color: #ff9bb8;
|
||||
color: #c23a5c;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
/* 小屏自适应 */
|
||||
@media (max-width: 760px) {
|
||||
.login-card { grid-template-columns: 1fr; min-height: auto; }
|
||||
.hero { border-right: none; border-bottom: 1px solid rgba(255, 255, 255, 0.1); padding: 28px; }
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1740,8 +1740,14 @@ onUnmounted(() => {
|
||||
.map-editor-page {
|
||||
height: calc(100vh - 56px);
|
||||
display: flex; flex-direction: column;
|
||||
background: radial-gradient(ellipse at 50% 40%, #2d1456 0%, #1a0930 50%, #0f0420 100%);
|
||||
color: rgba(232,215,245,0.9);
|
||||
/* 画布区保持深色；色相跟当前主题侧栏 (--me-chrome-*) */
|
||||
background: radial-gradient(
|
||||
ellipse at 50% 40%,
|
||||
var(--me-chrome-1) 0%,
|
||||
var(--me-chrome-2) 52%,
|
||||
#080610 100%
|
||||
);
|
||||
color: var(--me-text);
|
||||
}
|
||||
.me-body {
|
||||
flex: 1;
|
||||
@@ -1767,13 +1773,13 @@ onUnmounted(() => {
|
||||
border-radius: 12px 0 0 12px;
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
background: linear-gradient(135deg, rgba(150, 90, 240, 0.96) 0%, rgba(255, 90, 200, 0.92) 100%);
|
||||
box-shadow: -4px 0 16px rgba(120, 40, 200, 0.45);
|
||||
background: var(--mg-primary);
|
||||
box-shadow: -4px 0 16px var(--me-active-glow);
|
||||
transition: right 0.26s cubic-bezier(0.25, 0.8, 0.25, 1), filter 0.15s ease, box-shadow 0.15s ease;
|
||||
}
|
||||
.ai-assistant-fab:hover {
|
||||
filter: brightness(1.08);
|
||||
box-shadow: -6px 0 22px rgba(150, 60, 230, 0.6);
|
||||
box-shadow: -6px 0 22px var(--me-active-glow);
|
||||
}
|
||||
/* 展开时 right 偏移由内联样式按面板实际宽度设置（默认 360）；此处仅作兜底。 */
|
||||
.ai-assistant-fab.is-open {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user