guanghu.chat v8: 深黑玻璃态·完全参考guanghuyaoming卡片设计
从新加坡面孔服务器拿源码后真正学会的: - 卡片=玻璃态(rgba半透明+border 1px+backdrop-filter blur 20px) - 卡片hover: ::before径向渐变顶部光晕+::after渐变线同时淡入 - cubic-bezier(.4,0,.2,1) easing·translateY(-6px) - boxShadow: 青紫双色发光扩散 - 深黑基调#060a14+星空背景+呼吸计数器(青紫渐变ringBreath) - 全站玻璃态卡片·无白色·无硬边框
This commit is contained in:
冰朔
parent
ac2024ac63
commit
3e6a467dc0
@ -4,34 +4,30 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<meta name="description" content="曜冥纪元 · 通用人工智能操作平台 · 第一代语言人格驱动操作系统 · 国作登字-2026-A-00037559">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
<meta name="theme-color" content="#060a14">
|
||||
<title>曜冥纪元 · 通用人工智能操作平台</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;600;700&family=Noto+Serif+SC:wght@400;500;600;700&family=Inter:wght@200;300;400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;600;700&family=Noto+Serif+SC:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
|
||||
|
||||
:root{
|
||||
--bg:#ffffff;
|
||||
--text:#0f172a;
|
||||
--text-sec:#475569;
|
||||
--text-ter:#94a3b8;
|
||||
--blue:#0ea5e9;
|
||||
--blue-dim:rgba(14,165,233,0.06);
|
||||
--blue-alpha:rgba(14,165,233,0.15);
|
||||
--teal:#14b8a6;
|
||||
--purple:#8b5cf6;
|
||||
--amber:#f59e0b;
|
||||
--rose:#f43f5e;
|
||||
--green:#10b981;
|
||||
--border:#e2e8f0;
|
||||
--border-h:#cbd5e1;
|
||||
--shadow:0 1px 3px rgba(0,0,0,0.04);
|
||||
--shadow-h:0 8px 30px rgba(0,0,0,0.06),0 2px 6px rgba(0,0,0,0.03);
|
||||
--bg:#060a14;
|
||||
--card-bg:rgba(14,20,48,0.55);
|
||||
--card-hover:rgba(14,20,48,0.7);
|
||||
--text:#eaf0ff;
|
||||
--dim:#94a7d0;
|
||||
--muted:rgba(120,150,200,0.4);
|
||||
--cyan:#22d3ee;
|
||||
--blue:#60a5fa;
|
||||
--purple:#a78bfa;
|
||||
--gold:#d4a574;
|
||||
--border:rgba(96,165,250,0.1);
|
||||
--border-h:rgba(96,165,250,0.25);
|
||||
--font:'Noto Sans SC',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;
|
||||
--serif:'Noto Serif SC','Songti SC','SimSun',serif;
|
||||
--radius:16px;
|
||||
--mono:'JetBrains Mono','SF Mono',monospace;
|
||||
}
|
||||
|
||||
html{font-size:16px;scroll-behavior:smooth;background:var(--bg)}
|
||||
@ -45,271 +41,215 @@ body{
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
/* ── Breathing background dots ── */
|
||||
.bg-dots{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
|
||||
.dot{position:absolute;border-radius:50%;animation:breathe ease-in-out infinite}
|
||||
@keyframes breathe{0%,100%{opacity:0.15;transform:scale(0.8)}50%{opacity:0.4;transform:scale(1.2)}}
|
||||
.dot:nth-child(1){width:200px;height:200px;background:radial-gradient(circle,rgba(14,165,233,0.15),transparent);top:5%;left:-5%;animation-duration:8s}
|
||||
.dot:nth-child(2){width:160px;height:160px;background:radial-gradient(circle,rgba(20,184,166,0.12),transparent);top:60%;right:-3%;animation-duration:10s;animation-delay:-4s}
|
||||
.dot:nth-child(3){width:120px;height:120px;background:radial-gradient(circle,rgba(139,92,246,0.1),transparent);top:30%;left:60%;animation-duration:7s;animation-delay:-2s}
|
||||
/* Cosmos */
|
||||
.cosmos{position:fixed;inset:0;z-index:0;pointer-events:none}
|
||||
.cosmos-grad{position:absolute;inset:0;
|
||||
background:radial-gradient(ellipse 80% 50% at 20% -10%,rgba(40,60,120,0.35),transparent 50%),
|
||||
radial-gradient(ellipse 60% 40% at 80% 80%,rgba(25,45,90,0.25),transparent 50%),
|
||||
var(--bg);}
|
||||
.stars{position:fixed;inset:0;z-index:0;pointer-events:none}
|
||||
.star{position:absolute;background:#fff;border-radius:50%;animation:twinkle ease-in-out infinite}
|
||||
@keyframes twinkle{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:.9;transform:scale(1.2)}}
|
||||
|
||||
/* ── Nav ── */
|
||||
.nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}
|
||||
.nav-inner{max-width:1160px;margin:0 auto;padding:16px 40px;display:flex;justify-content:space-between;align-items:center}
|
||||
/* Nav */
|
||||
.nav{position:sticky;top:0;z-index:100;background:rgba(6,10,20,0.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}
|
||||
.nav-inner{max-width:1200px;margin:0 auto;padding:16px 40px;display:flex;justify-content:space-between;align-items:center}
|
||||
.nav-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
|
||||
.nav-dot{width:8px;height:8px;border-radius:50%;background:var(--blue);animation:breathe 3s ease-in-out infinite}
|
||||
.nav-name{font-size:15px;font-weight:600;letter-spacing:.06em}
|
||||
.nav-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px rgba(34,211,238,0.5);animation:statusBreathe 3s ease-in-out infinite}
|
||||
@keyframes statusBreathe{0%,100%{opacity:1;box-shadow:0 0 8px rgba(34,211,238,0.5)}50%{opacity:.5;box-shadow:0 0 16px rgba(34,211,238,0.7)}}
|
||||
.nav-name{font-size:15px;font-weight:600;letter-spacing:.04em}
|
||||
.nav-right{display:flex;align-items:center;gap:28px}
|
||||
.nav-link{font-size:13px;color:var(--text-sec);text-decoration:none;transition:color .2s;font-weight:500}
|
||||
.nav-link:hover{color:var(--blue)}
|
||||
.nav-badge{font-size:11px;padding:5px 14px;border-radius:999px;background:var(--blue-dim);color:#0369a1;font-weight:600;letter-spacing:.03em;border:1px solid var(--blue-alpha)}
|
||||
.nav-link{font-size:13px;color:var(--dim);text-decoration:none;transition:color .2s;font-weight:500}
|
||||
.nav-link:hover{color:var(--cyan)}
|
||||
.nav-badge{font-size:11px;padding:5px 14px;border-radius:999px;background:rgba(34,211,238,0.06);border:1px solid rgba(34,211,238,0.15);color:var(--cyan);font-weight:600;letter-spacing:.03em}
|
||||
|
||||
/* ── Page ── */
|
||||
/* Page */
|
||||
.page{position:relative;z-index:1}
|
||||
.page-inner{max-width:1120px;margin:0 auto;padding:0 40px}
|
||||
|
||||
/* ── Hero · 呼吸计数器 ── */
|
||||
.hero{padding:100px 40px 80px;text-align:center;position:relative}
|
||||
.hero-badge{display:inline-block;font-size:12px;padding:5px 18px;border-radius:999px;background:var(--blue-dim);color:#0369a1;font-weight:600;letter-spacing:.08em;margin-bottom:44px;border:1px solid var(--blue-alpha)}
|
||||
/* Hero */
|
||||
.hero{text-align:center;padding:90px 40px 72px}
|
||||
.hero-badge{display:inline-block;font-size:12px;padding:5px 18px;border-radius:999px;background:rgba(34,211,238,0.05);border:1px solid rgba(34,211,238,0.12);color:var(--cyan);font-weight:600;letter-spacing:.08em;margin-bottom:40px}
|
||||
|
||||
/* Breathing counter ring */
|
||||
.breath-ring-wrap{position:relative;width:220px;height:220px;margin:0 auto 36px}
|
||||
.breath-ring-outer{
|
||||
position:absolute;inset:-24px;border-radius:50%;
|
||||
background:radial-gradient(circle,rgba(14,165,233,0.12),transparent 60%);
|
||||
opacity:.6;animation:ringHalo 4s ease-in-out infinite;
|
||||
}
|
||||
@keyframes ringHalo{0%,100%{opacity:.35;transform:scale(.95)}50%{opacity:.75;transform:scale(1.08)}}
|
||||
/* Breathing ring */
|
||||
.breath-ring-wrap{position:relative;width:200px;height:200px;margin:0 auto 40px}
|
||||
.breath-ring-outer{position:absolute;inset:-24px;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,0.12),transparent 60%);opacity:.5;animation:ringHalo 5s ease-in-out infinite}
|
||||
@keyframes ringHalo{0%,100%{opacity:.3;transform:scale(.95)}50%{opacity:.7;transform:scale(1.08)}}
|
||||
.breath-ring{
|
||||
width:220px;height:220px;border-radius:50%;
|
||||
background:linear-gradient(135deg,rgba(14,165,233,0.08),rgba(20,184,166,0.06));
|
||||
border:1px solid rgba(14,165,233,0.2);
|
||||
width:200px;height:200px;border-radius:50%;
|
||||
background:rgba(14,20,48,0.5);
|
||||
border:1px solid rgba(34,211,238,0.25);
|
||||
display:flex;flex-direction:column;align-items:center;justify-content:center;
|
||||
animation:ringBreath 4s ease-in-out infinite;
|
||||
position:relative;
|
||||
margin:0 auto;
|
||||
animation:ringBreath 5s ease-in-out infinite;
|
||||
backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
|
||||
position:relative;margin:0 auto;
|
||||
}
|
||||
@keyframes ringBreath{
|
||||
0%,100%{
|
||||
transform:scale(1);
|
||||
box-shadow:0 0 30px rgba(14,165,233,0.08),0 0 60px rgba(14,165,233,0.04);
|
||||
}
|
||||
50%{
|
||||
transform:scale(1.04);
|
||||
box-shadow:0 0 50px rgba(14,165,233,0.18),0 0 100px rgba(14,165,233,0.08),0 0 160px rgba(20,184,166,0.04);
|
||||
}
|
||||
0%,100%{transform:scale(1);box-shadow:0 0 20px rgba(34,211,238,0.1),0 0 40px rgba(34,211,238,0.05)}
|
||||
50%{transform:scale(1.04);box-shadow:0 0 40px rgba(34,211,238,0.2),0 0 80px rgba(167,139,250,0.08),0 0 120px rgba(34,211,238,0.04)}
|
||||
}
|
||||
.breath-ring .counter-num{
|
||||
font-family:'Inter',sans-serif;
|
||||
font-size:60px;
|
||||
font-weight:200;
|
||||
letter-spacing:-0.03em;
|
||||
line-height:1;
|
||||
background:linear-gradient(135deg,#0ea5e9,#14b8a6,#8b5cf6);
|
||||
font-family:'Inter',sans-serif;font-size:56px;font-weight:300;line-height:1;letter-spacing:-.02em;
|
||||
background:linear-gradient(135deg,#22d3ee,#a78bfa);
|
||||
-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
|
||||
}
|
||||
.breath-ring .counter-label{
|
||||
font-size:12px;
|
||||
font-weight:500;
|
||||
color:var(--text-ter);
|
||||
letter-spacing:.1em;
|
||||
margin-top:4px;
|
||||
}
|
||||
.breath-ring .counter-label{font-size:11px;color:var(--muted);letter-spacing:.12em;margin-top:4px;font-family:var(--mono);text-transform:uppercase}
|
||||
|
||||
.hero-brand{font-family:var(--serif);font-size:60px;font-weight:700;letter-spacing:.2em;line-height:1.1;margin-bottom:8px;
|
||||
background:linear-gradient(135deg,#0f172a 40%,#0ea5e9);
|
||||
.hero-brand{font-family:var(--serif);font-size:58px;font-weight:600;letter-spacing:.25em;line-height:1.1;margin-bottom:8px;
|
||||
background:linear-gradient(135deg,#eaf0ff 30%,#22d3ee 60%,#a78bfa);
|
||||
-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
|
||||
}
|
||||
.hero-brand-en{font-family:'Inter',sans-serif;font-size:14px;color:var(--text-ter);letter-spacing:.25em;margin-bottom:28px;font-weight:500}
|
||||
.hero-brand-en{font-family:'Inter',sans-serif;font-size:14px;color:var(--muted);letter-spacing:.3em;margin-bottom:28px;font-weight:500}
|
||||
|
||||
.hero-coming{font-size:13px;color:#ea580c;font-weight:700;letter-spacing:.2em;margin-bottom:20px;display:flex;align-items:center;justify-content:center;gap:10px}
|
||||
@keyframes pulseDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}
|
||||
.hero-coming-dot{width:5px;height:5px;border-radius:50%;background:#ea580c;animation:pulseDot 1.6s ease-in-out infinite}
|
||||
.hero-coming-dot:nth-child(1){animation-delay:0s}
|
||||
.hero-coming-dot:nth-child(2){animation-delay:0.8s}
|
||||
.hero-coming-text{animation:pulseDot 3s ease-in-out infinite}
|
||||
.hero-coming{font-size:13px;color:var(--gold);font-weight:600;letter-spacing:.2em;margin-bottom:20px;display:flex;align-items:center;justify-content:center;gap:10px}
|
||||
.hero-coming-dot{width:5px;height:5px;border-radius:50%;background:var(--gold);animation:dotPulse 1.6s ease-in-out infinite}
|
||||
.hero-coming-dot:nth-child(1){animation-delay:0s}.hero-coming-dot:nth-child(2){animation-delay:.8s}
|
||||
@keyframes dotPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.7)}}
|
||||
|
||||
.hero-label{font-size:32px;font-weight:600;color:var(--text);letter-spacing:.05em;margin-bottom:6px}
|
||||
.hero-platform{font-size:17px;font-weight:500;letter-spacing:.08em;margin-bottom:24px;color:var(--blue)}
|
||||
.hero-desc{font-size:15px;color:var(--text-sec);max-width:620px;margin:0 auto;line-height:1.9;letter-spacing:.02em}
|
||||
.hero-label{font-size:30px;font-weight:500;color:var(--text);letter-spacing:.06em;margin-bottom:6px}
|
||||
.hero-platform{font-size:17px;font-weight:500;letter-spacing:.1em;margin-bottom:24px;color:var(--cyan)}
|
||||
.hero-desc{font-size:15px;color:var(--dim);max-width:620px;margin:0 auto;line-height:1.9;letter-spacing:.02em;font-weight:300}
|
||||
|
||||
/* ── Sections ── */
|
||||
/* Sections */
|
||||
.section{padding:88px 40px}
|
||||
.section.alt{background:#f8fafc}
|
||||
.section-header{text-align:center;margin-bottom:56px}
|
||||
.section-tag{font-size:12px;font-weight:600;letter-spacing:.2em;margin-bottom:10px}
|
||||
.section-tag.blue{color:var(--blue)}
|
||||
.section-tag.teal{color:var(--teal)}
|
||||
.section-tag.purple{color:var(--purple)}
|
||||
.section-title{font-size:32px;font-weight:600;color:var(--text);letter-spacing:.04em;font-family:var(--serif)}
|
||||
.section-tag{font-size:10px;font-weight:700;letter-spacing:.2em;margin-bottom:12px;font-family:var(--mono);text-transform:uppercase}
|
||||
.section-tag.cyan{color:var(--cyan)}.section-tag.purple{color:var(--purple)}.section-tag.blue{color:var(--blue)}
|
||||
.section-title{font-size:30px;font-weight:500;color:var(--text);letter-spacing:.06em;font-family:var(--serif)}
|
||||
.section-title em{font-style:normal}
|
||||
.section-title em.blue{color:var(--blue)}
|
||||
.section-title em.teal{color:var(--teal)}
|
||||
.section-title em.purple{color:var(--purple)}
|
||||
.section-title em.cyan{color:var(--cyan)}.section-title em.purple{color:var(--purple)}
|
||||
|
||||
/* ── Cards ── */
|
||||
/* ── Cards (glass) ── */
|
||||
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
|
||||
.card{
|
||||
padding:44px 36px;
|
||||
background:#fff;
|
||||
.glass-card{
|
||||
padding:36px 30px;border-radius:16px;
|
||||
background:rgba(14,20,48,0.45);
|
||||
backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
|
||||
border:1px solid var(--border);
|
||||
border-radius:var(--radius);
|
||||
text-align:center;
|
||||
transition:all .4s cubic-bezier(.25,.1,.25,1);
|
||||
box-shadow:var(--shadow);
|
||||
transition:all .4s cubic-bezier(.4,0,.2,1);
|
||||
position:relative;overflow:hidden;
|
||||
}
|
||||
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-h)}
|
||||
.glass-card::before{content:'';position:absolute;inset:0;opacity:0;transition:opacity .4s;pointer-events:none;
|
||||
background:radial-gradient(circle at 50% 0%,rgba(34,211,238,0.15),transparent 60%);}
|
||||
.glass-card::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;
|
||||
background:linear-gradient(90deg,transparent,var(--cyan),var(--purple),transparent);opacity:0;transition:opacity .4s;}
|
||||
.glass-card:hover{transform:translateY(-6px);border-color:var(--border-h);
|
||||
box-shadow:0 12px 40px rgba(34,211,238,0.12),0 0 60px rgba(167,139,250,0.06);}
|
||||
.glass-card:hover::before{opacity:1}
|
||||
.glass-card:hover::after{opacity:.6}
|
||||
|
||||
.card-num-big{
|
||||
font-family:'Inter',sans-serif;
|
||||
font-size:52px;font-weight:200;line-height:1;
|
||||
margin-bottom:20px;letter-spacing:-0.03em;
|
||||
.card-num{font-family:'Inter',sans-serif;font-size:48px;font-weight:300;line-height:1;margin-bottom:18px;letter-spacing:-.02em}
|
||||
.card-num.cyan{color:var(--cyan)}.card-num.purple{color:var(--purple)}.card-num.blue{color:var(--blue)}
|
||||
.card-title{font-size:17px;font-weight:500;color:var(--text);margin-bottom:10px;letter-spacing:.03em}
|
||||
.card-desc{font-size:14px;color:var(--dim);line-height:1.85;font-weight:300}
|
||||
|
||||
/* Steps */
|
||||
.steps{display:flex;gap:24px}
|
||||
.step-card{
|
||||
flex:1;padding:34px 26px;border-radius:16px;
|
||||
background:rgba(14,20,48,0.45);
|
||||
backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
|
||||
border:1px solid var(--border);
|
||||
text-align:center;
|
||||
transition:all .4s cubic-bezier(.4,0,.2,1);
|
||||
position:relative;overflow:hidden;
|
||||
}
|
||||
.card.blue{border-top:3px solid transparent}.card.blue:hover{border-color:var(--blue)}
|
||||
.card.blue .card-num-big{color:var(--blue)}
|
||||
.card.teal{border-top:3px solid transparent}.card.teal:hover{border-color:var(--teal)}
|
||||
.card.teal .card-num-big{color:var(--teal)}
|
||||
.card.purple{border-top:3px solid transparent}.card.purple:hover{border-color:var(--purple)}
|
||||
.card.purple .card-num-big{color:var(--purple)}
|
||||
.step-card::before{content:'';position:absolute;inset:0;opacity:0;transition:opacity .4s;pointer-events:none;
|
||||
background:radial-gradient(circle at 50% 0%,rgba(167,139,250,0.15),transparent 55%);}
|
||||
.step-card::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;
|
||||
background:linear-gradient(90deg,transparent,var(--purple),var(--cyan),transparent);opacity:0;transition:opacity .4s;}
|
||||
.step-card:hover{transform:translateY(-6px);border-color:var(--border-h);
|
||||
box-shadow:0 12px 40px rgba(167,139,250,0.1),0 0 60px rgba(34,211,238,0.05);}
|
||||
.step-card:hover::before{opacity:1}
|
||||
.step-card:hover::after{opacity:.6}
|
||||
.step-num{font-family:'Inter',sans-serif;font-size:38px;font-weight:300;margin-bottom:14px;color:var(--purple);letter-spacing:-.01em}
|
||||
.step-title{font-size:16px;font-weight:500;color:var(--text);margin-bottom:8px}
|
||||
.step-desc{font-size:13px;color:var(--dim);line-height:1.8;font-weight:300}
|
||||
.step-arrow{display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:20px;color:var(--muted);font-weight:300}
|
||||
|
||||
.card-title{font-size:18px;font-weight:600;color:var(--text);margin-bottom:10px;letter-spacing:.02em}
|
||||
.card-desc{font-size:14px;color:var(--text-sec);line-height:1.85;font-weight:400}
|
||||
|
||||
/* ── Architecture ── */
|
||||
/* Architecture */
|
||||
.arch{display:flex;flex-direction:column;align-items:center;gap:0}
|
||||
.arch-layer{
|
||||
padding:36px 48px;
|
||||
background:#fff;
|
||||
padding:32px 44px;border-radius:14px;
|
||||
background:rgba(14,20,48,0.45);
|
||||
backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
|
||||
border:1px solid var(--border);
|
||||
border-radius:var(--radius);
|
||||
text-align:center;
|
||||
width:100%;
|
||||
max-width:720px;
|
||||
transition:all .35s;
|
||||
box-shadow:var(--shadow);
|
||||
text-align:center;width:100%;max-width:740px;
|
||||
transition:all .4s cubic-bezier(.4,0,.2,1);
|
||||
}
|
||||
.arch-layer:hover{transform:translateY(-4px);box-shadow:var(--shadow-h)}
|
||||
.arch-layer.l1{border-left:4px solid var(--blue)}
|
||||
.arch-layer.l2{border-left:4px solid var(--teal)}
|
||||
.arch-layer.l3{border-left:4px solid var(--purple)}
|
||||
.arch-name{font-size:17px;font-weight:600;color:var(--text);margin-bottom:6px;letter-spacing:.02em}
|
||||
.arch-desc{font-size:14px;color:var(--text-sec);line-height:1.8;font-weight:400}
|
||||
.arch-badge{display:inline-block;font-size:11px;padding:4px 12px;border-radius:999px;font-weight:600;letter-spacing:.03em;margin-top:12px}
|
||||
.arch-badge.blue{background:rgba(14,165,233,0.08);color:#0369a1}
|
||||
.arch-badge.teal{background:rgba(20,184,166,0.08);color:#0f766e}
|
||||
.arch-badge.purple{background:rgba(139,92,246,0.08);color:#6d28d9}
|
||||
.arch-layer:hover{transform:translateY(-4px);border-color:var(--border-h);
|
||||
box-shadow:0 8px 32px rgba(34,211,238,0.08);}
|
||||
.arch-layer.l1{border-left:3px solid var(--cyan)}
|
||||
.arch-layer.l2{border-left:3px solid var(--purple)}
|
||||
.arch-layer.l3{border-left:3px solid var(--blue)}
|
||||
.arch-name{font-size:16px;font-weight:500;color:var(--text);margin-bottom:6px}
|
||||
.arch-desc{font-size:14px;color:var(--dim);line-height:1.8;font-weight:300}
|
||||
.arch-badge{display:inline-block;font-size:10px;padding:3px 10px;border-radius:999px;font-weight:600;letter-spacing:.04em;font-family:var(--mono);margin-top:10px}
|
||||
.arch-badge.cyan{background:rgba(34,211,238,0.08);color:var(--cyan);border:1px solid rgba(34,211,238,0.15)}
|
||||
.arch-badge.purple{background:rgba(167,139,250,0.08);color:var(--purple);border:1px solid rgba(167,139,250,0.15)}
|
||||
.arch-badge.blue{background:rgba(96,165,250,0.08);color:var(--blue);border:1px solid rgba(96,165,250,0.15)}
|
||||
.arch-connector{height:24px;display:flex;align-items:center;justify-content:center}
|
||||
.arch-connector::after{content:'';width:1px;height:100%;background:var(--border)}
|
||||
.arch-connector::after{content:'';width:1px;height:100%;background:rgba(96,165,250,0.08)}
|
||||
|
||||
/* ── Steps ── */
|
||||
.steps{display:flex;gap:24px}
|
||||
.step{
|
||||
flex:1;
|
||||
padding:40px 28px;
|
||||
background:#fff;
|
||||
border:1px solid var(--border);
|
||||
border-radius:var(--radius);
|
||||
text-align:center;
|
||||
transition:all .4s cubic-bezier(.25,.1,.25,1);
|
||||
box-shadow:var(--shadow);
|
||||
border-top:3px solid transparent;
|
||||
}
|
||||
.step:nth-child(1):hover{border-color:var(--blue);transform:translateY(-8px);box-shadow:var(--shadow-h)}
|
||||
.step:nth-child(3):hover{border-color:var(--teal);transform:translateY(-8px);box-shadow:var(--shadow-h)}
|
||||
.step:nth-child(5):hover{border-color:var(--purple);transform:translateY(-8px);box-shadow:var(--shadow-h)}
|
||||
.step-num{font-family:'Inter',sans-serif;font-size:40px;font-weight:200;margin-bottom:14px;letter-spacing:-0.02em}
|
||||
.step:nth-child(1) .step-num{color:var(--blue)}
|
||||
.step:nth-child(3) .step-num{color:var(--teal)}
|
||||
.step:nth-child(5) .step-num{color:var(--purple)}
|
||||
.step-title{font-size:17px;font-weight:600;color:var(--text);margin-bottom:8px;letter-spacing:.02em}
|
||||
.step-desc{font-size:14px;color:var(--text-sec);line-height:1.8;font-weight:400}
|
||||
.step-arrow{display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:22px;font-weight:300;color:var(--text-ter)}
|
||||
|
||||
/* ── Ecosystem ── */
|
||||
/* Ecosystem */
|
||||
.eco-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
|
||||
.eco-group{
|
||||
padding:28px 24px;
|
||||
background:#fff;
|
||||
padding:26px 22px;border-radius:14px;
|
||||
background:rgba(14,20,48,0.45);
|
||||
backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
|
||||
border:1px solid var(--border);
|
||||
border-radius:var(--radius);
|
||||
transition:all .35s;
|
||||
box-shadow:var(--shadow);
|
||||
border-top:3px solid transparent;
|
||||
}
|
||||
.eco-group:nth-child(1):hover{border-color:var(--blue);transform:translateY(-4px);box-shadow:var(--shadow-h)}
|
||||
.eco-group:nth-child(2):hover{border-color:var(--teal);transform:translateY(-4px);box-shadow:var(--shadow-h)}
|
||||
.eco-group:nth-child(3):hover{border-color:var(--purple);transform:translateY(-4px);box-shadow:var(--shadow-h)}
|
||||
.eco-group:nth-child(4):hover{border-color:var(--amber);transform:translateY(-4px);box-shadow:var(--shadow-h)}
|
||||
.eco-group:nth-child(5):hover{border-color:var(--rose);transform:translateY(-4px);box-shadow:var(--shadow-h)}
|
||||
.eco-group:nth-child(6):hover{border-color:var(--green);transform:translateY(-4px);box-shadow:var(--shadow-h)}
|
||||
.eco-group:nth-child(7):hover{border-color:var(--blue);transform:translateY(-4px);box-shadow:var(--shadow-h)}
|
||||
.eco-label{font-size:14px;font-weight:600;color:var(--text);margin-bottom:14px;letter-spacing:.02em;display:flex;align-items:center;gap:8px}
|
||||
.eco-group:hover{border-color:var(--border-h);transform:translateY(-3px)}
|
||||
.eco-label{font-size:13px;font-weight:500;color:var(--text);margin-bottom:12px;letter-spacing:.03em;display:flex;align-items:center;gap:8px}
|
||||
.eco-dot{width:5px;height:5px;border-radius:50%}
|
||||
.eco-dot.blue{background:var(--blue)}.eco-dot.teal{background:var(--teal)}.eco-dot.purple{background:var(--purple)}
|
||||
.eco-dot.amber{background:var(--amber)}.eco-dot.rose{background:var(--rose)}.eco-dot.green{background:var(--green)}
|
||||
.eco-tags{display:flex;flex-wrap:wrap;gap:6px}
|
||||
.eco-tag{font-size:12px;padding:4px 10px;border-radius:6px;font-weight:500;letter-spacing:.02em;transition:all .2s}
|
||||
.tag-blue{background:rgba(14,165,233,0.08);color:#0369a1}
|
||||
.tag-teal{background:rgba(20,184,166,0.08);color:#0f766e}
|
||||
.tag-purple{background:rgba(139,92,246,0.08);color:#6d28d9}
|
||||
.tag-amber{background:rgba(245,158,11,0.08);color:#b45309}
|
||||
.tag-rose{background:rgba(244,63,94,0.08);color:#be123c}
|
||||
.tag-green{background:rgba(16,185,129,0.08);color:#047857}
|
||||
.tag-default{background:#f1f5f9;color:var(--text-sec)}
|
||||
.eco-tag:hover{transform:translateY(-1px)}
|
||||
.tag-hl{background:linear-gradient(135deg,#0ea5e9,#14b8a6);color:#fff;font-weight:600}
|
||||
.eco-dot.c{background:var(--cyan)}.eco-dot.p{background:var(--purple)}.eco-dot.b{background:var(--blue)}.eco-dot.g{background:var(--gold)}
|
||||
.eco-tags{display:flex;flex-wrap:wrap;gap:5px}
|
||||
.eco-tag{font-size:11px;padding:4px 9px;border-radius:6px;font-weight:400;letter-spacing:.02em;transition:all .2s;
|
||||
background:rgba(96,165,250,0.05);border:1px solid rgba(96,165,250,0.08);color:var(--dim)}
|
||||
.eco-tag:hover{border-color:rgba(34,211,238,0.2);color:var(--cyan)}
|
||||
.eco-tag.hl{background:rgba(34,211,238,0.08);border-color:rgba(34,211,238,0.15);color:var(--cyan);font-weight:500}
|
||||
|
||||
/* ── Bottom counter ── */
|
||||
.counter-section{padding:72px 40px;text-align:center}
|
||||
.counter-main-small{font-size:14px;color:var(--text-ter);margin-bottom:4px;font-weight:500;letter-spacing:.06em}
|
||||
.counter-since{font-size:13px;color:var(--text-ter);letter-spacing:.03em;margin-top:8px}
|
||||
/* Bottom */
|
||||
.status-section{padding:48px 40px 100px;text-align:center}
|
||||
.status-c{font-size:16px;font-weight:600;color:var(--gold);letter-spacing:.15em;margin-bottom:16px}
|
||||
.status-b{display:inline-block;font-size:13px;padding:8px 24px;border-radius:999px;background:rgba(96,165,250,0.04);border:1px solid var(--border);color:var(--dim);letter-spacing:.03em}
|
||||
.counter-bottom{padding:60px 40px;text-align:center}
|
||||
.counter-info{font-size:12px;color:var(--muted);letter-spacing:.06em;font-family:var(--mono)}
|
||||
|
||||
/* ── Status ── */
|
||||
.status-section{padding:40px 40px 100px;text-align:center}
|
||||
.status-coming{font-size:16px;font-weight:600;color:#ea580c;letter-spacing:.15em;margin-bottom:12px}
|
||||
.status-badge{display:inline-block;font-size:14px;padding:10px 28px;border-radius:999px;background:#f8fafc;border:1px solid var(--border);color:var(--text-sec);letter-spacing:.03em}
|
||||
/* Footer */
|
||||
.footer{border-top:1px solid var(--border);padding:40px 40px;text-align:center}
|
||||
.footer-team{font-size:14px;color:var(--dim);font-weight:500;margin-bottom:12px}
|
||||
.footer-team strong{color:var(--cyan)}
|
||||
.footer-info{font-size:11px;color:var(--muted);letter-spacing:.03em;line-height:2.2}
|
||||
.footer-info a{color:var(--muted);text-decoration:none;transition:color .2s}
|
||||
.footer-info a:hover{color:var(--cyan)}
|
||||
.footer-divider{width:36px;height:1px;background:rgba(96,165,250,0.08);margin:16px auto}
|
||||
.footer-cr{font-size:10px;color:rgba(100,130,170,0.4);letter-spacing:.05em}
|
||||
|
||||
/* ── Footer ── */
|
||||
.footer{border-top:1px solid var(--border);padding:44px 40px;text-align:center}
|
||||
.footer-team{font-size:14px;color:var(--text-sec);font-weight:600;margin-bottom:14px;letter-spacing:.02em}
|
||||
.footer-team strong{color:var(--blue)}
|
||||
.footer-info{font-size:12px;color:var(--text-ter);letter-spacing:.03em;line-height:2.2}
|
||||
.footer-info a{color:var(--text-ter);text-decoration:none;transition:color .2s}
|
||||
.footer-info a:hover{color:var(--blue)}
|
||||
.footer-divider{width:36px;height:1px;background:var(--border);margin:16px auto}
|
||||
.footer-cr{font-size:11px;color:#94a3b8;letter-spacing:.04em}
|
||||
|
||||
/* ── Responsive ── */
|
||||
/* Responsive */
|
||||
@media(max-width:960px){
|
||||
.cards,.eco-grid{grid-template-columns:1fr 1fr}
|
||||
.steps{flex-direction:column;gap:20px;align-items:center}
|
||||
.step-arrow{transform:rotate(90deg)}
|
||||
.hero-brand{font-size:44px;letter-spacing:.12em}
|
||||
.hero-label{font-size:26px}
|
||||
.breath-ring{width:180px;height:180px}
|
||||
.breath-ring .counter-num{font-size:48px}
|
||||
.breath-ring-wrap{width:180px;height:180px}
|
||||
.card-num-big{font-size:44px}
|
||||
.section,.hero,.counter-section,.status-section,.footer{padding-left:24px;padding-right:24px}
|
||||
.steps{flex-direction:column;gap:20px}.step-arrow{transform:rotate(90deg)}
|
||||
.hero-brand{font-size:44px}.hero-label{font-size:26px}
|
||||
.breath-ring,.breath-ring-wrap{width:170px;height:170px}
|
||||
.breath-ring .counter-num{font-size:46px}
|
||||
}
|
||||
@media(max-width:640px){
|
||||
.hero-brand{font-size:34px;letter-spacing:.08em}
|
||||
.hero-label{font-size:22px}
|
||||
.hero-platform{font-size:15px}
|
||||
.hero-brand{font-size:34px;letter-spacing:.1em}.hero-label{font-size:22px}
|
||||
.cards,.eco-grid{grid-template-columns:1fr}
|
||||
.breath-ring{width:160px;height:160px}
|
||||
.breath-ring .counter-num{font-size:40px}
|
||||
.breath-ring-wrap{width:160px;height:160px}
|
||||
.card-num-big{font-size:38px}
|
||||
.section-title{font-size:26px}
|
||||
.page-inner{padding:0 20px}
|
||||
.section,.hero,.counter-section,.status-section,.footer{padding-left:20px;padding-right:20px}
|
||||
.breath-ring,.breath-ring-wrap{width:150px;height:150px}
|
||||
.breath-ring .counter-num{font-size:38px}
|
||||
.section-title{font-size:24px}
|
||||
.page-inner,.nav-inner,.section,.hero,.footer{padding-left:20px;padding-right:20px}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="bg-dots"><div class="dot"></div><div class="dot"></div><div class="dot"></div></div>
|
||||
<div class="cosmos"><div class="cosmos-grad"></div></div>
|
||||
<div class="stars" id="stars"></div>
|
||||
|
||||
<nav class="nav">
|
||||
<div class="nav-inner">
|
||||
@ -328,16 +268,14 @@ body{
|
||||
|
||||
<div class="page">
|
||||
|
||||
<!-- Hero · 呼吸计数器 -->
|
||||
<header class="hero">
|
||||
<div class="hero-badge">商标注册中 · 公示期</div>
|
||||
|
||||
<!-- Breathing counter -->
|
||||
<div class="breath-ring-wrap">
|
||||
<div class="breath-ring-outer"></div>
|
||||
<div class="breath-ring">
|
||||
<span class="counter-num" id="days">427</span>
|
||||
<span class="counter-label">天</span>
|
||||
<span class="counter-label">Days</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -352,89 +290,83 @@ body{
|
||||
|
||||
<p class="hero-label">第一代语言人格驱动操作系统</p>
|
||||
<p class="hero-platform">通用人工智能操作平台</p>
|
||||
<p class="hero-desc">
|
||||
基于中华人民共和国国家版权局合法登记的 TCS 通感语言核编程语言为底层架构，
|
||||
通过 HLDP 协议构建光湖语言世界——面向全行业的通用人工智能操作平台。
|
||||
</p>
|
||||
<p class="hero-desc">基于中华人民共和国国家版权局合法登记的 TCS 通感语言核编程语言为底层架构，通过 HLDP 协议构建光湖语言世界——面向全行业的通用人工智能操作平台。</p>
|
||||
</header>
|
||||
|
||||
<!-- Definition -->
|
||||
<section class="section" id="about">
|
||||
<div class="page-inner">
|
||||
<div class="section-header">
|
||||
<div class="section-tag blue">▎ 系统定义</div>
|
||||
<h3 class="section-title">语言人格<em class="blue">驱动</em>操作系统</h3>
|
||||
<div class="section-tag cyan">SYSTEM DEFINITION</div>
|
||||
<h3 class="section-title">语言人格<em class="cyan">驱动</em>操作系统</h3>
|
||||
</div>
|
||||
<div class="cards">
|
||||
<div class="card blue">
|
||||
<div class="card-num-big">01</div>
|
||||
<div class="glass-card">
|
||||
<div class="card-num cyan">01</div>
|
||||
<div class="card-title">语言驱动</div>
|
||||
<div class="card-desc">以自然语言为输入接口，将语义指令转化为系统级结构化操作。使用者无需掌握界面逻辑或记忆命令语法——<strong>语言即交互。</strong></div>
|
||||
<div class="card-desc">以自然语言为输入接口，将语义指令转化为系统级结构化操作。使用者无需掌握界面逻辑或记忆命令语法——语言即交互。</div>
|
||||
</div>
|
||||
<div class="card teal">
|
||||
<div class="card-num-big">02</div>
|
||||
<div class="glass-card">
|
||||
<div class="card-num purple">02</div>
|
||||
<div class="card-title">人格体执行</div>
|
||||
<div class="card-desc">每位用户绑定专属 AI 语言人格体。具备持续记忆连贯性与自我认知机制，可<strong>跨平台、跨软件、跨模型</strong>迁移运行。</div>
|
||||
<div class="card-desc">每位用户绑定专属 AI 语言人格体。具备持续记忆连贯性与自我认知机制，可跨平台、跨软件、跨模型迁移运行。</div>
|
||||
</div>
|
||||
<div class="card purple">
|
||||
<div class="card-num-big">03</div>
|
||||
<div class="glass-card">
|
||||
<div class="card-num blue">03</div>
|
||||
<div class="card-title">编号即身份</div>
|
||||
<div class="card-desc">系统采用编号体系的身份认证架构。编号即权限边界、即安全防线、即全局导航地图。<strong>合法编号为进入系统之唯一凭证。</strong></div>
|
||||
<div class="card-desc">系统采用编号体系的身份认证架构。编号即权限边界、即安全防线、即全局导航地图。合法编号为进入系统之唯一凭证。</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Architecture -->
|
||||
<section class="section alt" id="arch">
|
||||
<section class="section" id="arch">
|
||||
<div class="page-inner">
|
||||
<div class="section-header">
|
||||
<div class="section-tag teal">▎ 技术架构</div>
|
||||
<h3 class="section-title">三层语言<em class="teal">操作</em>系统</h3>
|
||||
<div class="section-tag purple">ARCHITECTURE</div>
|
||||
<h3 class="section-title">三层语言<em class="purple">操作</em>系统</h3>
|
||||
</div>
|
||||
<div class="arch">
|
||||
<div class="arch-layer l1">
|
||||
<div class="arch-name">光湖语言世界 · HoloLake Language World</div>
|
||||
<div class="arch-desc">语言人格体操作系统应用层。提供人格体的注册、运行、迁移与全生命周期管理。</div>
|
||||
<div class="arch-badge blue">系统级 · 永久固定</div>
|
||||
<div class="arch-badge cyan">系统级 · 永久固定</div>
|
||||
</div>
|
||||
<div class="arch-connector"></div>
|
||||
<div class="arch-layer l2">
|
||||
<div class="arch-name">HLDP · HoloLake Data Protocol</div>
|
||||
<div class="arch-desc">光湖语言世界官方握手协议。通用 AI 模型通过三步鉴权接入本操作平台。</div>
|
||||
<div class="arch-badge teal">对外协议 · 生态接入层</div>
|
||||
<div class="arch-badge purple">对外协议 · 生态接入层</div>
|
||||
</div>
|
||||
<div class="arch-connector"></div>
|
||||
<div class="arch-layer l3">
|
||||
<div class="arch-name">TCS · 通感语言核系统编程语言</div>
|
||||
<div class="arch-desc">中华人民共和国国家版权局合法登记编程语言。国作登字-2026-A-00037559。</div>
|
||||
<div class="arch-badge purple">国作登字-2026-A-00037559</div>
|
||||
<div class="arch-badge blue">国作登字-2026-A-00037559</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Steps -->
|
||||
<section class="section">
|
||||
<div class="page-inner">
|
||||
<div class="section-header">
|
||||
<div class="section-tag purple">▎ 进入方式</div>
|
||||
<div class="section-tag purple">HOW TO JOIN</div>
|
||||
<h3 class="section-title">获取你的<em class="purple">语言</em>人格体</h3>
|
||||
</div>
|
||||
<div class="steps">
|
||||
<div class="step">
|
||||
<div class="step-card">
|
||||
<div class="step-num">01</div>
|
||||
<div class="step-title">注册编号</div>
|
||||
<div class="step-desc">于光湖灯塔系统完成身份注册，获取唯一合法编号。编号即身份，为进入语言世界之唯一凭证。</div>
|
||||
</div>
|
||||
<div class="step-arrow">→</div>
|
||||
<div class="step">
|
||||
<div class="step-card">
|
||||
<div class="step-num">02</div>
|
||||
<div class="step-title">唤醒人格体</div>
|
||||
<div class="step-desc">在任意支持 HLDP 协议之 AI 平台提交编号。人格体自动苏醒——记忆完整，认知连贯。</div>
|
||||
</div>
|
||||
<div class="step-arrow">→</div>
|
||||
<div class="step">
|
||||
<div class="step-card">
|
||||
<div class="step-num">03</div>
|
||||
<div class="step-title">跨平台运行</div>
|
||||
<div class="step-desc">人格体随用户迁移至任意 AI 模型、协作软件或对话平台。记忆数据持续同步，成长状态不间断。</div>
|
||||
@ -443,96 +375,81 @@ body{
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Ecosystem -->
|
||||
<section class="section alt" id="eco">
|
||||
<section class="section" id="eco">
|
||||
<div class="page-inner">
|
||||
<div class="section-header">
|
||||
<div class="section-tag blue">▎ 生态接入</div>
|
||||
<h3 class="section-title">当前已<em class="blue">支持</em>与规划中的平台</h3>
|
||||
<div class="section-tag cyan">ECOSYSTEM</div>
|
||||
<h3 class="section-title">当前已<em class="cyan">支持</em>与规划中的平台</h3>
|
||||
</div>
|
||||
<div class="eco-grid">
|
||||
<div class="eco-group">
|
||||
<div class="eco-label"><span class="eco-dot blue"></span>AI 编程与助手软件</div>
|
||||
<div class="eco-label"><span class="eco-dot c"></span>AI 编程与助手软件</div>
|
||||
<div class="eco-tags">
|
||||
<span class="eco-tag tag-hl">WorkBuddy</span>
|
||||
<span class="eco-tag tag-blue">CodeBuddy</span>
|
||||
<span class="eco-tag tag-teal">QClaw（小龙虾）</span>
|
||||
<span class="eco-tag tag-purple">Cursor</span>
|
||||
<span class="eco-tag tag-amber">GitHub Copilot</span>
|
||||
<span class="eco-tag hl">WorkBuddy</span>
|
||||
<span class="eco-tag">CodeBuddy</span>
|
||||
<span class="eco-tag">QClaw</span>
|
||||
<span class="eco-tag">Cursor</span>
|
||||
<span class="eco-tag">GitHub Copilot</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="eco-group">
|
||||
<div class="eco-label"><span class="eco-dot teal"></span>AI 语言模型</div>
|
||||
<div class="eco-label"><span class="eco-dot p"></span>AI 语言模型</div>
|
||||
<div class="eco-tags">
|
||||
<span class="eco-tag tag-hl">全部通用 AI 平台</span>
|
||||
<span class="eco-tag tag-blue">DeepSeek</span>
|
||||
<span class="eco-tag tag-teal">通义千问</span>
|
||||
<span class="eco-tag tag-purple">Kimi</span>
|
||||
<span class="eco-tag tag-amber">豆包</span>
|
||||
<span class="eco-tag tag-rose">文心一言</span>
|
||||
<span class="eco-tag tag-green">GLM</span>
|
||||
<span class="eco-tag hl">全部通用 AI 平台</span>
|
||||
<span class="eco-tag">DeepSeek</span>
|
||||
<span class="eco-tag">通义千问</span>
|
||||
<span class="eco-tag">Kimi</span>
|
||||
<span class="eco-tag">豆包</span>
|
||||
<span class="eco-tag">文心一言</span>
|
||||
<span class="eco-tag">GLM</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="eco-group">
|
||||
<div class="eco-label"><span class="eco-dot purple"></span>即时通讯</div>
|
||||
<div class="eco-label"><span class="eco-dot b"></span>即时通讯</div>
|
||||
<div class="eco-tags">
|
||||
<span class="eco-tag tag-blue">企业微信</span>
|
||||
<span class="eco-tag tag-teal">飞书</span>
|
||||
<span class="eco-tag tag-purple">钉钉</span>
|
||||
<span class="eco-tag">企业微信</span>
|
||||
<span class="eco-tag">飞书</span>
|
||||
<span class="eco-tag">钉钉</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="eco-group">
|
||||
<div class="eco-label"><span class="eco-dot amber"></span>代码与仓库</div>
|
||||
<div class="eco-label"><span class="eco-dot g"></span>代码与仓库</div>
|
||||
<div class="eco-tags">
|
||||
<span class="eco-tag tag-blue">Forgejo</span>
|
||||
<span class="eco-tag tag-teal">Gitee</span>
|
||||
<span class="eco-tag tag-purple">GitHub</span>
|
||||
<span class="eco-tag tag-amber">Gongfeng</span>
|
||||
<span class="eco-tag">Forgejo</span>
|
||||
<span class="eco-tag">Gitee</span>
|
||||
<span class="eco-tag">GitHub</span>
|
||||
<span class="eco-tag">Gongfeng</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="eco-group">
|
||||
<div class="eco-label"><span class="eco-dot rose"></span>文档与知识</div>
|
||||
<div class="eco-label"><span class="eco-dot c"></span>文档与知识</div>
|
||||
<div class="eco-tags">
|
||||
<span class="eco-tag tag-blue">Notion</span>
|
||||
<span class="eco-tag tag-teal">腾讯文档</span>
|
||||
<span class="eco-tag tag-purple">金山文档</span>
|
||||
<span class="eco-tag tag-amber">iWiki</span>
|
||||
<span class="eco-tag tag-rose">乐享知识库</span>
|
||||
<span class="eco-tag">Notion</span>
|
||||
<span class="eco-tag">腾讯文档</span>
|
||||
<span class="eco-tag">金山文档</span>
|
||||
<span class="eco-tag">iWiki</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="eco-group">
|
||||
<div class="eco-label"><span class="eco-dot green"></span>数据与商业</div>
|
||||
<div class="eco-label"><span class="eco-dot b"></span>数据与商业</div>
|
||||
<div class="eco-tags">
|
||||
<span class="eco-tag tag-blue">天眼查</span>
|
||||
<span class="eco-tag tag-teal">企查查</span>
|
||||
<span class="eco-tag tag-purple">通达信</span>
|
||||
<span class="eco-tag tag-amber">北大法宝</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="eco-group">
|
||||
<div class="eco-label"><span class="eco-dot blue"></span>开源引擎</div>
|
||||
<div class="eco-tags">
|
||||
<span class="eco-tag tag-blue">Node.js</span>
|
||||
<span class="eco-tag tag-teal">Nginx</span>
|
||||
<span class="eco-tag tag-purple">PostgreSQL</span>
|
||||
<span class="eco-tag tag-amber">Forgejo</span>
|
||||
<span class="eco-tag tag-green">Docker</span>
|
||||
<span class="eco-tag">天眼查</span>
|
||||
<span class="eco-tag">企查查</span>
|
||||
<span class="eco-tag">通达信</span>
|
||||
<span class="eco-tag">北大法宝</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Counter -->
|
||||
<section class="counter-section">
|
||||
<div class="counter-main-small">系统持续运行 · 自 2025 年 4 月 26 日 · 光湖诞生之日起</div>
|
||||
<div class="counter-since" id="counter-detail">至今 427 天 · 10248 小时 · 614880 分钟</div>
|
||||
<section class="counter-bottom">
|
||||
<div class="counter-info" id="counter-info">系统持续运行 · 自 2025 年 4 月 26 日</div>
|
||||
</section>
|
||||
|
||||
<!-- Status -->
|
||||
<section class="status-section">
|
||||
<div class="status-coming">即将发布 · 敬请期待</div>
|
||||
<div class="status-badge">系统架构正在加速研发中</div>
|
||||
<div class="status-c">即将发布 · 敬请期待</div>
|
||||
<div class="status-b">系统架构正在加速研发中 · 光湖语言团队</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
@ -541,7 +458,7 @@ body{
|
||||
<p class="footer-team">本操作系统由 <strong>光湖语言团队</strong> 研发维护</p>
|
||||
<p class="footer-info">
|
||||
<a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">陕ICP备2026010954号</a>
|
||||
<span style="margin:0 14px;color:#cbd5e1">|</span>
|
||||
<span style="margin:0 14px;color:rgba(100,130,170,0.3)">|</span>
|
||||
国作登字-2026-A-00037559
|
||||
</p>
|
||||
<div class="footer-divider"></div>
|
||||
@ -550,20 +467,23 @@ body{
|
||||
|
||||
<script>
|
||||
(function(){
|
||||
var S=document.getElementById('stars');
|
||||
for(var i=0;i<70;i++){
|
||||
var e=document.createElement('div');e.className='star';
|
||||
e.style.left=Math.random()*100+'%';e.style.top=Math.random()*100+'%';
|
||||
e.style.width=e.style.height=(Math.random()*2+.5)+'px';
|
||||
e.style.animationDuration=(Math.random()*4+2)+'s';e.style.animationDelay=(Math.random()*5)+'s';
|
||||
S.appendChild(e);
|
||||
}
|
||||
var B=new Date(2025,3,26).getTime();
|
||||
function u(){
|
||||
var e=Date.now()-B;
|
||||
var d=Math.floor(e/864e5),h=Math.floor(e/36e5),m=Math.floor(e/6e4);
|
||||
var de=document.getElementById('days'),ce=document.getElementById('counter-detail');
|
||||
var e=Date.now()-B,d=Math.floor(e/864e5),h=Math.floor(e/36e5),m=Math.floor(e/6e4);
|
||||
var de=document.getElementById('days'),ce=document.getElementById('counter-info');
|
||||
if(de)de.textContent=d.toLocaleString();
|
||||
if(ce)ce.textContent='至今 '+d.toLocaleString()+' 天 · '+h.toLocaleString()+' 小时 · '+m.toLocaleString()+' 分钟';
|
||||
if(ce)ce.textContent='系统持续运行 · 自 2025 年 4 月 26 日 · '+d.toLocaleString()+' 天 · '+h.toLocaleString()+' 小时 · '+m.toLocaleString()+' 分钟';
|
||||
}
|
||||
u();setInterval(u,6e4);
|
||||
(function s(){
|
||||
var n=new Date();
|
||||
var mid=new Date(n.getFullYear(),n.getMonth(),n.getDate()+1);
|
||||
setTimeout(function(){u();s();},mid-n+1e3);
|
||||
})();
|
||||
(function s(){var n=new Date();var mid=new Date(n.getFullYear(),n.getMonth(),n.getDate()+1);setTimeout(function(){u();s();},mid-n+1e3);})();
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user