Context menu

.popover, compact. O treaptă în jos pe fiecare axă — suprafață, rând, padding, text — fiindcă apare sub cursor, peste conținut dens.

Markup canonic · components/context-menu.json

sursa = JSON · generat de scripts/build-catalog.py

Ce se schimbă față de .popover

Axă.popover.popover.compact
Radius suprafață--r-lg 20px--r-md 14px
Padding suprafață6px4px
Radius rând--r-md 14px--r-sm 10px
Padding rând8px 10px6px 8px
Text14px / 20px14px / 20px — identic
min-width200px168px

Culorile, stările, hover-ul și tipul nu se schimbă — e aceeași componentă la altă densitate structurală, nu alta. Radiusul urmează aceeași geometrie ca în popover-ul implicit: 14 − 4 = 10, adică exact --r-sm pe rând, cum 20 − 6 = 14 dă --r-md în varianta default.

Când compact

.popover se deschide dintr-un câmp sau un buton, ancorat sub el, pe lățimea paginii. .popover.compact se deschide din click-dreapta sau un „…" pe un rând — e ancorat de conținut dens, deci ține o coloană mai îngustă și își strânge rândurile mai aproape.

De ce nu mai e 13px

Revizuit 2026-09-02. Regula veche cobora fiecare axă cu o treaptă, tipul inclus: rând 14→13, etichetă 11→10. Motivul înregistrat era că meniul apare sub cursor, peste conținut dens, deci trebuie să ocupe mai puțin.

Treapta de tip nu se susține. Popover, dropdown menu, listă de select și meniu de context sunt un singur container cu un singur fel de rând; ce diferă e declanșatorul — un câmp, un buton, un click-dreapta. Un rând de meniu e un menu-item la tipul paginii oriunde ar fi deschis, iar 13px era o a doua mărime de citire pentru același obiect. Ce rămâne e densitatea structurală: .popover.compact nu mai poartă niciun font-size.