feat: dark/light mode toggle + CSS variables everywhere + i18n config (EN/ES/PT)
This commit is contained in:
artale
parent
1aac97759f
commit
c89f3b0c15
|
|
@ -18,7 +18,7 @@ export default defineConfig({
|
|||
['link', { href: 'https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0,0', rel: 'stylesheet' }],
|
||||
],
|
||||
|
||||
appearance: 'dark',
|
||||
appearance: true,
|
||||
|
||||
themeConfig: {
|
||||
logo: false,
|
||||
|
|
@ -161,5 +161,29 @@ export default defineConfig({
|
|||
search: {
|
||||
provider: 'local',
|
||||
},
|
||||
|
||||
// i18n / multi-language
|
||||
locales: {
|
||||
root: {
|
||||
label: 'English',
|
||||
lang: 'en-US',
|
||||
title: 'FDSA',
|
||||
description: 'Agentic Engineering Course — build, deploy, and maintain production-grade AI agent systems.',
|
||||
},
|
||||
es: {
|
||||
label: 'Español',
|
||||
lang: 'es-ES',
|
||||
title: 'FDSA',
|
||||
description: 'Curso de Ingeniería de Agentes — construye, despliega y mantiene sistemas de IA agentivos en producción.',
|
||||
link: '/es/',
|
||||
},
|
||||
pt: {
|
||||
label: 'Português',
|
||||
lang: 'pt-BR',
|
||||
title: 'FDSA',
|
||||
description: 'Curso de Engenharia de Agentes — construa, implante e mantenha sistemas de IA agentivos em produção.',
|
||||
link: '/pt/',
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1 +1 @@
|
|||
import{R as p}from"./chunks/theme.BQD37h-V.js";import{v as s,am as i,R as u,w as c,p as l,a as f,C as d,a1 as m,k as h,S as g,l as A,r as v,ac as w,N as C,as as R,ag as y,ab as P,aa as b,u as S}from"./chunks/framework.BPKcPtvA.js";function r(e){if(e.extends){const a=r(e.extends);return{...a,...e,async enhanceApp(t){a.enhanceApp&&await a.enhanceApp(t),e.enhanceApp&&await e.enhanceApp(t)}}}return e}const n=r(p),E=v({name:"VitePressApp",setup(){const{site:e,lang:a,dir:t}=w();return C(()=>{R(()=>{document.documentElement.lang=a.value,document.documentElement.dir=t.value})}),e.value.router.prefetchLinks&&y(),P(),b(),n.setup&&n.setup(),()=>S(n.Layout)}});async function T(){globalThis.__VITEPRESS__=!0;const e=_(),a=D();a.provide(u,e);const t=c(e.route);return a.provide(l,t),a.component("Content",f),a.component("ClientOnly",d),Object.defineProperties(a.config.globalProperties,{$frontmatter:{get(){return t.frontmatter.value}},$params:{get(){return t.page.value.params}}}),n.enhanceApp&&await n.enhanceApp({app:a,router:e,siteData:m}),{app:a,router:e,data:t}}function D(){return A(E)}function _(){let e=s;return h(a=>{let t=g(a),o=null;return t&&(e&&(t=t.replace(/\.js$/,".lean.js")),o=import(t)),s&&(e=!1),o},n.NotFound)}s&&T().then(({app:e,router:a,data:t})=>{a.go().then(()=>{i(a.route,t.site),e.mount("#app")})});export{T as createApp};
|
||||
import{R as p}from"./chunks/theme.1zhrRA1D.js";import{v as s,am as i,R as u,w as c,p as l,a as f,C as d,a1 as m,k as h,S as g,l as A,r as v,ac as w,N as C,as as R,ag as y,ab as P,aa as b,u as S}from"./chunks/framework.BPKcPtvA.js";function r(e){if(e.extends){const a=r(e.extends);return{...a,...e,async enhanceApp(t){a.enhanceApp&&await a.enhanceApp(t),e.enhanceApp&&await e.enhanceApp(t)}}}return e}const n=r(p),E=v({name:"VitePressApp",setup(){const{site:e,lang:a,dir:t}=w();return C(()=>{R(()=>{document.documentElement.lang=a.value,document.documentElement.dir=t.value})}),e.value.router.prefetchLinks&&y(),P(),b(),n.setup&&n.setup(),()=>S(n.Layout)}});async function T(){globalThis.__VITEPRESS__=!0;const e=_(),a=D();a.provide(u,e);const t=c(e.route);return a.provide(l,t),a.component("Content",f),a.component("ClientOnly",d),Object.defineProperties(a.config.globalProperties,{$frontmatter:{get(){return t.frontmatter.value}},$params:{get(){return t.page.value.params}}}),n.enhanceApp&&await n.enhanceApp({app:a,router:e,siteData:m}),{app:a,router:e,data:t}}function D(){return A(E)}function _(){let e=s;return h(a=>{let t=g(a),o=null;return t&&(e&&(t=t.replace(/\.js$/,".lean.js")),o=import(t)),s&&(e=!1),o},n.NotFound)}s&&T().then(({app:e,router:a,data:t})=>{a.go().then(()=>{i(a.route,t.site),e.mount("#app")})});export{T as createApp};
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -270,67 +270,67 @@ onMounted(() => {
|
|||
|
||||
.landing {
|
||||
font-family: 'DM Sans', -apple-system, sans-serif;
|
||||
background: #0a0a0a; color: #e8e8e8;
|
||||
background: var(--vp-c-bg); color: var(--vp-c-text-1);
|
||||
-webkit-font-smoothing: antialiased; min-height: 100vh;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* Nav */
|
||||
.nav{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(10,10,10,0.85);backdrop-filter:blur(16px);border-bottom:1px solid #1a1a1a}
|
||||
.nav{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(0,0,0,0.85);backdrop-filter:blur(16px);border-bottom:1px solid var(--vp-c-divider)}
|
||||
.nav-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 24px}
|
||||
.logo-wrap{display:flex;align-items:center;gap:8px}
|
||||
.logo-text{font-weight:800;font-size:20px;letter-spacing:-0.5px;color:#e8e8e8}
|
||||
.logo-text{font-weight:800;font-size:20px;letter-spacing:-0.5px;color:var(--vp-c-text-1)}
|
||||
.nav-links{display:flex;gap:28px;align-items:center}
|
||||
.nav-links a{color:#888;text-decoration:none;font-size:14px;font-weight:500;transition:color .2s}
|
||||
.nav-links a:hover{color:#e8e8e8}
|
||||
.nav-cta{background:#d95c41;color:#fff!important;padding:8px 20px;border-radius:6px;font-weight:600}
|
||||
.nav-cta:hover{background:#c44a30!important}
|
||||
.nav-links a{color:var(--vp-c-text-2);text-decoration:none;font-size:14px;font-weight:500;transition:color .2s}
|
||||
.nav-links a:hover{color:var(--vp-c-text-1)}
|
||||
.nav-cta{background:var(--vp-c-brand-1);color:#fff!important;padding:8px 20px;border-radius:6px;font-weight:600}
|
||||
.nav-cta:hover{background:var(--vp-c-brand-3)!important}
|
||||
|
||||
/* Hero */
|
||||
.hero-sec{min-height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:140px 24px 60px;text-align:center;position:relative;overflow:hidden}
|
||||
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(217,92,65,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(217,92,65,0.04) 1px,transparent 1px);background-size:40px 40px;pointer-events:none}
|
||||
.hero-glow{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(217,92,65,0.08) 0%,transparent 60%);pointer-events:none}
|
||||
.hero-inner{position:relative;z-index:1;max-width:680px;width:100%;margin:0 auto}
|
||||
.hero-pill{display:inline-flex;align-items:center;gap:8px;background:rgba(217,92,65,0.1);border:1px solid rgba(217,92,65,0.3);padding:6px 16px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#d95c41;margin-bottom:24px}
|
||||
.pill-dot{width:6px;height:6px;border-radius:50%;background:#d95c41;animation:pulse 2s ease-in-out infinite}
|
||||
.hero-pill{display:inline-flex;align-items:center;gap:8px;background:rgba(217,92,65,0.1);border:1px solid rgba(217,92,65,0.3);padding:6px 16px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--vp-c-brand-1);margin-bottom:24px}
|
||||
.pill-dot{width:6px;height:6px;border-radius:50%;background:var(--vp-c-brand-1);animation:pulse 2s ease-in-out infinite}
|
||||
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.3}}
|
||||
.hero-sec h1{font-size:56px;font-weight:800;letter-spacing:-1.5px;line-height:1.05;color:#f0f0f0;margin-bottom:20px}
|
||||
.hlt{background:linear-gradient(135deg,#d95c41,#e87d2f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||
.hero-sub{font-size:18px;color:#888;line-height:1.6;margin-bottom:36px;max-width:560px;margin-left:auto;margin-right:auto}
|
||||
.hero-sec h1{font-size:56px;font-weight:800;letter-spacing:-1.5px;line-height:1.05;color:var(--vp-c-text-1);margin-bottom:20px}
|
||||
.hlt{background:linear-gradient(135deg,var(--vp-c-brand-1),var(--vp-c-brand-2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||
.hero-sub{font-size:18px;color:var(--vp-c-text-2);line-height:1.6;margin-bottom:36px;max-width:560px;margin-left:auto;margin-right:auto}
|
||||
.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
|
||||
.btn-p{display:inline-block;padding:14px 32px;border-radius:8px;font-weight:600;font-size:15px;text-decoration:none;transition:all .2s;cursor:pointer}
|
||||
.btn-primary{background:#d95c41;color:#fff}
|
||||
.btn-primary:hover{background:#c44a30;transform:translateY(-1px)}
|
||||
.btn-ghost{color:#e8e8e8;border:1px solid #222}
|
||||
.btn-ghost:hover{border-color:#555}
|
||||
.btn-primary{background:var(--vp-c-brand-1);color:#fff}
|
||||
.btn-primary:hover{background:var(--vp-c-brand-3);transform:translateY(-1px)}
|
||||
.btn-ghost{color:var(--vp-c-text-1);border:1px solid var(--vp-c-border)}
|
||||
.btn-ghost:hover{border-color:var(--vp-c-text-2)}
|
||||
|
||||
/* Terminal */
|
||||
.term-widget{margin-top:48px;max-width:560px;width:100%;background:rgba(17,17,17,0.9);backdrop-filter:blur(12px);border:1px solid #222;border-radius:12px;padding:20px;text-align:left;position:relative;overflow:hidden}
|
||||
.term-widget::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#d95c41,transparent);opacity:.5}
|
||||
.term-widget{margin-top:48px;max-width:560px;width:100%;background:var(--vp-c-bg-soft);backdrop-filter:blur(12px);border:1px solid var(--vp-c-border);border-radius:12px;padding:20px;text-align:left;position:relative;overflow:hidden}
|
||||
.term-widget::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--vp-c-brand-1),transparent);opacity:.5}
|
||||
.term-dots{display:flex;gap:8px;margin-bottom:16px}
|
||||
.td{width:10px;height:10px;border-radius:50%}
|
||||
.td.r{background:#ef4444}.td.y{background:#eab308}.td.g{background:#22c55e}
|
||||
.term-l{font-family:'DM Mono',monospace;font-size:12px;color:#888;line-height:2}
|
||||
.term-l.c{color:#d95c41}.term-l.a{color:#7bd0ff}.term-l.g{color:#22c55e}
|
||||
.term-bar{margin-top:12px;height:4px;background:#1a1a1a;border-radius:2px;overflow:hidden}
|
||||
.term-fill{height:100%;width:72%;background:linear-gradient(90deg,#d95c41,#e87d2f);border-radius:2px;animation:prog 3s ease-in-out infinite}
|
||||
.term-l{font-family:'DM Mono',monospace;font-size:12px;color:var(--vp-c-text-2);line-height:2}
|
||||
.term-l.c{color:var(--vp-c-brand-1)}.term-l.a{color:#7bd0ff}.term-l.g{color:#22c55e}
|
||||
.term-bar{margin-top:12px;height:4px;background:var(--vp-c-divider);border-radius:2px;overflow:hidden}
|
||||
.term-fill{height:100%;width:72%;background:linear-gradient(90deg,var(--vp-c-brand-1),var(--vp-c-brand-2));border-radius:2px;animation:prog 3s ease-in-out infinite}
|
||||
@keyframes prog{0%{width:20%;opacity:.6}50%{width:75%;opacity:1}100%{width:20%;opacity:.6}}
|
||||
|
||||
/* Stats */
|
||||
.stats-sec{padding:0 24px 60px}
|
||||
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);max-width:800px;margin:0 auto;gap:24px}
|
||||
.stat{text-align:center;background:rgba(17,17,17,0.6);border:1px solid rgba(255,255,255,0.04);border-radius:12px;padding:24px 16px;transition:all .4s}
|
||||
.stat{text-align:center;background:var(--vp-c-bg-soft);border:1px solid rgba(128,128,128,0.08);border-radius:12px;padding:24px 16px;transition:all .4s}
|
||||
.stat:hover{border-color:rgba(217,92,65,0.2)}
|
||||
.stat-n{display:block;font-size:36px;font-weight:800;color:#d95c41;line-height:1;margin-bottom:4px}
|
||||
.stat-l{display:block;font-size:13px;color:#666;font-weight:500}
|
||||
.stat-n{display:block;font-size:36px;font-weight:800;color:var(--vp-c-brand-1);line-height:1;margin-bottom:4px}
|
||||
.stat-l{display:block;font-size:13px;color:var(--vp-c-text-3);font-weight:500}
|
||||
|
||||
/* Section */
|
||||
.sec{max-width:1280px;margin:0 auto;padding:80px 24px}
|
||||
.sec-label{font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#d95c41;text-align:center;margin-bottom:16px}
|
||||
.sec-title{text-align:center;font-size:32px;font-weight:700;margin-bottom:48px;color:#f0f0f0}
|
||||
.sec-label{font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--vp-c-brand-1);text-align:center;margin-bottom:16px}
|
||||
.sec-title{text-align:center;font-size:32px;font-weight:700;margin-bottom:48px;color:var(--vp-c-text-1)}
|
||||
|
||||
/* Glass card */
|
||||
.gc{background:rgba(17,17,17,0.85);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.06);border-top:1px solid rgba(255,255,255,0.1);border-radius:12px;padding:28px 24px;transition:all .4s}
|
||||
.gc{background:var(--vp-c-bg-soft);backdrop-filter:blur(12px);border:1px solid rgba(128,128,128,0.08);border-top:1px solid rgba(128,128,128,0.12);border-radius:12px;padding:28px 24px;transition:all .4s}
|
||||
.gc:hover{border-color:rgba(217,92,65,0.3);transform:translateY(-2px)}
|
||||
|
||||
/* Scroll reveal animation */
|
||||
|
|
@ -340,88 +340,88 @@ onMounted(() => {
|
|||
.bi.reveal.revealed,.feat-grid .gc.reveal.revealed,.price-card.reveal.revealed,.test-card.reveal.revealed,.stat.reveal.revealed{opacity:1;transform:translateY(0)}
|
||||
|
||||
/* Feature grid */
|
||||
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,0.03);border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,0.06)}
|
||||
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(128,128,128,0.06);border-radius:12px;overflow:hidden;border:1px solid rgba(128,128,128,0.08)}
|
||||
.feat-grid .gc{border:none;border-radius:0}
|
||||
.gci{width:48px;height:48px;border-radius:10px;background:rgba(217,92,65,0.12);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
|
||||
.gci .material-symbols-outlined{color:#d95c41;font-size:24px}
|
||||
.gc-t{font-size:15px;font-weight:700;color:#f0f0f0;margin-bottom:8px}
|
||||
.gc-d{font-size:13px;color:#888;line-height:1.6}
|
||||
.gci .material-symbols-outlined{color:var(--vp-c-brand-1);font-size:24px}
|
||||
.gc-t{font-size:15px;font-weight:700;color:var(--vp-c-text-1);margin-bottom:8px}
|
||||
.gc-d{font-size:13px;color:var(--vp-c-text-2);line-height:1.6}
|
||||
|
||||
/* Bento */
|
||||
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
|
||||
.bi{background:rgba(17,17,17,0.85);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.06);border-top:1px solid rgba(255,255,255,0.1);border-radius:12px;padding:24px;position:relative;overflow:hidden;transition:all .3s}
|
||||
.bi{background:var(--vp-c-bg-soft);backdrop-filter:blur(12px);border:1px solid rgba(128,128,128,0.08);border-top:1px solid rgba(128,128,128,0.12);border-radius:12px;padding:24px;position:relative;overflow:hidden;transition:all .3s}
|
||||
.bi:hover{border-color:rgba(217,92,65,0.3);transform:translateY(-1px)}
|
||||
.bi.hl{border-color:rgba(217,92,65,0.2);background:rgba(217,92,65,0.04)}
|
||||
.w4{grid-column:span 4}.w6{grid-column:span 6}.w8{grid-column:span 8}.w12{grid-column:span 12}
|
||||
.bi-n{position:absolute;top:12px;right:16px;font-size:40px;font-weight:800;opacity:0.06;color:#fff;user-select:none}
|
||||
.bi-n{position:absolute;top:12px;right:16px;font-size:40px;font-weight:800;opacity:0.06;color:#000;user-select:none}
|
||||
.bi-ic{width:36px;height:36px;border-radius:8px;background:rgba(217,92,65,0.12);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
|
||||
.bi-ic .material-symbols-outlined{color:#d95c41;font-size:20px}
|
||||
.bi-t{font-size:15px;font-weight:700;color:#f0f0f0;margin-bottom:6px}
|
||||
.bi-d{font-size:13px;color:#888;line-height:1.5;margin-bottom:12px}
|
||||
.bi-ic .material-symbols-outlined{color:var(--vp-c-brand-1);font-size:20px}
|
||||
.bi-t{font-size:15px;font-weight:700;color:var(--vp-c-text-1);margin-bottom:6px}
|
||||
.bi-d{font-size:13px;color:var(--vp-c-text-2);line-height:1.5;margin-bottom:12px}
|
||||
.bi-tags{display:flex;flex-wrap:wrap;gap:6px}
|
||||
.bi-tags span{font-size:10px;font-weight:600;letter-spacing:.05em;padding:3px 8px;border-radius:4px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.06);color:#666}
|
||||
.bi-tags span{font-size:10px;font-weight:600;letter-spacing:.05em;padding:3px 8px;border-radius:4px;background:rgba(128,128,128,0.08);border:1px solid rgba(128,128,128,0.1);color:var(--vp-c-text-3)}
|
||||
|
||||
/* Testimonials */
|
||||
.test-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
|
||||
.test-card{background:rgba(17,17,17,0.85);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.06);border-radius:12px;padding:24px;display:flex;flex-direction:column;justify-content:space-between}
|
||||
.test-q{font-size:14px;line-height:1.6;color:#c0c0c0;font-style:italic;margin-bottom:20px}
|
||||
.test-a{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid rgba(255,255,255,0.04)}
|
||||
.test-av{width:36px;height:36px;border-radius:50%;background:rgba(217,92,65,0.2);color:#d95c41;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
|
||||
.test-n{font-size:13px;font-weight:600;color:#e8e8e8}
|
||||
.test-r{font-size:11px;color:#666}
|
||||
.test-card{background:var(--vp-c-bg-soft);backdrop-filter:blur(12px);border:1px solid rgba(128,128,128,0.08);border-radius:12px;padding:24px;display:flex;flex-direction:column;justify-content:space-between}
|
||||
.test-q{font-size:14px;line-height:1.6;color:var(--vp-c-text-2);font-style:italic;margin-bottom:20px}
|
||||
.test-a{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid rgba(128,128,128,0.08)}
|
||||
.test-av{width:36px;height:36px;border-radius:50%;background:rgba(217,92,65,0.2);color:var(--vp-c-brand-1);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
|
||||
.test-n{font-size:13px;font-weight:600;color:var(--vp-c-text-1)}
|
||||
.test-r{font-size:11px;color:var(--vp-c-text-3)}
|
||||
|
||||
/* Comparisons */
|
||||
.compare-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
|
||||
.compare-c{background:rgba(17,17,17,0.85);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.06);border-radius:12px;padding:24px}
|
||||
.compare-name{font-size:16px;font-weight:700;color:#f0f0f0;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,0.06)}
|
||||
.compare-c{background:var(--vp-c-bg-soft);backdrop-filter:blur(12px);border:1px solid rgba(128,128,128,0.08);border-radius:12px;padding:24px}
|
||||
.compare-name{font-size:16px;font-weight:700;color:var(--vp-c-text-1);margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(128,128,128,0.08)}
|
||||
.compare-pros,.compare-cons{list-style:none;margin:0;padding:0;font-size:12px;line-height:1.6}
|
||||
.compare-pros{color:#22c55e;margin-bottom:12px}
|
||||
.compare-pros li,.compare-cons li{display:flex;align-items:flex-start;gap:6px;padding:4px 0}
|
||||
.compare-pros .material-symbols-outlined,.compare-cons .material-symbols-outlined{font-size:14px;margin-top:2px}
|
||||
.compare-pros .material-symbols-outlined{color:#22c55e}
|
||||
.compare-cons .material-symbols-outlined{color:#ef4444}
|
||||
.compare-cons{color:#888}
|
||||
.compare-cons{color:var(--vp-c-text-2)}
|
||||
|
||||
/* Pricing */
|
||||
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:960px;margin:0 auto}
|
||||
.price-card{background:rgba(17,17,17,0.85);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.06);border-radius:12px;padding:32px 24px;text-align:center;transition:all .3s;display:flex;flex-direction:column}
|
||||
.price-card{background:var(--vp-c-bg-soft);backdrop-filter:blur(12px);border:1px solid rgba(128,128,128,0.08);border-radius:12px;padding:32px 24px;text-align:center;transition:all .3s;display:flex;flex-direction:column}
|
||||
.price-card:hover{border-color:rgba(217,92,65,0.2)}
|
||||
.price-card.highlight{border-color:rgba(217,92,65,0.3);background:rgba(217,92,65,0.04);position:relative}
|
||||
.price-card.highlight::before{content:'Most Popular';position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#d95c41;color:#fff;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 16px;border-radius:999px}
|
||||
.price-name{font-size:14px;font-weight:600;color:#888;margin-bottom:8px;text-transform:uppercase;letter-spacing:.1em}
|
||||
.price-amt{font-size:48px;font-weight:800;color:#d95c41;line-height:1;margin-bottom:4px}
|
||||
.price-card.highlight::before{content:'Most Popular';position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--vp-c-brand-1);color:#fff;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 16px;border-radius:999px}
|
||||
.price-name{font-size:14px;font-weight:600;color:var(--vp-c-text-2);margin-bottom:8px;text-transform:uppercase;letter-spacing:.1em}
|
||||
.price-amt{font-size:48px;font-weight:800;color:var(--vp-c-brand-1);line-height:1;margin-bottom:4px}
|
||||
.price-dol{font-size:24px;vertical-align:super}
|
||||
.price-note{font-size:12px;color:#555;margin-bottom:24px}
|
||||
.price-note{font-size:12px;color:var(--vp-c-text-3);margin-bottom:24px}
|
||||
.price-feats{list-style:none;text-align:left;margin-bottom:28px;flex:1}
|
||||
.price-feats li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,0.04);font-size:13px;color:#888}
|
||||
.price-feats li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid rgba(128,128,128,0.08);font-size:13px;color:var(--vp-c-text-2)}
|
||||
.price-feats li:last-child{border-bottom:none}
|
||||
.price-feats .material-symbols-outlined{font-size:18px;color:#d95c41;flex-shrink:0}
|
||||
.price-feats .material-symbols-outlined{font-size:18px;color:var(--vp-c-brand-1);flex-shrink:0}
|
||||
.price-card .btn-p{width:100%;text-align:center}
|
||||
|
||||
/* FAQ */
|
||||
.faq-list{max-width:640px;margin:0 auto}
|
||||
.faq-item{border-bottom:1px solid rgba(255,255,255,0.04);cursor:pointer;padding:0}
|
||||
.faq-q{display:flex;align-items:center;justify-content:space-between;padding:20px 0;font-size:15px;color:#d0d0d0;font-weight:500}
|
||||
.faq-icon{font-size:20px;color:#555;transition:transform .2s}
|
||||
.faq-item{border-bottom:1px solid rgba(128,128,128,0.08);cursor:pointer;padding:0}
|
||||
.faq-q{display:flex;align-items:center;justify-content:space-between;padding:20px 0;font-size:15px;color:var(--vp-c-text-1);font-weight:500}
|
||||
.faq-icon{font-size:20px;color:var(--vp-c-text-3);transition:transform .2s}
|
||||
.faq-icon.open{transform:rotate(180deg)}
|
||||
.faq-a{padding:0 0 20px;font-size:14px;line-height:1.7;color:#888}
|
||||
.faq-a{padding:0 0 20px;font-size:14px;line-height:1.7;color:var(--vp-c-text-2)}
|
||||
|
||||
/* Footer */
|
||||
.ft{padding:48px 24px 80px;border-top:1px solid #1a1a1a}
|
||||
.ft{padding:48px 24px 80px;border-top:1px solid var(--vp-c-divider)}
|
||||
.ft-inner{max-width:1280px;margin:0 auto}
|
||||
.ft-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:32px}
|
||||
.ft-l{font-size:20px;font-weight:800;color:#f0f0f0;margin-bottom:8px}
|
||||
.ft-desc{font-size:13px;color:#555;line-height:1.6;max-width:240px}
|
||||
.ft-h{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#888;margin-bottom:16px}
|
||||
.ft-l{font-size:20px;font-weight:800;color:var(--vp-c-text-1);margin-bottom:8px}
|
||||
.ft-desc{font-size:13px;color:var(--vp-c-text-3);line-height:1.6;max-width:240px}
|
||||
.ft-h{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--vp-c-text-2);margin-bottom:16px}
|
||||
.ft-col{display:flex;flex-direction:column;gap:10px}
|
||||
.ft-col a{color:#555;text-decoration:none;font-size:13px;transition:color .2s}
|
||||
.ft-col a:hover{color:#888}
|
||||
.ft-c{text-align:center;font-size:12px;color:#444;padding-top:24px;border-top:1px solid #1a1a1a}
|
||||
.ft-col a{color:var(--vp-c-text-3);text-decoration:none;font-size:13px;transition:color .2s}
|
||||
.ft-col a:hover{color:var(--vp-c-text-2)}
|
||||
.ft-c{text-align:center;font-size:12px;color:var(--vp-c-text-3);padding-top:24px;border-top:1px solid var(--vp-c-divider)}
|
||||
|
||||
/* Bottom nav */
|
||||
.bn{display:none;position:fixed;bottom:0;left:0;right:0;z-index:50;background:rgba(10,10,10,0.92);backdrop-filter:blur(16px);border-top:1px solid #1a1a1a;height:64px;padding:4px 16px 12px;justify-content:space-around;align-items:center}
|
||||
.bn-i{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:#555;font-size:10px;font-weight:600;transition:color .2s}
|
||||
.bn-i.active{color:#d95c41}.bn-i:hover{color:#888}
|
||||
.bn{display:none;position:fixed;bottom:0;left:0;right:0;z-index:50;background:rgba(0,0,0,0.92);backdrop-filter:blur(16px);border-top:1px solid var(--vp-c-divider);height:64px;padding:4px 16px 12px;justify-content:space-around;align-items:center}
|
||||
.bn-i{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:var(--vp-c-text-3);font-size:10px;font-weight:600;transition:color .2s}
|
||||
.bn-i.active{color:var(--vp-c-brand-1)}.bn-i:hover{color:var(--vp-c-text-2)}
|
||||
.bn-i .material-symbols-outlined{font-size:22px}
|
||||
|
||||
@media (max-width:768px){
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ const { Layout } = DefaultTheme
|
|||
<style>
|
||||
/* FDSA premium wrapper for all content pages */
|
||||
.fdsa-app {
|
||||
background: #0a0a0a;
|
||||
background: var(--vp-c-bg);
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
|
|
@ -39,18 +39,18 @@ const { Layout } = DefaultTheme
|
|||
|
||||
/* Glass card around main content */
|
||||
.VPDoc:not(.VPDoc--blank) > .container > .content {
|
||||
background: rgba(17,17,17,0.6) !important;
|
||||
background: var(--vp-c-bg-soft) !important;
|
||||
backdrop-filter: blur(12px) !important;
|
||||
border: 1px solid rgba(255,255,255,0.04) !important;
|
||||
border-top: 1px solid rgba(255,255,255,0.08) !important;
|
||||
border: 1px solid rgba(128,128,128,0.08) !important;
|
||||
border-top: 1px solid rgba(128,128,128,0.12) !important;
|
||||
border-radius: 12px !important;
|
||||
}
|
||||
|
||||
/* Nav: match landing page */
|
||||
.VPNav {
|
||||
background: rgba(10,10,10,0.85) !important;
|
||||
background: rgba(0,0,0,0.85) !important;
|
||||
backdrop-filter: blur(16px) !important;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.06) !important;
|
||||
border-bottom: 1px solid var(--vp-c-border) !important;
|
||||
}
|
||||
|
||||
/* FDSA brand in nav */
|
||||
|
|
@ -62,39 +62,39 @@ const { Layout } = DefaultTheme
|
|||
font-size: 20px !important;
|
||||
font-weight: 800 !important;
|
||||
letter-spacing: -0.5px !important;
|
||||
color: #e8e8e8 !important;
|
||||
color: var(--vp-c-text-1) !important;
|
||||
}
|
||||
.VPNavBarTitle .title::before {
|
||||
content: 'terminal';
|
||||
font-family: 'Material Symbols Outlined';
|
||||
font-size: 22px;
|
||||
color: #d95c41;
|
||||
color: var(--vp-c-brand-1);
|
||||
}
|
||||
.VPNavBarTitle .logo {
|
||||
display: none !important;
|
||||
}
|
||||
.VPNavBarMenuLink:hover, .VPNavBarMenuLink.active {
|
||||
color: #d95c41 !important;
|
||||
color: var(--vp-c-brand-1) !important;
|
||||
}
|
||||
|
||||
/* Sidebar: FDSA styling */
|
||||
.VPSidebar {
|
||||
background: transparent !important;
|
||||
border-right: 1px solid rgba(255,255,255,0.04) !important;
|
||||
border-right: 1px solid var(--vp-c-border) !important;
|
||||
}
|
||||
.VPSidebar .item .text {
|
||||
font-size: 13px !important;
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
.VPSidebar .item.active .text {
|
||||
color: #d95c41 !important;
|
||||
color: var(--vp-c-brand-1) !important;
|
||||
font-weight: 600 !important;
|
||||
}
|
||||
.VPSidebar .item .text:hover {
|
||||
color: #d95c41 !important;
|
||||
color: var(--vp-c-brand-1) !important;
|
||||
}
|
||||
.VPSidebar .group + .group {
|
||||
border-top: 1px solid rgba(255,255,255,0.04) !important;
|
||||
border-top: 1px solid var(--vp-c-border) !important;
|
||||
}
|
||||
|
||||
/* Content area: padding inside glass card */
|
||||
|
|
@ -111,7 +111,7 @@ const { Layout } = DefaultTheme
|
|||
letter-spacing: -0.5px !important;
|
||||
line-height: 1.1 !important;
|
||||
margin-bottom: 24px !important;
|
||||
color: #f0f0f0 !important;
|
||||
color: var(--vp-c-text-1) !important;
|
||||
}
|
||||
.vp-doc h2 {
|
||||
font-size: 1.375rem !important;
|
||||
|
|
@ -120,34 +120,34 @@ const { Layout } = DefaultTheme
|
|||
padding-top: 32px !important;
|
||||
margin-top: 40px !important;
|
||||
margin-bottom: 16px !important;
|
||||
border-top: 1px solid rgba(255,255,255,0.06) !important;
|
||||
color: #f0f0f0 !important;
|
||||
border-top: 1px solid var(--vp-c-border) !important;
|
||||
color: var(--vp-c-text-1) !important;
|
||||
}
|
||||
.vp-doc h3 {
|
||||
font-size: 1.0625rem !important;
|
||||
font-weight: 600 !important;
|
||||
margin-top: 28px !important;
|
||||
margin-bottom: 12px !important;
|
||||
color: #f0f0f0 !important;
|
||||
color: var(--vp-c-text-1) !important;
|
||||
}
|
||||
.vp-doc p {
|
||||
font-size: 0.9375rem !important;
|
||||
line-height: 1.7 !important;
|
||||
color: #d0d0d0 !important;
|
||||
color: var(--vp-c-text-1) !important;
|
||||
margin-bottom: 16px !important;
|
||||
}
|
||||
.vp-doc a {
|
||||
color: #d95c41 !important;
|
||||
color: var(--vp-c-brand-1) !important;
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
.vp-doc a:hover { color: #e87d2f !important; }
|
||||
.vp-doc a:hover { color: var(--vp-c-brand-2) !important; }
|
||||
|
||||
/* Code blocks */
|
||||
.vp-doc div[class*='language-'] {
|
||||
border-radius: 10px !important;
|
||||
border: 1px solid rgba(255,255,255,0.04) !important;
|
||||
background: rgba(0,0,0,0.4) !important;
|
||||
border: 1px solid var(--vp-c-border) !important;
|
||||
background: rgba(0,0,0,0.3) !important;
|
||||
margin: 24px 0 !important;
|
||||
}
|
||||
.vp-code {
|
||||
|
|
@ -158,85 +158,85 @@ const { Layout } = DefaultTheme
|
|||
.vp-doc code {
|
||||
font-family: 'DM Mono', ui-monospace, monospace !important;
|
||||
font-size: 0.8125rem !important;
|
||||
background: rgba(255,255,255,0.04) !important;
|
||||
border: 1px solid rgba(255,255,255,0.06) !important;
|
||||
background: var(--vp-c-bg-mute) !important;
|
||||
border: 1px solid var(--vp-c-border) !important;
|
||||
padding: 2px 8px !important;
|
||||
border-radius: 6px !important;
|
||||
color: #e8e8e8 !important;
|
||||
color: var(--vp-c-text-1) !important;
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
.vp-doc table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
border: 1px solid rgba(255,255,255,0.06);
|
||||
border: 1px solid var(--vp-c-border);
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
font-size: 0.875rem !important;
|
||||
margin: 24px 0 !important;
|
||||
}
|
||||
.vp-doc th {
|
||||
background: rgba(255,255,255,0.03);
|
||||
background: var(--vp-c-bg-mute);
|
||||
font-weight: 600;
|
||||
font-size: 0.75rem !important;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.06em;
|
||||
color: #888;
|
||||
color: var(--vp-c-text-2);
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.06);
|
||||
border-bottom: 1px solid var(--vp-c-border);
|
||||
}
|
||||
.vp-doc td {
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.03);
|
||||
border-bottom: 1px solid var(--vp-c-divider);
|
||||
font-size: 0.875rem !important;
|
||||
color: #d0d0d0;
|
||||
color: var(--vp-c-text-1);
|
||||
}
|
||||
.vp-doc tr:last-child td { border-bottom: none; }
|
||||
.vp-doc tr:hover td { background: rgba(255,255,255,0.02); }
|
||||
.vp-doc tr:hover td { background: var(--vp-c-bg-soft); }
|
||||
|
||||
/* Blockquotes */
|
||||
.vp-doc blockquote {
|
||||
border-left: 3px solid #d95c41 !important;
|
||||
background: rgba(217,92,65,0.04) !important;
|
||||
border-left: 3px solid var(--vp-c-brand-1) !important;
|
||||
background: var(--vp-c-brand-soft) !important;
|
||||
padding: 16px 24px !important;
|
||||
border-radius: 0 10px 10px 0 !important;
|
||||
margin: 24px 0 !important;
|
||||
}
|
||||
.vp-doc blockquote p {
|
||||
font-size: 0.875rem !important;
|
||||
color: #888 !important;
|
||||
color: var(--vp-c-text-2) !important;
|
||||
font-style: italic !important;
|
||||
}
|
||||
|
||||
/* Dividers */
|
||||
.vp-doc hr {
|
||||
border: none;
|
||||
border-top: 1px solid rgba(255,255,255,0.04);
|
||||
border-top: 1px solid var(--vp-c-divider);
|
||||
margin: 48px 0;
|
||||
}
|
||||
|
||||
/* Custom blocks */
|
||||
.custom-block {
|
||||
border-radius: 10px !important;
|
||||
border: 1px solid rgba(255,255,255,0.04) !important;
|
||||
border: 1px solid var(--vp-c-border) !important;
|
||||
padding: 16px 20px !important;
|
||||
margin: 24px 0 !important;
|
||||
background: rgba(255,255,255,0.02) !important;
|
||||
background: var(--vp-c-bg-soft) !important;
|
||||
}
|
||||
.custom-block.tip {
|
||||
border-color: rgba(217,92,65,0.3) !important;
|
||||
background: rgba(217,92,65,0.04) !important;
|
||||
background: var(--vp-c-brand-soft) !important;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
.VPFooter {
|
||||
border-top: 1px solid rgba(255,255,255,0.04) !important;
|
||||
border-top: 1px solid var(--vp-c-divider) !important;
|
||||
background: transparent !important;
|
||||
padding: 24px 0 !important;
|
||||
}
|
||||
.VPFooter .message {
|
||||
font-size: 13px !important;
|
||||
color: #666 !important;
|
||||
color: var(--vp-c-text-3) !important;
|
||||
}
|
||||
|
||||
/* Mobile responsive */
|
||||
|
|
|
|||
Loading…
Reference in New Issue