Rework the visual palette: muted blue-gray backdrop, bright accent kept

Replaced the flat near-white page background with a layered blue-gray
gradient (from a sampled palette) for actual visual depth, while
keeping buttons/icons/links on the original saturated accent blue so
interactive elements still stand out against the calmer backdrop.
Also removed the "Testa dati" badge on Home, a synthetic-data leftover
now that both Rocky and the VPS run on real data only.
This commit is contained in:
b0txec
2026-08-23 13:31:02 +03:00
parent e19f4899b7
commit 744d706c83
3 changed files with 3 additions and 4 deletions
+2 -2
View File
@@ -1,9 +1,9 @@
:root{--text:#182230;--text-muted:#667085;--surface:#fff;--surface-soft:#f8fafc;--surface-strong:#edf1f5;--border:#dfe5ec;--accent:#2477c5;--accent-strong:#185a98;--accent-soft:#91bfe8;--accent-pale:#e9f3fc;--success:#269368;--danger:#c84646;--shadow-sm:0 5px 16px rgba(16,24,40,.05);--shadow-md:0 16px 36px rgba(16,24,40,.10)}
:root{--text:#1c2226;--text-muted:#6C7680;--surface:#fff;--surface-soft:#f4f6f7;--surface-strong:#e8ebec;--border:#d7dde0;--accent:#2477c5;--accent-strong:#185a98;--accent-soft:#91bfe8;--accent-pale:#e9f3fc;--success:#269368;--danger:#c84646;--shadow-sm:0 5px 16px rgba(16,24,40,.05);--shadow-md:0 16px 36px rgba(16,24,40,.10)}
*{box-sizing:border-box}
body {
margin: 0;
font-family: 'Monda',ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
color:var(--text);background-color:#edf3fb;background-image:radial-gradient(circle at 8% 4%,rgba(95,157,230,.14),transparent 30%),radial-gradient(circle at 92% 18%,rgba(99,196,218,.12),transparent 28%),linear-gradient(145deg,#f4f8fd 0%,#edf4fc 48%,#eaf1fb 100%);background-attachment:fixed;
color:var(--text);background-color:#dde3e5;background-image:radial-gradient(circle at 10% 0%,rgba(36,119,197,.16),transparent 32%),radial-gradient(circle at 95% 10%,rgba(124,139,144,.38),transparent 45%),radial-gradient(circle at 15% 100%,rgba(103,116,126,.32),transparent 50%),linear-gradient(160deg,#eef1f2 0%,#d8dfe1 45%,#c3ccd0 100%);background-attachment:fixed;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
+1 -1
View File
@@ -13,4 +13,4 @@ const tools = [
{path:'/harmonie', title:'Harmonie', description:'Lokāli saglabāto prognožu lauku kartes.', icon:Wind},
{path:'/lvgmc-forecast', title:'LVĢMC', description:'Pilsētu prognozes un ētera tabulas.', icon:Database},
]
export function Home() { return <section class="homePage"><div class="homeHero"><div><h1>Izvēlies sadaļu</h1><p class="heroCopy">Dati, prognozes un ētera grafikas.</p></div><div class="environmentBadge"><span class="statusDot"/>Testa dati<small>Sintētiskie novērojumi</small></div></div><div class="toolGrid">{tools.map(tool => <A class="toolCard" href={tool.path}><span class="toolIcon"><tool.icon size={64} strokeWidth={1.65}/></span><div class="toolCardCopy"><h2>{tool.title}</h2><p>{tool.description}</p></div><span class="cardArrow"></span></A>)}</div></section> }
export function Home() { return <section class="homePage"><div class="homeHero"><div><h1>Izvēlies sadaļu</h1><p class="heroCopy">Dati, prognozes un ētera grafikas.</p></div></div><div class="toolGrid">{tools.map(tool => <A class="toolCard" href={tool.path}><span class="toolIcon"><tool.icon size={64} strokeWidth={1.65}/></span><div class="toolCardCopy"><h2>{tool.title}</h2><p>{tool.description}</p></div><span class="cardArrow"></span></A>)}</div></section> }
-1
View File
@@ -1,6 +1,5 @@
.homePage{position:relative;max-width:1500px;margin:auto;padding:52px 32px 90px}.homePage:before{content:"";position:absolute;z-index:-1;top:-90px;right:4%;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,rgba(65,132,226,.18),transparent 68%);filter:blur(10px)}
.homeHero{display:flex;justify-content:space-between;align-items:end;gap:48px;margin-bottom:54px}.homeHero h1{margin:7px 0 10px;font-size:clamp(38px,5vw,64px);line-height:1;letter-spacing:-.045em}.heroCopy{margin:0;color:var(--text-muted);font-size:16px}.eyebrow{color:var(--accent-strong);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.environmentBadge{min-width:220px;padding:13px 16px;border:1px solid rgba(116,158,211,.35);border-radius:14px;background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(225,238,255,.82));font-weight:700;box-shadow:var(--shadow-sm);backdrop-filter:blur(12px)}.environmentBadge small{display:block;margin:3px 0 0 18px;color:var(--text-muted);font-weight:400}.statusDot{display:inline-block;width:9px;height:9px;margin-right:9px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px rgba(38,147,104,.12)}
.toolGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:34px;row-gap:42px}
.toolCard{position:relative;display:flex;min-height:205px;padding:62px 28px 25px;color:var(--text);text-decoration:none;filter:drop-shadow(0 14px 20px rgba(30,77,132,.1));transition:transform 280ms cubic-bezier(.23,1,.32,1),filter 280ms}
.toolCard:before{content:"";position:absolute;z-index:-1;inset:0;clip-path:polygon(0 12%,66% 0,100% 15%,100% 100%,0 100%);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(225,239,255,.76));box-shadow:inset 0 0 0 1px rgba(115,154,204,.28),inset 0 1px 0 rgba(255,255,255,.9);backdrop-filter:blur(15px)}