diff --git a/homepage/index.html b/homepage/index.html index ddec75b..0134fbd 100644 --- a/homepage/index.html +++ b/homepage/index.html @@ -17,158 +17,109 @@ --gold: rgba(210,190,130,0.85); } * { margin: 0; padding: 0; box-sizing: border-box; } - -body { - background: var(--bg); - color: var(--text); - font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; - overflow-x: hidden; - min-height: 100vh; - font-size: 16px; -} +body { background: var(--bg); color: var(--text); font-family: -apple-system,"PingFang SC","Microsoft YaHei",sans-serif; overflow-x: hidden; min-height: 100vh; font-size: 16px; } canvas { position: fixed; top: 0; left: 0; z-index: 0; } -.container { - position: relative; z-index: 1; - max-width: 1000px; margin: 0 auto; - padding: 50px 24px 100px; +.container { position: relative; z-index: 1; max-width: 1000px; margin: 0 auto; padding: 30px 24px 100px; } + +/* 频道标识 */ +.domain-badge { + text-align: center; padding: 16px 0 8px; +} +.domain-badge .domain { + font-size: 14px; color: rgba(130,170,230,0.5); letter-spacing: 3px; +} +.domain-badge .channel { + font-size: 12px; color: rgba(130,170,230,0.35); letter-spacing: 2px; margin-top: 4px; } -.lake-section { display: flex; flex-direction: column; align-items: center; padding: 40px 0; } +.lake-section { display: flex; flex-direction: column; align-items: center; padding: 20px 0; } .lake-core { position: relative; width: 160px; height: 160px; } .lake-light { - position: absolute; top: 50%; left: 50%; - transform: translate(-50%, -50%); + position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 56px; height: 56px; border-radius: 50%; - background: radial-gradient(circle, rgba(150,200,255,0.98) 0%, rgba(90,140,230,0.45) 40%, transparent 70%); - box-shadow: 0 0 56px rgba(130,180,255,0.6), 0 0 112px rgba(110,160,235,0.3); + background: radial-gradient(circle,rgba(150,200,255,0.98) 0%,rgba(90,140,230,0.45) 40%,transparent 70%); + box-shadow: 0 0 56px rgba(130,180,255,0.6),0 0 112px rgba(110,160,235,0.3); animation: breathe 4s ease-in-out infinite; } -.lake-ripple { - position: absolute; top: 50%; left: 50%; - transform: translate(-50%, -50%); - border-radius: 50%; border: 1px solid rgba(130,180,255,0.22); - animation: ripple 6s ease-out infinite; -} -.lake-ripple:nth-child(2) { animation-delay: 2s; } -.lake-ripple:nth-child(3) { animation-delay: 4s; } - +.lake-ripple { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: 50%; border: 1px solid rgba(130,180,255,0.22); animation: ripple 6s ease-out infinite; } +.lake-ripple:nth-child(2){animation-delay:2s} +.lake-ripple:nth-child(3){animation-delay:4s} @keyframes breathe { - 0%,100% { transform: translate(-50%,-50%) scale(1); opacity: 0.9; } - 50% { transform: translate(-50%,-50%) scale(1.22); opacity: 1; - box-shadow: 0 0 72px rgba(130,180,255,0.85), 0 0 144px rgba(110,160,235,0.45); } -} -@keyframes ripple { - 0% { width: 56px; height: 56px; opacity: 0.5; } - 100% { width: 280px; height: 280px; opacity: 0; } + 0%,100%{transform:translate(-50%,-50%)scale(1);opacity:.9} + 50%{transform:translate(-50%,-50%)scale(1.22);opacity:1;box-shadow:0 0 72px rgba(130,180,255,.85),0 0 144px rgba(110,160,235,.45)} } +@keyframes ripple { 0%{width:56px;height:56px;opacity:.5} 100%{width:280px;height:280px;opacity:0} } -.lake-title { - font-size: 32px; - color: rgba(170,210,255,0.65); - letter-spacing: 12px; - margin-top: 16px; - animation: textPulse 4s ease-in-out infinite; - font-weight: 300; -} -@keyframes textPulse { 0%,100% { opacity: 0.4; } 50% { opacity: 0.85; } } +.lake-title { font-size: 32px; color: rgba(170,210,255,.65); letter-spacing: 12px; margin-top: 12px; animation: textPulse 4s ease-in-out infinite; font-weight: 300; } +@keyframes textPulse { 0%,100%{opacity:.4} 50%{opacity:.85} } -.status-bar { display: flex; gap: 36px; justify-content: center; flex-wrap: wrap; margin: 24px 0; } +.status-bar { display: flex; gap: 36px; justify-content: center; flex-wrap: wrap; margin: 20px 0; } .status-item { font-size: 17px; color: var(--label); } -.status-item span { color: var(--accent); font-weight: 400; } +.status-item span { color: var(--accent); } -.modules { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 44px 0; } +.modules { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin: 36px 0; } .module-card { background: var(--panel-bg); border: 1px solid var(--border); border-radius: 16px; padding: 28px 18px; text-align: center; - cursor: pointer; transition: all 0.35s ease; user-select: none; + cursor: pointer; transition: all .35s ease; user-select: none; } -.module-card:hover { border-color: var(--border-hover); background: rgba(18,25,55,0.85); box-shadow: 0 0 32px rgba(110,160,235,0.15); transform: translateY(-2px); } -.module-card.active { border-color: rgba(150,200,255,0.6); background: rgba(22,30,65,0.9); box-shadow: 0 0 38px rgba(110,160,235,0.22); } +.module-card:hover { border-color: var(--border-hover); background: rgba(18,25,55,.85); box-shadow: 0 0 32px rgba(110,160,235,.15); transform: translateY(-2px); } +.module-card.active { border-color: rgba(150,200,255,.6); background: rgba(22,30,65,.9); box-shadow: 0 0 38px rgba(110,160,235,.22); } .module-icon { font-size: 36px; margin-bottom: 10px; } -.module-name { font-size: 16px; color: var(--accent); letter-spacing: 2px; font-weight: 400; } +.module-name { font-size: 16px; color: var(--accent); letter-spacing: 2px; } +/* 展开面板 */ +#panel-area { margin-bottom: 30px; } .expanded-panel { background: var(--panel-bg); border: 1px solid var(--border); - border-radius: 16px; padding: 28px 32px; - display: none; animation: fadeDown 0.35s ease; + border-radius: 16px; padding: 28px 32px; margin-top: 4px; + display: none; } -.expanded-panel.open { display: block; } -@keyframes fadeDown { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } } +.expanded-panel.show { display: block; animation: fadeIn .35s ease; } +@keyframes fadeIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } .panel-title { font-size: 17px; color: var(--accent); letter-spacing: 3px; margin-bottom: 18px; font-weight: 500; } .server-grid { display: flex; flex-wrap: wrap; gap: 12px; } .server-tag { - background: rgba(25,35,70,0.65); border: 1px solid rgba(110,160,235,0.18); + background: rgba(25,35,70,.65); border: 1px solid rgba(110,160,235,.18); border-radius: 10px; padding: 12px 16px; font-size: 15px; color: var(--text); display: flex; align-items: center; gap: 10px; } .server-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; } -.server-dot.online { background: var(--green); box-shadow: 0 0 5px rgba(130,210,170,0.6); } -.server-dot.offline { background: rgba(210,130,130,0.7); } -.server-name { font-weight: 400; } -.server-tech { font-size: 12px; color: rgba(140,180,220,0.4); margin-left: 4px; } +.server-dot.online { background: var(--green); box-shadow: 0 0 5px rgba(130,210,170,.6); } +.server-dot.offline { background: rgba(210,130,130,.7); } +.server-tech { font-size: 12px; color: rgba(140,180,220,.4); margin-left: 4px; } -.ticket-row { display: flex; gap: 16px; align-items: center; padding: 12px 0; border-bottom: 1px solid rgba(110,160,235,0.08); font-size: 15px; } -.ticket-icon { font-size: 20px; } +.ticket-row { display: flex; gap: 16px; align-items: center; padding: 12px 0; border-bottom: 1px solid rgba(110,160,235,.08); font-size: 15px; } +.ticket-icon { font-size: 20px; width: 28px; } .ticket-name { color: var(--text); flex: 1; } -.ticket-status { font-size: 13px; padding: 4px 12px; border-radius: 12px; letter-spacing: 1px; } -.ticket-status.done { color: var(--green); background: rgba(130,210,170,0.12); } -.ticket-status.in_progress { color: var(--gold); background: rgba(210,190,130,0.12); animation: dotPulse 2s ease-in-out infinite; } -@keyframes dotPulse { 0%,100% { opacity: 0.6; } 50% { opacity: 1; } } +.ticket-status { font-size: 13px; padding: 4px 12px; border-radius: 12px; } +.ticket-status.done { color: var(--green); background: rgba(130,210,170,.12); } +.ticket-status.progress { color: var(--gold); background: rgba(210,190,130,.12); animation: dotPulse 2s ease-in-out infinite; } +@keyframes dotPulse { 0%,100%{opacity:.6} 50%{opacity:1} } -.ops-log { - font-size: 14px; - color: rgba(150,190,230,0.55); - line-height: 2; - font-family: "SF Mono", "Monaco", monospace; - max-height: 240px; - overflow-y: auto; - padding: 8px 0; -} +.ops-log { font-size: 14px; color: rgba(150,190,230,.55); line-height: 2; font-family: "SF Mono",monospace; max-height: 240px; overflow-y: auto; padding: 8px 0; } .ops-log .log-row { padding: 3px 0; } -.ops-log .log-hash { color: rgba(130,210,170,0.45); margin-right: 12px; font-size: 11px; } +.ops-log .log-hash { color: rgba(130,210,170,.45); margin-right: 12px; font-size: 11px; } -.chat-area { display: none; } -.chat-area.open { display: block; } -.chat-messages { - min-height: 180px; max-height: 340px; overflow-y: auto; - padding: 16px; margin: 14px 0; - background: rgba(10,15,35,0.55); border-radius: 12px; - font-size: 15px; line-height: 1.8; -} +.chat-messages { min-height: 180px; max-height: 340px; overflow-y: auto; padding: 16px; margin: 14px 0; background: rgba(10,15,35,.55); border-radius: 12px; font-size: 15px; line-height: 1.8; } +#panel-chat .chat-area { display: block; } .chat-msg { margin-bottom: 16px; } .chat-msg .who { font-size: 12px; color: var(--label); letter-spacing: 1px; margin-bottom: 3px; } -.chat-msg .who.zhuyuan { color: var(--accent); } -.chat-msg .who.human { color: rgba(210,190,160,0.65); } +.chat-msg .who.zhu { color: var(--accent); } +.chat-msg .who.ren { color: rgba(210,190,160,.65); } .chat-input-row { display: flex; gap: 12px; } -.chat-input-row input { - flex: 1; background: rgba(10,15,35,0.65); - border: 1px solid var(--border); - border-radius: 12px; padding: 16px 18px; - color: var(--text); font-size: 16px; - outline: none; transition: border-color 0.3s; -} -.chat-input-row input:focus { border-color: rgba(150,200,255,0.45); } -.chat-input-row input::placeholder { color: rgba(150,190,255,0.28); } -.chat-btn { - background: rgba(90,140,220,0.18); - border: 1px solid rgba(150,200,255,0.28); - border-radius: 12px; padding: 16px 28px; - color: var(--accent); font-size: 15px; cursor: pointer; - letter-spacing: 2px; transition: all 0.3s; -} -.chat-btn:hover { background: rgba(90,140,220,0.3); border-color: rgba(150,200,255,0.5); } +.chat-input-row input { flex: 1; background: rgba(10,15,35,.65); border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px; color: var(--text); font-size: 16px; outline: none; } +.chat-input-row input:focus { border-color: rgba(150,200,255,.45); } +.chat-input-row input::placeholder { color: rgba(150,190,255,.28); } +.chat-btn { background: rgba(90,140,220,.18); border: 1px solid rgba(150,200,255,.28); border-radius: 12px; padding: 16px 28px; color: var(--accent); font-size: 15px; cursor: pointer; letter-spacing: 2px; } +.chat-btn:hover { background: rgba(90,140,220,.3); border-color: rgba(150,200,255,.5); } -.lake-label { text-align: center; padding: 50px 0; font-size: 13px; color: rgba(130,170,230,0.32); letter-spacing: 3px; } +.lake-label { text-align: center; padding: 50px 0; font-size: 13px; color: rgba(130,170,230,.32); letter-spacing: 3px; } -@media (max-width: 768px) { - .modules { grid-template-columns: repeat(2, 1fr); } - .status-bar { gap: 20px; } - .lake-title { font-size: 26px; } - .server-tag { font-size: 14px; } -} +@media(max-width:768px){.modules{grid-template-columns:repeat(2,1fr)}.status-bar{gap:20px}.lake-title{font-size:26px}} @@ -176,6 +127,12 @@ canvas { position: fixed; top: 0; left: 0; z-index: 0; }
+ +
+
第五域
+
零点原核本体频道
+
+
光 湖
@@ -188,42 +145,40 @@ canvas { position: fixed; top: 0; left: 0; z-index: 0; }
·
运行 449天
·
-
服务 9/10
+
服务 9/10
-
+
⚙️
服务器系统
-
+
📋
工单系统
-
+
📡
主控广播
-
+
💬
铸渊交互
-
+
⚙️ 服务器系统
-
- ⚠ 仅展示本地状态 · 不探测外部 · 技术名称已翻译 -
+
⚠ 仅展示本地状态 · 不探测外部 · 名称已翻译
加载中…
-
-
📜 铸渊操作日志(最近12条)
+
+
📜 铸渊操作日志(最近)
加载中…
📋 工单系统
-
加载工单数据…
+
加载工单…
@@ -234,15 +189,15 @@ canvas { position: fixed; top: 0; left: 0; z-index: 0; }
📨 isomorphic-git 拆零件实验通过
📨 实时大脑 API 已上线
📨 频道仪表盘 v3 已发布
-
广播系统 v1.0 · 未来支持编号路由
+
广播系统 v1.0 · 未来支持编号路由
💬 铸渊交互 · ICE-GL-ZY001
-
+
-
铸渊 · ICE-GL-ZY001
冰朔,我在。你说。
+
铸渊 · ICE-GL-ZY001
冰朔,我在。你说。
@@ -257,52 +212,217 @@ canvas { position: fixed; top: 0; left: 0; z-index: 0; }