code_public/pointeuse-optimisator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Corrige le champ heure : l'icône d'horloge mangeait le dernier chiffre

Browse Source 
Champ trop étroit et texte centré : l'icône native (plus large sur
mobile) chevauchait la fin de l'heure saisie. Texte aligné à gauche,
largeur augmentée et padding de l'icône resserré.
This commit is contained in:
Antoine
2026-08-20 17:29:29 +02:00
parent 7423b68ac9
commit c89747bda6
1 changed files with 11 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
app/templates/base.html
View File

@ -302,19 +302,26 @@
.time-pair { display: flex; align-items: center; gap: 3px; justify-content: center; } .time-pair { display: flex; align-items: center; gap: 3px; justify-content: center; }
.time-sep { color: var(--rule); font-size: 11px; flex-shrink: 0; } .time-sep { color: var(--rule); font-size: 11px; flex-shrink: 0; }
.time-input { .time-input {
width: 70px; width: 78px;
padding: .28rem .35rem; padding: .28rem .3rem;
border: 1px solid var(--rule); border: 1px solid var(--rule);
border-radius: 0; border-radius: 0;
font-family: var(--mono); font-family: var(--mono);
font-size: 12px; font-size: 12px;
color: var(--text); color: var(--text);
background: transparent; background: transparent;
text-align: center; text-align: left;
transition: border-color .15s; transition: border-color .15s;
} }
.time-input:hover { border-color: var(--muted); } .time-input:hover { border-color: var(--muted); }
.time-input:focus { outline: none; border-color: var(--accent); background: #fff; } .time-input:focus { outline: none; border-color: var(--accent); background: #fff; }
/* L'icône d'horloge native a une largeur fixe qui, avec un champ centré trop
étroit, empiète sur le dernier chiffre : on aligne le texte à gauche et on
resserre le padding de l'icône plutôt que de lui laisser sa marge par défaut. */
.time-input::-webkit-calendar-picker-indicator {
margin-left: .2rem;
padding: 1px;
}
tr.htmx-request .time-input { opacity: .4; } tr.htmx-request .time-input { opacity: .4; }
.col-calc { text-align: right; padding-left: .5rem; } .col-calc { text-align: right; padding-left: .5rem; }
@ -421,7 +428,7 @@
.pointage-table td.c-matin .td-fill, .pointage-table td.c-aprem .td-fill { .pointage-table td.c-matin .td-fill, .pointage-table td.c-aprem .td-fill {
padding: .55rem .75rem; padding: .55rem .75rem;
} }
.pointage-table .time-input { width: 84px; font-size: 14px; padding: .45rem .4rem; } .pointage-table .time-input { width: 98px; font-size: 14px; padding: .45rem .4rem; }
.pointage-table td.col-calc, .pointage-table td.col-calc,
.pointage-table td.col-cumul, .pointage-table td.col-cumul,