From 83329cef413e6ae66f2240521f0cb164170abc0e Mon Sep 17 00:00:00 2001 From: Xor290 Date: Sat, 27 Jun 2026 19:32:28 +0200 Subject: [PATCH] chore: build --- frontend-prep/src/index.css | 268 ++++++++++++++++++++++-------------- 1 file changed, 162 insertions(+), 106 deletions(-) diff --git a/frontend-prep/src/index.css b/frontend-prep/src/index.css index 662235f7..23c821b4 100644 --- a/frontend-prep/src/index.css +++ b/frontend-prep/src/index.css @@ -1,126 +1,182 @@ -/* Reset et optimisation mobile */ -* { - margin: 0; - padding: 0; - box-sizing: border-box; - -webkit-tap-highlight-color: transparent; - -} - -:root { - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', sans-serif; - line-height: 1.5; - font-weight: 400; - color-scheme: dark; - font-synthesis: none; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - font-size: 16px; - - --bg: #09090b; - --surface: #111115; - --surface-2: #1c1c22; - --border: rgba(255, 255, 255, 0.07); - --primary: #8b5cf6; - --primary-soft: rgba(139, 92, 246, 0.12); - --primary-glow: rgba(139, 92, 246, 0.25); - --cyan: #22d3ee; - --cyan-soft: rgba(34, 211, 238, 0.1); - --red: #ef4444; - --text: #f4f4f5; - --text-muted: #71717a; - --radius: 10px; - --transition: 0.22s cubic-bezier(0.4, 0, 0.2, 1); -} - -[data-theme="light"] { - color-scheme: light; - --bg: #f4f4f8; - --surface: #ffffff; - --surface-2: #ebebf2; - --border: rgba(0, 0, 0, 0.08); - --primary: #7c3aed; - --primary-soft: rgba(124, 58, 237, 0.08); - --primary-glow: rgba(124, 58, 237, 0.18); - --cyan: #0891b2; - --cyan-soft: rgba(8, 145, 178, 0.1); - --red: #dc2626; - --text: #18181b; - --text-muted: #52525b; -} - -html, body { - margin: 0; - padding: 0; - width: 100%; - height: 100%; - overflow-x: hidden; - /* Désactiver le scroll bounce sur iOS */ - overscroll-behavior: none; - -webkit-overflow-scrolling: touch; -} - -body { - position: fixed; - width: 100%; - height: 100%; - background-color: var(--bg); - color: var(--text); -} - +/* Réinitialiser les styles globaux */ +html, +body, #root { - width: 100%; - height: 100%; - overflow: auto; + margin: 0; + padding: 0; + width: 100%; + min-height: 100vh; + overflow-x: hidden; +} +#root { + width: 100%; + height: 100%; +} +.app { + width: 100%; + min-height: 100vh; + display: flex; + justify-content: center; + align-items: center; + margin: 0; + padding: 0; + box-sizing: border-box; +} +.app h1 { + color: white; + font-size: clamp(2rem, 8vw, 3.5rem); + margin: 0; + text-align: center; + padding: 0 1rem; +} +/* Reset global pour tous les éléments */ +* { + box-sizing: border-box; +} +/* Add this to your global CSS file (App.css, index.css, or main.css) */ +.toast-container { + position: fixed; + bottom: 20px; + right: 20px; + display: flex; + flex-direction: column; + gap: 10px; + z-index: 9999; + pointer-events: none; +} +.toast-container .toast { + pointer-events: auto; +} +/* Stagger animation for multiple toasts */ +.toast:nth-child(2) { + animation-delay: 0.1s; +} +.toast:nth-child(3) { + animation-delay: 0.2s; +} +.toast:nth-child(4) { + animation-delay: 0.3s; +} /* Reset et optimisation mobile */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + -webkit-tap-highlight-color: transparent; +} +:root { + font-family: + -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", + "Ubuntu", "Cantarell", sans-serif; + line-height: 1.5; + font-weight: 400; + color-scheme: dark; + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + font-size: 16px; + --bg: #09090b; + --surface: #111115; + --surface-2: #1c1c22; + --border: rgba(255, 255, 255, 0.07); + --primary: #8b5cf6; + --primary-soft: rgba(139, 92, 246, 0.12); + --primary-glow: rgba(139, 92, 246, 0.25); + --cyan: #22d3ee; + --cyan-soft: rgba(34, 211, 238, 0.1); + --red: #ef4444; + --text: #f4f4f5; + --text-muted: #71717a; + --radius: 10px; + --transition: 0.22s cubic-bezier(0.4, 0, 0.2, 1); +} +[data-theme="light"] { + color-scheme: light; + --bg: #f4f4f8; + --surface: #ffffff; + --surface-2: #ebebf2; + --border: rgba(0, 0, 0, 0.08); + --primary: #7c3aed; + --primary-soft: rgba(124, 58, 237, 0.08); + --primary-glow: rgba(124, 58, 237, 0.18); + --cyan: #0891b2; + --cyan-soft: rgba(8, 145, 178, 0.1); + --red: #dc2626; + --text: #18181b; + --text-muted: #52525b; } +/* ============================================================ + html / body / #root — fond garanti partout, y compris dans la + zone d'overscroll (bounce) sur iOS/Android, pour éviter tout + flash d'une couleur différente (blanc par défaut) quand on + scrolle au-delà des limites du contenu. + ============================================================ */ +html, +body { + margin: 0; + padding: 0; + width: 100%; + height: 100%; + overflow-x: hidden; + /* Désactiver le scroll bounce sur iOS */ + overscroll-behavior: none; + -webkit-overflow-scrolling: touch; + background-color: var(--bg); +} +body { + position: fixed; + width: 100%; + height: 100%; + background-color: var(--bg); + color: var(--text); +} +#root { + width: 100%; + height: 100%; + overflow: auto; + background-color: var(--bg); + overscroll-behavior: none; +} a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; - -webkit-tap-highlight-color: transparent; + font-weight: 500; + color: #646cff; + text-decoration: inherit; + -webkit-tap-highlight-color: transparent; } - a:active { - opacity: 0.7; + opacity: 0.7; } - h1 { - font-size: clamp(1.8rem, 5vw, 3.2rem); - line-height: 1.1; + font-size: clamp(1.8rem, 5vw, 3.2rem); + line-height: 1.1; } - h2 { - font-size: clamp(1.5rem, 4vw, 2.5rem); + font-size: clamp(1.5rem, 4vw, 2.5rem); } - p { - font-size: clamp(0.9rem, 2.5vw, 1.1rem); + font-size: clamp(0.9rem, 2.5vw, 1.1rem); } - button { - border-radius: 8px; - border: 1px solid transparent; - padding: 0.8em 1.5em; - font-size: 1em; - font-weight: 500; - font-family: inherit; - background-color: var(--surface); - cursor: pointer; - transition: all 0.2s; - -webkit-tap-highlight-color: transparent; - touch-action: manipulation; + border-radius: 8px; + border: 1px solid transparent; + padding: 0.8em 1.5em; + font-size: 1em; + font-weight: 500; + font-family: inherit; + background-color: var(--surface); + cursor: pointer; + transition: all 0.2s; + -webkit-tap-highlight-color: transparent; + touch-action: manipulation; } - button:active { - transform: scale(0.95); - opacity: 0.8; + transform: scale(0.95); + opacity: 0.8; } - /* Désactiver le hover sur mobile */ @media (hover: none) { - button:hover { - border-color: transparent; - } + button:hover { + border-color: transparent; + } }