fix(mapari-mobil): butoane Salveaza/Sterge vizibile + carduri compacte la 390px

Doua probleme raportate de user pe pagina Mapari pe mobil (screenshot 390px):

1. Butoanele Salveaza/Sterge taiate: regula `.tabel-card td button {width:100%}`
   (specificitate 0,1,2) batea `.act {width:44px}` (0,1,0), deci cele doua butoane
   .act deveneau full-width si al doilea (Sterge) iesea din card (celula are nowrap).
   Fix: bloc @media (max-width:767px) nou, ultimul in <style> (castiga pe cascada) —
   celula Actiuni devine flex-row, butoanele .act width:auto/flex:1 cu text vizibil.

2. Carduri prea inalte + label-uri inutile: .tabel-card randa etichetele data-eticheta
   ca pseudo-titluri + linia redundanta "acum: COD — nume" (duplica select-ul de sub).
   Fix: pe mobil se ascund pseudo-etichetele si linia .map-acum, padding strans.
   Cardul trece de la ~7 la ~3 elemente. Atributele data-eticheta raman in DOM (a11y+teste).

Include si raportul de comparatie UI 5.16 cu appendix-ul /autoplan (CEO/Design/Eng,
audit trail, plan aprobat) + addendum cu corectia la sectiunea 8 ("Mapari conform" era
gresit: nu testase randarea mobila a paginilor actionabile).

Verificare: 80 teste web verzi (test_web_responsive + mapari + submissions + tabs + modal);
confirmare vizuala la 390px (render TestClient -> screenshot Playwright).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Agent
2026-06-29 08:18:27 +00:00
parent 80d90f317d
commit e1243f603e
3 changed files with 560 additions and 1 deletions

View File

@@ -763,6 +763,32 @@
.trimitere-slim { padding:12px 14px; }
}
/* === SENTINEL-COMPONENTE-SLIM: sfarsit componente slim US-002 === */
/* === Fix mobil Mapari (bug live 2026-06-29) ===
Doua probleme raportate la 390px pe pagina Mapari:
(1) butoanele Salveaza/Sterge taiate: regula `.tabel-card td button {width:100%}`
(specificitate 0,1,2) batea `.act {width:44px}` (0,1,0) -> cele doua butoane act
deveneau full-width si al doilea (Sterge) iesea din card (celula are nowrap).
(2) carduri prea inalte: etichetele data-eticheta randate ca pseudo-titluri +
linia redundanta "acum: COD — nume" (duplica select-ul de dedesubt).
Plasat ultimul in <style> => castiga pe cascada la specificitate egala.
Atributele data-eticheta raman in DOM (a11y + teste); doar pseudo-eticheta se ascunde. */
@media (max-width:767px) {
/* Carduri Mapari compacte: fara etichete-zgomot (continutul e auto-descriptiv,
ca la cardul de trimiteri), padding strans. */
.tabel-card td::before { display:none; }
.tabel-card tr { padding:9px 12px; margin-bottom:8px; }
.tabel-card td { padding:3px 0; }
/* "acum: COD — nume" e redundant cu select-ul de dedesubt (aceeasi valoare). */
.map-acum { display:none; }
/* Celula Actiuni: butoanele act pe UN rand, vizibile, cu text (nu iconita-only
ambigua, nu full-width care impinge al doilea buton afara cardului).
`.tabel-card td .act` (0,2,1) > `.tabel-card td button` (0,1,2). */
.tabel-card td[data-eticheta="Actiuni"] { display:flex; gap:8px; align-items:stretch;
margin-top:2px; }
.tabel-card td .act { width:auto; flex:1 1 0; min-width:0; min-height:44px; padding:8px 12px; }
.tabel-card td .act .act-tx { display:inline; }
.tabel-card td .act .act-ic { display:inline-block; }
}
</style>
</head>
<body>