From 039d8dee6f12e0ebf02a0cc5e35430e3ed16dae4 Mon Sep 17 00:00:00 2001 From: KONE SOREL Date: Fri, 3 Apr 2026 08:37:33 +0000 Subject: [PATCH] dert --- Bootstrap_new/css/theme-modern.css | 163 ++++++++++++++++------------- 1 file changed, 88 insertions(+), 75 deletions(-) diff --git a/Bootstrap_new/css/theme-modern.css b/Bootstrap_new/css/theme-modern.css index 18323cd7..1ac51831 100644 --- a/Bootstrap_new/css/theme-modern.css +++ b/Bootstrap_new/css/theme-modern.css @@ -888,106 +888,119 @@ h1, h2, h3, h4, h5, h6, .fw-bold, .fw-semibold { } -/* Status Badges */ -.badge-status { - display: inline-flex; - align-items: center; - gap: 4px; - padding: 3px 10px; - border-radius: var(--radius-full); - font-size: 0.68rem; - font-weight: 700; - letter-spacing: 0.04em; - text-transform: uppercase; -} -.badge-status::before { - content: ''; - width: 5px; - height: 5px; - border-radius: 50%; - background: currentColor; -} -.badge-valide { background: rgba(39,174,96,0.10); color: #1e8449; } -.badge-urgent { background: rgba(192,57,43,0.10); color: var(--color-urgent); } -.badge-attente { background: rgba(230,126,34,0.10); color: #b9720a; } -.badge-info { background: rgba(41,128,185,0.10); color: #1a6898; } -.badge-inactive { background: rgba(127,140,141,0.10); color: var(--color-neutral); } +/* ============================================================ + INTER SANTÉ — THEME NEUTRAL PRO v2026 + Section 5 : Badges, Cards & Buttons (Rigueur & Précision) + ============================================================ */ -/* ============================== - CARDS - ============================== */ -.card { - background: var(--bg-surface); - border: 1px solid var(--border-light); - border-radius: var(--radius-lg); - box-shadow: var(--shadow-xs); - transition: box-shadow var(--transition-base); +/* --- STATUS BADGES (Version Rectangulaire Pro) --- */ +.badge-status { + display: inline-flex; + align-items: center; + gap: 6px; + padding: 3px 8px; + border-radius: var(--radius-sm); /* Coins moins arrondis */ + font-size: 10px; + font-weight: 800; + letter-spacing: 0.5px; + text-transform: uppercase; + font-family: 'Syne', sans-serif; + border: 1px solid transparent; +} + +/* Le point indicateur devient un carré de 4px pour plus de rigueur */ +.badge-status::before { + content: ''; + width: 4px; + height: 4px; + background: currentColor; + border-radius: 1px; +} + +.badge-valide { background: rgba(39,174,96,0.08); color: #1E8449; border-color: rgba(39,174,96,0.2); } +.badge-urgent { background: rgba(192,57,43,0.08); color: var(--color-urgent); border-color: rgba(192,57,43,0.2); } +.badge-attente { background: rgba(230,126,34,0.08); color: #B9720A; border-color: rgba(230,126,34,0.2); } +.badge-info { background: var(--color-primary-ghost); color: var(--color-primary); border-color: var(--border-light); } +.badge-inactive { background: var(--bg-surface-2); color: var(--text-muted); border-color: var(--border-light); } + +/* --- CARDS (Stabilité ERP) --- */ +.card { + background: var(--bg-surface); + border: 1px solid var(--border-light); + border-radius: var(--radius-sm); /* Finies les grosses rondeurs */ + box-shadow: none; /* Pas d'ombre par défaut pour plus de clarté */ + margin-bottom: 1.5rem; + transition: border-color var(--transition-fast); +} + +.card:hover { + border-color: var(--border-medium); /* On souligne juste la bordure au survol */ } -.card:hover { box-shadow: var(--shadow-md); } .card-header { - background: transparent; - border-bottom: 1px solid var(--border-light); - padding: 14px 18px; - font-family: 'Syne', sans-serif; - font-weight: 700; - font-size: 0.88rem; + background: var(--bg-surface-2); /* Léger fond gris pour l'en-tête */ + border-bottom: 1px solid var(--border-light); + padding: 10px 16px; + font-family: 'Syne', sans-serif; + font-weight: 700; + font-size: 13px; + color: var(--color-primary); } -/* ============================== - BUTTONS - ============================== */ +/* --- BUTTONS (Blocs Techniques) --- */ .btn { - border-radius: var(--radius-sm) !important; - font-size: 0.8rem; - font-weight: 600; - font-family: 'DM Sans', sans-serif; - padding: 7px 16px; - transition: all var(--transition-fast); - border: none; - display: inline-flex; - align-items: center; - gap: 6px; + border-radius: var(--radius-sm) !important; + font-size: 12px; + font-weight: 600; + padding: 6px 14px; + transition: all var(--transition-fast); + border: 1px solid transparent; + display: inline-flex; + align-items: center; + gap: 8px; + box-shadow: none !important; /* On supprime les ombres de boutons */ } -/* Bouton primaire : charcoal */ +/* Bouton Primaire : Charcoal pur */ .btn-primary { - background: var(--color-primary) !important; - color: white !important; - box-shadow: 0 2px 8px rgba(30,34,40,.22); + background: var(--color-primary) !important; + color: white !important; } + .btn-primary:hover { - background: var(--color-primary-light) !important; - box-shadow: 0 4px 16px rgba(30,34,40,.30); - transform: translateY(-1px); + background: var(--color-primary-dark) !important; } +/* Bouton Info/Action : Slate Grey */ .btn-info { - background: var(--color-info) !important; - color: white !important; + background: var(--color-primary-light) !important; + color: white !important; } + .btn-info:hover { - background: #1f6fa0 !important; - transform: translateY(-1px); + background: var(--color-primary) !important; } +/* Bouton Warning/Urgent : Rouge plat */ .btn-warning { - background: var(--color-urgent) !important; - color: white !important; + background: var(--color-urgent) !important; + color: white !important; } +/* Bouton Secondaire / Outline */ .btn-default, .btn-outline-secondary { - background: white; - border: 1px solid var(--border-medium) !important; - color: var(--text-secondary) !important; -} -.btn-default:hover, .btn-outline-secondary:hover { - border-color: var(--color-primary-light) !important; - color: var(--color-primary) !important; - background: var(--color-primary-ghost); + background: white !important; + border: 1px solid var(--border-medium) !important; + color: var(--text-secondary) !important; } -.btn-sm { padding: 5px 12px; font-size: 0.75rem; } +.btn-default:hover, .btn-outline-secondary:hover { + border-color: var(--color-primary) !important; + color: var(--color-primary) !important; + background: var(--bg-surface-2) !important; +} + +.btn-sm { padding: 4px 10px; font-size: 11px; } /* ============================== FORM ELEMENTS