Recommended
+Windows
+ZIP
+ Open download โ +diff --git a/website/_site/assets/css/main.css b/website/_site/assets/css/main.css index 6ca4b24..e90f362 100644 --- a/website/_site/assets/css/main.css +++ b/website/_site/assets/css/main.css @@ -1,23 +1,54 @@ :root { - --bg: #0f172a; - --panel: #111827; - --panel2: #1f2937; - --text: #e5e7eb; - --muted: #9ca3af; + --bg: #050816; + --bg2: #0b1224; + --panel: rgba(15, 23, 42, 0.78); + --panel2: rgba(30, 41, 59, 0.72); + --border: rgba(148, 163, 184, 0.22); + --text: #f8fafc; + --muted: #aab6ca; + --soft: #64748b; --accent: #38bdf8; - --accent2: #a78bfa; + --accent2: #a855f7; + --accent3: #22c55e; + --shadow: 0 24px 80px rgba(0, 0, 0, 0.45); } * { box-sizing: border-box; } +html { + scroll-behavior: smooth; +} + body { margin: 0; - background: radial-gradient(circle at top left, #1e293b, var(--bg)); + background: var(--bg); color: var(--text); - font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; - line-height: 1.6; + font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; + line-height: 1.65; +} + +.site-bg { + position: fixed; + inset: 0; + z-index: -1; + background: + radial-gradient(circle at 15% 8%, rgba(168, 85, 247, 0.30), transparent 30%), + radial-gradient(circle at 82% 18%, rgba(56, 189, 248, 0.26), transparent 30%), + radial-gradient(circle at 50% 90%, rgba(34, 197, 94, 0.12), transparent 30%), + linear-gradient(180deg, #050816 0%, #07111f 100%); +} + +.site-bg::after { + content: ""; + position: absolute; + inset: 0; + background-image: + linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px), + linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px); + background-size: 54px 54px; + mask-image: radial-gradient(circle at center, black, transparent 72%); } a { @@ -25,72 +56,245 @@ a { text-decoration: none; } +a:hover { + color: white; +} + .site-header { + position: sticky; + top: 0; + z-index: 10; display: flex; justify-content: space-between; + gap: 24px; align-items: center; - padding: 24px 7vw; + padding: 18px 6vw; + background: rgba(5, 8, 22, 0.76); + backdrop-filter: blur(18px); + border-bottom: 1px solid var(--border); } .brand { - font-weight: 800; - font-size: 1.25rem; + display: flex; + gap: 12px; + align-items: center; color: white; } -nav { +.brand-mark { + display: grid; + place-items: center; + width: 40px; + height: 40px; + border-radius: 14px; + background: linear-gradient(135deg, var(--accent), var(--accent2)); + box-shadow: 0 0 26px rgba(168, 85, 247, 0.45); +} + +.brand strong { + display: block; + font-size: 1.05rem; + letter-spacing: 0.02em; +} + +.brand small { + display: block; + color: var(--muted); + font-size: 0.78rem; + margin-top: -4px; +} + +.site-nav { display: flex; - gap: 18px; + align-items: center; + gap: 16px; flex-wrap: wrap; } -nav a { +.site-nav a { color: var(--muted); + font-size: 0.95rem; } -nav a:hover { +.site-nav a:hover { color: white; } +.nav-cta { + padding: 9px 14px; + border-radius: 999px; + color: white !important; + background: linear-gradient(135deg, var(--accent), var(--accent2)); + box-shadow: 0 0 22px rgba(56, 189, 248, 0.28); +} + .hero { - padding: 90px 7vw 70px; - max-width: 1100px; + padding: 92px 6vw 62px; + max-width: 1180px; +} + +.hero-split { + display: grid; + grid-template-columns: minmax(0, 1fr) minmax(360px, 0.9fr); + gap: 42px; + align-items: center; + max-width: 1500px; } .hero h1 { - font-size: clamp(2.4rem, 6vw, 5rem); - line-height: 1.02; - margin: 0 0 24px; + margin: 0 0 22px; + font-size: clamp(3rem, 8vw, 6.5rem); + line-height: 0.95; + letter-spacing: -0.07em; + background: linear-gradient(90deg, white, var(--accent), var(--accent2)); + -webkit-background-clip: text; + color: transparent; } -.hero p { - font-size: 1.25rem; +.hero .lead, +.hero > p, +.section-heading p, +.cta-panel p { color: var(--muted); - max-width: 760px; + font-size: 1.18rem; + max-width: 850px; +} + +.badge, +.eyebrow { + display: inline-flex; + width: fit-content; + align-items: center; + gap: 8px; + color: #e9d5ff; + background: rgba(168, 85, 247, 0.13); + border: 1px solid rgba(168, 85, 247, 0.34); + padding: 6px 12px; + border-radius: 999px; + text-transform: uppercase; + letter-spacing: 0.08em; + font-size: 0.74rem; + font-weight: 800; } .actions { display: flex; - gap: 16px; - margin-top: 32px; + gap: 14px; + margin-top: 30px; flex-wrap: wrap; } .button { - padding: 13px 20px; - border-radius: 999px; - background: var(--accent); + display: inline-flex; + align-items: center; + justify-content: center; + min-height: 46px; + padding: 12px 18px; + border-radius: 14px; color: #020617; - font-weight: 700; + background: linear-gradient(135deg, var(--accent), var(--accent2)); + font-weight: 800; + box-shadow: 0 16px 44px rgba(56, 189, 248, 0.25); } .button.secondary { - background: var(--panel2); color: white; + background: rgba(30, 41, 59, 0.85); + border: 1px solid var(--border); + box-shadow: none; +} + +.button.ghost { + color: white; + background: transparent; + border: 1px solid var(--border); + box-shadow: none; +} + +.hero-panel, +.card, +.cta-panel { + background: var(--panel); + border: 1px solid var(--border); + border-radius: 26px; + box-shadow: var(--shadow); +} + +.hero-panel { + overflow: hidden; + transform: perspective(1200px) rotateY(-5deg) rotateX(2deg); +} + +.terminal-bar { + display: flex; + gap: 8px; + align-items: center; + padding: 14px 16px; + border-bottom: 1px solid var(--border); + background: rgba(2, 6, 23, 0.74); +} + +.terminal-bar span { + width: 11px; + height: 11px; + border-radius: 50%; + background: var(--accent2); +} + +.terminal-bar span:nth-child(2) { + background: #f59e0b; +} + +.terminal-bar span:nth-child(3) { + background: var(--accent3); +} + +.terminal-bar strong { + margin-left: 8px; + color: var(--muted); + font-size: 0.85rem; +} + +.mock-grid { + display: grid; + gap: 12px; + padding: 18px; +} + +.mini-card { + padding: 14px; + border-radius: 16px; + background: rgba(15, 23, 42, 0.88); + border: 1px solid rgba(148, 163, 184, 0.16); +} + +.mini-card strong, +.mini-card small { + display: block; +} + +.mini-card small { + color: var(--muted); + margin-top: 4px; } .section { - padding: 40px 7vw; + padding: 52px 6vw; +} + +.section.narrow { + max-width: 1040px; +} + +.section-heading { + margin-bottom: 26px; +} + +.section h2 { + font-size: clamp(2rem, 4vw, 3.4rem); + line-height: 1.05; + margin: 12px 0 14px; + letter-spacing: -0.04em; } .grid { @@ -100,21 +304,74 @@ nav a:hover { } .card { - background: rgba(17, 24, 39, 0.82); - border: 1px solid rgba(148, 163, 184, 0.18); - border-radius: 22px; padding: 24px; + transition: transform 180ms ease, border-color 180ms ease, background 180ms ease; } -.card h3 { +.card:hover { + transform: translateY(-4px); + border-color: rgba(56, 189, 248, 0.45); + background: rgba(15, 23, 42, 0.92); +} + +.card h3, +.card h2 { margin-top: 0; } -.site-footer { - padding: 40px 7vw; +.card p { color: var(--muted); } +.feature-icon { + font-size: 2rem; + margin-bottom: 14px; +} + +.feature-icon.large { + font-size: 4rem; +} + +.content-card { + max-width: 980px; +} + +.tag-list { + display: flex; + gap: 10px; + flex-wrap: wrap; +} + +.tag-list span { + padding: 7px 11px; + border-radius: 999px; + color: var(--muted); + background: rgba(15, 23, 42, 0.85); + border: 1px solid var(--border); +} + +.download-card { + min-height: 220px; +} + +.screenshot-placeholder { + display: grid; + place-items: center; + min-height: 180px; + margin-bottom: 16px; + border-radius: 18px; + background: + linear-gradient(135deg, rgba(56, 189, 248, 0.20), rgba(168, 85, 247, 0.20)), + rgba(2, 6, 23, 0.7); + border: 1px solid var(--border); + color: white; + font-weight: 800; +} + +.cta-panel { + padding: clamp(28px, 5vw, 60px); +} + .manual-content { max-width: 980px; } @@ -149,19 +406,23 @@ nav a:hover { text-align: left; } -.eyebrow { - color: var(--accent2); - text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 0.78rem; - font-weight: 800; +.site-footer { + padding: 42px 6vw; + color: var(--muted); + border-top: 1px solid var(--border); } -.feature-icon { - font-size: 2rem; - margin-bottom: 14px; -} +@media (max-width: 900px) { + .hero-split { + grid-template-columns: 1fr; + } -.feature-icon.large { - font-size: 3.5rem; + .hero-panel { + transform: none; + } + + .site-header { + align-items: flex-start; + flex-direction: column; + } } \ No newline at end of file diff --git a/website/_site/download/index.html b/website/_site/download/index.html index 0778569..fe9a5bc 100644 --- a/website/_site/download/index.html +++ b/website/_site/download/index.html @@ -5,7 +5,6 @@
- Official builds are published through GitHub Releases for Windows, Linux - and macOS. +
Download
++ Official builds are published through GitHub Releases for Windows, Linux and macOS.
+Recommended
+ZIP
+ Open download โ +DMG
+ Open download โ +AppImage / DEB / RPM / Arch
+ Open download โ +flatpakref
+ Open download โ +PDF EN/DE
+ Open download โ +