neckfireandClaude Opus 4.8
8ee9596529
Build & Deploy / build (push) Failing after 5s
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
73 lines
2.4 KiB
CSS
73 lines
2.4 KiB
CSS
@import "tailwindcss";
|
|
@import "@nuxt/ui";
|
|
|
|
/*
|
|
* StreakFit — thème « flamme ».
|
|
* Palette primaire = flame (orange→rouge), highlight ember/amber. Base claire + dark.
|
|
*/
|
|
@theme static {
|
|
--font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
|
|
--font-display: 'Inter', ui-sans-serif, system-ui, sans-serif;
|
|
|
|
/* Échelle "flame" utilisée comme couleur primaire Nuxt UI (app.config primary: 'flame') */
|
|
--color-flame-50: #FFF7ED;
|
|
--color-flame-100: #FFEDD5;
|
|
--color-flame-200: #FED7AA;
|
|
--color-flame-300: #FDBA74;
|
|
--color-flame-400: #FB923C;
|
|
--color-flame-500: #F97316;
|
|
--color-flame-600: #EA580C;
|
|
--color-flame-700: #C2410C;
|
|
--color-flame-800: #9A3412;
|
|
--color-flame-900: #7C2D12;
|
|
--color-flame-950: #431407;
|
|
|
|
--color-ember-500: #EF4444;
|
|
--color-amber-glow: #FBBF24;
|
|
}
|
|
|
|
:root {
|
|
--sf-flame-gradient: linear-gradient(160deg, #FBBF24 0%, #F97316 45%, #EF4444 100%);
|
|
}
|
|
|
|
/* Dégradé flamme réutilisable (texte / fond) */
|
|
.sf-flame-text {
|
|
background: var(--sf-flame-gradient);
|
|
-webkit-background-clip: text;
|
|
background-clip: text;
|
|
color: transparent;
|
|
}
|
|
.sf-flame-bg { background: var(--sf-flame-gradient); }
|
|
|
|
/* ---- Animation du logo/loader "SF" ---- */
|
|
@keyframes sf-flicker {
|
|
0%, 100% { opacity: 1; transform: translateY(0) scaleY(1); }
|
|
25% { opacity: 0.92; transform: translateY(-1%) scaleY(1.04); }
|
|
50% { opacity: 1; transform: translateY(0.5%) scaleY(0.98); }
|
|
75% { opacity: 0.95; transform: translateY(-0.5%) scaleY(1.03); }
|
|
}
|
|
@keyframes sf-draw {
|
|
to { stroke-dashoffset: 0; }
|
|
}
|
|
@keyframes sf-rise {
|
|
0% { transform: translateY(6%) scale(0.96); opacity: 0.6; }
|
|
50% { transform: translateY(-3%) scale(1.02); opacity: 1; }
|
|
100% { transform: translateY(0) scale(1); opacity: 1; }
|
|
}
|
|
@keyframes sf-spin-glow {
|
|
0% { transform: rotate(0deg); }
|
|
100% { transform: rotate(360deg); }
|
|
}
|
|
|
|
.sf-logo__flame { transform-origin: 50% 90%; animation: sf-flicker 1.6s ease-in-out infinite; }
|
|
.sf-logo__mark { stroke-dasharray: 200; stroke-dashoffset: 200; animation: sf-draw 1.1s ease-out forwards; }
|
|
|
|
/* Mode "loader" : la flamme monte + halo tournant */
|
|
.sf-loader .sf-logo__flame { animation: sf-rise 1.1s ease-in-out infinite alternate; }
|
|
.sf-loader .sf-logo__halo { animation: sf-spin-glow 2.4s linear infinite; transform-origin: center; }
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.sf-logo__flame, .sf-logo__mark, .sf-loader .sf-logo__flame, .sf-loader .sf-logo__halo { animation: none; }
|
|
.sf-logo__mark { stroke-dashoffset: 0; }
|
|
}
|