site v12 — design review : fond plus clair, glass + visible, halos renforcés, relief sections

This commit is contained in:
2026-04-21 09:37:58 +00:00
parent f4861b47e6
commit e3406d88f2
2 changed files with 9 additions and 8 deletions

View File

@@ -19,7 +19,7 @@ const defaults = ['hydro', 'temp'];
const cats = Array.from(new Set(sensors.map((s) => s.cat))); const cats = Array.from(new Set(sensors.map((s) => s.cat)));
--- ---
<section id="configurateur" class="section"> <section id="configurateur" class="section" style="background: rgba(13,31,56,0.55); box-shadow: inset 0 1px 0 rgba(56,189,248,0.08), inset 0 -1px 0 rgba(56,189,248,0.06);">
<div class="container-narrow"> <div class="container-narrow">
<div class="section-title-block"> <div class="section-title-block">
<span class="eyebrow">Configurateur</span> <span class="eyebrow">Configurateur</span>

View File

@@ -16,9 +16,10 @@
body { body {
@apply bg-abyss-950 text-foam-50 font-sans; @apply bg-abyss-950 text-foam-50 font-sans;
background-image: background-image:
radial-gradient(1200px 600px at 10% -10%, rgba(6, 182, 212, 0.10), transparent 60%), radial-gradient(1400px 700px at 15% -5%, rgba(6, 182, 212, 0.18), transparent 55%),
radial-gradient(1000px 500px at 110% 10%, rgba(14, 165, 233, 0.08), transparent 60%), radial-gradient(1000px 500px at 110% 15%, rgba(14, 165, 233, 0.14), transparent 55%),
linear-gradient(180deg, #050d1a 0%, #0a1a2f 100%); radial-gradient(800px 600px at 50% 60%, rgba(6, 182, 212, 0.07), transparent 65%),
linear-gradient(180deg, #071222 0%, #0d1f38 50%, #0a1a2f 100%);
background-attachment: fixed; background-attachment: fixed;
min-height: 100vh; min-height: 100vh;
} }
@@ -69,11 +70,11 @@
} }
.lead { .lead {
@apply text-lg md:text-xl text-foam-100/80 leading-relaxed; @apply text-lg md:text-xl text-foam-100/90 leading-relaxed;
} }
.glass { .glass {
@apply bg-white/[0.03] backdrop-blur-sm border border-white/[0.07]; @apply bg-white/[0.06] backdrop-blur-sm border border-white/[0.12];
} }
.card { .card {
@@ -110,8 +111,8 @@
/* Decorative caustic glow used as subtle ambient light */ /* Decorative caustic glow used as subtle ambient light */
.caustic-bg { .caustic-bg {
background-image: background-image:
radial-gradient(circle at 20% 10%, rgba(6, 182, 212, 0.12), transparent 55%), radial-gradient(circle at 20% 10%, rgba(6, 182, 212, 0.20), transparent 55%),
radial-gradient(circle at 80% 80%, rgba(14, 165, 233, 0.10), transparent 55%); radial-gradient(circle at 80% 80%, rgba(14, 165, 233, 0.16), transparent 55%);
} }
/* Animated horizon line */ /* Animated horizon line */