studio-variable/world-game
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
world-game/src/styles/variables.css

59 lines
1.7 KiB
CSS
Raw Normal View History

Upgrade vers Svelte 5 et reproduction de la page d'accueil - Upgrade : Svelte 5.0.0, Vite 7.0.4, @sveltejs/vite-plugin-svelte 6.0.0 - Migration syntaxe Svelte 5 : $derived, $props(), onclick, mount() - Navbar identique au site source avec logo GIF et menu animé - Page Home avec vidéo plein écran et lignes verticales - CSS modulaire organisé en fichiers séparés (variables, fonts, layout, buttons, etc.) - Assets copiés : fonts Danzza, vidéos, icônes Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-07 07:52:16 +01:00
/* CSS Variables */
:root {
Refactor: consolider toutes les variables CSS dans variables.css - variables.css : z-index, couleurs et font-sizes au même endroit - layout.css, buttons.css : z-index: 1 → var(--z-base) - Suppression de src/style.css (fichier mort, jamais importé) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-19 14:02:06 +01:00
/* Colors */
--color-primary: #04fea0;
--color-primary-hover: #03d98c;
--color-background: #000;
--color-text: #fff;
Feat: responsive header mobile + variables breakpoints - variables.css : --breakpoint-mobile (700px) et --breakpoint-tablet (912px) - Header : .navbar-item { display: none } en dessous de 700px - Header/Menu : annotation des media queries avec les variables de référence Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-19 14:38:06 +01:00
/* BREAKPOINTS (référence — non utilisables directement dans @media)
* --breakpoint-mobile : 700px
* --breakpoint-tablet : 912px
*/
--breakpoint-mobile: 700px;
--breakpoint-tablet: 912px;
Refactor: consolider toutes les variables CSS dans variables.css - variables.css : z-index, couleurs et font-sizes au même endroit - layout.css, buttons.css : z-index: 1 → var(--z-base) - Suppression de src/style.css (fichier mort, jamais importé) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-19 14:02:06 +01:00
/* Z-INDEX SCALE
* --z-base : éléments décoratifs (lignes verticales, bg)
* --z-content : contenu de slides (textes, overlays légers)
* --z-menu : overlay menu plein écran
* --z-header : barre de navigation (toujours au-dessus du menu)
* --z-cursor : curseur personnalisé (toujours au-dessus de tout)
*/
--z-base: 1;
--z-content: 5;
--z-menu: 100;
--z-header: 200;
--z-cursor: 9999;
/* Font sizes — desktop */
Upgrade vers Svelte 5 et reproduction de la page d'accueil - Upgrade : Svelte 5.0.0, Vite 7.0.4, @sveltejs/vite-plugin-svelte 6.0.0 - Migration syntaxe Svelte 5 : $derived, $props(), onclick, mount() - Navbar identique au site source avec logo GIF et menu animé - Page Home avec vidéo plein écran et lignes verticales - CSS modulaire organisé en fichiers séparés (variables, fonts, layout, buttons, etc.) - Assets copiés : fonts Danzza, vidéos, icônes Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-07 07:52:16 +01:00
--font-size-paragraph: 18px;
--font-size-paragraph-small: 16px;
--font-size-subtitle: 20px;
--font-size-title-section: 32px;
--font-size-title-main: 48px;
--font-size-title-hero: 96px;
--font-size-button: 13px;
--font-size-caption: 12px;
Refactor: consolider toutes les variables CSS dans variables.css - variables.css : z-index, couleurs et font-sizes au même endroit - layout.css, buttons.css : z-index: 1 → var(--z-base) - Suppression de src/style.css (fichier mort, jamais importé) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-19 14:02:06 +01:00
/* Font sizes — mobile */
Upgrade vers Svelte 5 et reproduction de la page d'accueil - Upgrade : Svelte 5.0.0, Vite 7.0.4, @sveltejs/vite-plugin-svelte 6.0.0 - Migration syntaxe Svelte 5 : $derived, $props(), onclick, mount() - Navbar identique au site source avec logo GIF et menu animé - Page Home avec vidéo plein écran et lignes verticales - CSS modulaire organisé en fichiers séparés (variables, fonts, layout, buttons, etc.) - Assets copiés : fonts Danzza, vidéos, icônes Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-07 07:52:16 +01:00
--font-size-paragraph-mobile: 16px;
--font-size-paragraph-small-mobile: 12px;
--font-size-subtitle-mobile: 16px;
--font-size-title-section-mobile: 24px;
--font-size-title-main-mobile: 32px;
--font-size-title-hero-mobile: 48px;
--font-size-button-mobile: 11px;
--font-size-caption-mobile: 10px;
Refactor: consolider toutes les variables CSS dans variables.css - variables.css : z-index, couleurs et font-sizes au même endroit - layout.css, buttons.css : z-index: 1 → var(--z-base) - Suppression de src/style.css (fichier mort, jamais importé) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-19 14:02:06 +01:00
/* Font sizes — tablet */
Upgrade vers Svelte 5 et reproduction de la page d'accueil - Upgrade : Svelte 5.0.0, Vite 7.0.4, @sveltejs/vite-plugin-svelte 6.0.0 - Migration syntaxe Svelte 5 : $derived, $props(), onclick, mount() - Navbar identique au site source avec logo GIF et menu animé - Page Home avec vidéo plein écran et lignes verticales - CSS modulaire organisé en fichiers séparés (variables, fonts, layout, buttons, etc.) - Assets copiés : fonts Danzza, vidéos, icônes Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-07 07:52:16 +01:00
--font-size-paragraph-tablet: 16px;
--font-size-paragraph-small-tablet: 14px;
--font-size-subtitle-tablet: 18px;
--font-size-title-section-tablet: 28px;
--font-size-title-main-tablet: 40px;
--font-size-title-hero-tablet: 64px;
--font-size-button-tablet: 12px;
--font-size-caption-tablet: 11px;
}
Reference in a new issue Copy permalink