forked from FroSteel/Planification
v2026.5.17 — Date custom : label localisé (jour de la semaine en français)
This commit is contained in:
Quentin Rouiller
+239
-6
@@ -323,17 +323,53 @@ html, body {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
/* v2026.5.16 : nom court du jour (Mardi, Lundi, ...) à gauche du date-picker */
|
||||
.date-picker-day {
|
||||
/* v2026.5.17 : faux input date custom avec nom du jour */
|
||||
.date-custom-wrapper {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
.date-custom {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 5px 10px 5px 12px;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
background: var(--bg-muted);
|
||||
color: var(--text);
|
||||
font-family: inherit;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: var(--text-muted);
|
||||
padding: 0 6px 0 2px;
|
||||
min-width: 58px;
|
||||
text-align: right;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
user-select: none;
|
||||
transition: border-color 0.15s, background 0.15s;
|
||||
}
|
||||
.date-custom:hover {
|
||||
border-color: var(--border-strong);
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
.date-custom:focus {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: -1px;
|
||||
}
|
||||
.date-custom-icon {
|
||||
font-size: 13px;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.date-input-hidden {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* v2026.5.17 : masquer l'ancien date-picker-day s'il traîne (compat) */
|
||||
.date-picker-day { display: none; }
|
||||
|
||||
.btn-nav {
|
||||
padding: 6px 10px;
|
||||
@@ -979,6 +1015,12 @@ html, body {
|
||||
opacity: 0;
|
||||
transition: opacity 0.1s, background 0.1s, color 0.1s;
|
||||
font-family: inherit;
|
||||
/* v2026.5.17 : figer largeur/hauteur pour que le changement 📋 → ✓ pendant
|
||||
la copie ne fasse pas bouger le titre centré dans la grid */
|
||||
min-width: 28px;
|
||||
min-height: 22px;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.intervention-v2:hover .intervention-copy { opacity: 1; }
|
||||
.intervention-copy:hover {
|
||||
@@ -2498,3 +2540,194 @@ header.topbar::before {
|
||||
.btn-today { padding: 4px 6px; font-size: 11px; }
|
||||
.btn-nav { min-width: 26px; padding: 4px 6px; }
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : topbar des popups épinglés (3 boutons : _ ▭ 📍)
|
||||
========================================================================== */
|
||||
.pinned-popup {
|
||||
/* Laisser un peu de place en haut pour la topbar */
|
||||
padding-top: 30px !important;
|
||||
}
|
||||
.pinned-popup-topbar {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
display: flex;
|
||||
gap: 2px;
|
||||
align-items: center;
|
||||
z-index: 2;
|
||||
}
|
||||
.pinned-popup-btn {
|
||||
width: 26px;
|
||||
height: 22px;
|
||||
padding: 0;
|
||||
font-size: 13px;
|
||||
line-height: 1;
|
||||
background: transparent;
|
||||
color: var(--text-muted);
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
transition: background 0.1s, color 0.1s, border-color 0.1s;
|
||||
font-family: inherit;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.pinned-popup-btn:hover {
|
||||
background: var(--bg-muted);
|
||||
color: var(--text);
|
||||
border-color: var(--border);
|
||||
}
|
||||
.pinned-popup-unpin {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : mode Minimisé (popup flottant compact, juste la ref)
|
||||
========================================================================== */
|
||||
.pinned-popup.pinned-popup-minimized {
|
||||
min-width: 160px !important;
|
||||
max-width: 220px !important;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
padding-top: 28px !important;
|
||||
padding-bottom: 6px !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
.pinned-popup.pinned-popup-minimized > :not(.pinned-popup-topbar):not(.iv-ref-header):not(.pinned-popup-dragbar) {
|
||||
display: none !important;
|
||||
}
|
||||
.pinned-popup.pinned-popup-minimized .iv-ref-header {
|
||||
text-align: center;
|
||||
padding: 4px 8px !important;
|
||||
grid-column: unset !important;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : mode Réduit (docké en bas de l'écran) + taskbar
|
||||
========================================================================== */
|
||||
.pinned-popup.pinned-popup-reduced {
|
||||
display: none !important;
|
||||
}
|
||||
.pinned-popups-dock {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 50;
|
||||
display: none;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
padding: 6px 10px;
|
||||
background: var(--bg-elevated);
|
||||
border-top: 1px solid var(--border);
|
||||
box-shadow: 0 -2px 10px rgba(0,0,0,0.2);
|
||||
}
|
||||
.pinned-popups-dock.visible {
|
||||
display: flex;
|
||||
}
|
||||
.pinned-popup-dock-pill {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 6px 14px;
|
||||
background: var(--accent, #3b82f6);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 16px;
|
||||
font-family: var(--mono, monospace);
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
transition: background 0.15s, transform 0.15s;
|
||||
}
|
||||
.pinned-popup-dock-pill:hover {
|
||||
background: var(--accent-hover, #2563eb);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : popup user-badge avec ligne session
|
||||
========================================================================== */
|
||||
.user-name-popup-name {
|
||||
font-weight: 600;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.user-name-popup-session {
|
||||
font-size: 12px;
|
||||
font-variant-numeric: tabular-nums;
|
||||
padding-top: 4px;
|
||||
border-top: 1px solid var(--border);
|
||||
}
|
||||
.user-name-popup-session.session-ok { color: var(--text-muted); }
|
||||
.user-name-popup-session.session-warn { color: #f59e0b; font-weight: 600; }
|
||||
.user-name-popup-session.session-critical { color: #ef4444; font-weight: 700; }
|
||||
|
||||
/* ==========================================================================
|
||||
v2026.5.17 : popup alerte session qui glisse depuis haut-gauche
|
||||
========================================================================== */
|
||||
.session-slide-alert {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
left: -420px; /* hors écran au départ */
|
||||
width: 380px;
|
||||
max-width: calc(100vw - 40px);
|
||||
padding: 14px 18px;
|
||||
background: var(--bg-elevated);
|
||||
border: 1px solid var(--border);
|
||||
border-left: 4px solid #f59e0b;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 8px 24px rgba(0,0,0,0.25);
|
||||
z-index: 1000;
|
||||
transition: left 0.28s ease-out, opacity 0.28s;
|
||||
opacity: 0;
|
||||
}
|
||||
.session-slide-alert.visible {
|
||||
left: 20px;
|
||||
opacity: 1;
|
||||
}
|
||||
.session-slide-alert.urgent {
|
||||
border-left-color: #ef4444;
|
||||
animation: session-pulse 1.4s ease-in-out infinite;
|
||||
}
|
||||
@keyframes session-pulse {
|
||||
0%, 100% { box-shadow: 0 8px 24px rgba(0,0,0,0.25); }
|
||||
50% { box-shadow: 0 8px 24px rgba(239,68,68,0.5); }
|
||||
}
|
||||
.session-slide-alert-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: var(--text);
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.session-slide-alert-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.session-slide-alert-extend,
|
||||
.session-slide-alert-later {
|
||||
padding: 6px 14px;
|
||||
font-size: 13px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--border);
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
}
|
||||
.session-slide-alert-extend {
|
||||
background: #10b981;
|
||||
color: white;
|
||||
border-color: #10b981;
|
||||
font-weight: 600;
|
||||
}
|
||||
.session-slide-alert-extend:hover { background: #059669; }
|
||||
.session-slide-alert-extend:disabled { opacity: 0.6; cursor: wait; }
|
||||
.session-slide-alert-later {
|
||||
background: transparent;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
.session-slide-alert-later:hover {
|
||||
background: var(--bg-muted);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user