dert
This commit is contained in:
parent
02953bf6fa
commit
039d8dee6f
|
|
@ -888,106 +888,119 @@ h1, h2, h3, h4, h5, h6, .fw-bold, .fw-semibold {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/* Status Badges */
|
/* ============================================================
|
||||||
.badge-status {
|
INTER SANTÉ — THEME NEUTRAL PRO v2026
|
||||||
display: inline-flex;
|
Section 5 : Badges, Cards & Buttons (Rigueur & Précision)
|
||||||
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); }
|
|
||||||
|
|
||||||
/* ==============================
|
/* --- STATUS BADGES (Version Rectangulaire Pro) --- */
|
||||||
CARDS
|
.badge-status {
|
||||||
============================== */
|
display: inline-flex;
|
||||||
.card {
|
align-items: center;
|
||||||
background: var(--bg-surface);
|
gap: 6px;
|
||||||
border: 1px solid var(--border-light);
|
padding: 3px 8px;
|
||||||
border-radius: var(--radius-lg);
|
border-radius: var(--radius-sm); /* Coins moins arrondis */
|
||||||
box-shadow: var(--shadow-xs);
|
font-size: 10px;
|
||||||
transition: box-shadow var(--transition-base);
|
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 {
|
.card-header {
|
||||||
background: transparent;
|
background: var(--bg-surface-2); /* Léger fond gris pour l'en-tête */
|
||||||
border-bottom: 1px solid var(--border-light);
|
border-bottom: 1px solid var(--border-light);
|
||||||
padding: 14px 18px;
|
padding: 10px 16px;
|
||||||
font-family: 'Syne', sans-serif;
|
font-family: 'Syne', sans-serif;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
font-size: 0.88rem;
|
font-size: 13px;
|
||||||
|
color: var(--color-primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ==============================
|
/* --- BUTTONS (Blocs Techniques) --- */
|
||||||
BUTTONS
|
|
||||||
============================== */
|
|
||||||
.btn {
|
.btn {
|
||||||
border-radius: var(--radius-sm) !important;
|
border-radius: var(--radius-sm) !important;
|
||||||
font-size: 0.8rem;
|
font-size: 12px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
font-family: 'DM Sans', sans-serif;
|
padding: 6px 14px;
|
||||||
padding: 7px 16px;
|
transition: all var(--transition-fast);
|
||||||
transition: all var(--transition-fast);
|
border: 1px solid transparent;
|
||||||
border: none;
|
display: inline-flex;
|
||||||
display: inline-flex;
|
align-items: center;
|
||||||
align-items: center;
|
gap: 8px;
|
||||||
gap: 6px;
|
box-shadow: none !important; /* On supprime les ombres de boutons */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Bouton primaire : charcoal */
|
/* Bouton Primaire : Charcoal pur */
|
||||||
.btn-primary {
|
.btn-primary {
|
||||||
background: var(--color-primary) !important;
|
background: var(--color-primary) !important;
|
||||||
color: white !important;
|
color: white !important;
|
||||||
box-shadow: 0 2px 8px rgba(30,34,40,.22);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-primary:hover {
|
.btn-primary:hover {
|
||||||
background: var(--color-primary-light) !important;
|
background: var(--color-primary-dark) !important;
|
||||||
box-shadow: 0 4px 16px rgba(30,34,40,.30);
|
|
||||||
transform: translateY(-1px);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Bouton Info/Action : Slate Grey */
|
||||||
.btn-info {
|
.btn-info {
|
||||||
background: var(--color-info) !important;
|
background: var(--color-primary-light) !important;
|
||||||
color: white !important;
|
color: white !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-info:hover {
|
.btn-info:hover {
|
||||||
background: #1f6fa0 !important;
|
background: var(--color-primary) !important;
|
||||||
transform: translateY(-1px);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Bouton Warning/Urgent : Rouge plat */
|
||||||
.btn-warning {
|
.btn-warning {
|
||||||
background: var(--color-urgent) !important;
|
background: var(--color-urgent) !important;
|
||||||
color: white !important;
|
color: white !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Bouton Secondaire / Outline */
|
||||||
.btn-default, .btn-outline-secondary {
|
.btn-default, .btn-outline-secondary {
|
||||||
background: white;
|
background: white !important;
|
||||||
border: 1px solid var(--border-medium) !important;
|
border: 1px solid var(--border-medium) !important;
|
||||||
color: var(--text-secondary) !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);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.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
|
FORM ELEMENTS
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user