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 {
|
||||
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
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user