Corrige trois régressions du restyling du formulaire de ligne comptable
- Le select "Type de ligne" affichait un chevron géant répété (le
shorthand `background: transparent` sur input/select/textarea
réinitialisait aussi position/repeat/size de Claro, transformant sa
flèche unique alignée à droite en motif carrelé). Les select gardent
maintenant leur background Claro intact.
- Les menus "Toggle Actions" (⋮) de la Répartition étaient ouverts en
permanence : mon display:flex écrasait le display:none par défaut de
Claro, cassant le toggle piloté par paragraphs.actions.js. Rescopé à
`.paragraphs-dropdown.open .paragraphs-dropdown-actions`.
- Marges resserrées : le `.form-item { margin-block: 1.5rem }` de Claro
s'ajoutait à notre propre grid-gap. Neutralisé (`margin-block: 0`), et
gap/paddings réduits.
This commit is contained in:
@@ -26,12 +26,18 @@
|
||||
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 0.9rem 1rem;
|
||||
gap: 0.5rem 1rem;
|
||||
max-width: 44rem;
|
||||
margin: 0 auto;
|
||||
padding: 0.15rem 0.1rem 0.5rem;
|
||||
color: var(--flform-text);
|
||||
}
|
||||
/* Claro gives every .form-item a large margin-block (1.5rem, meant for a
|
||||
form with one field per row) -- with our own grid `gap` now doing that
|
||||
job, this just doubles up the spacing between rows. */
|
||||
.figli-ledger-form .form-item {
|
||||
margin-block: 0;
|
||||
}
|
||||
html.gin--dark-mode .figli-ledger-form {
|
||||
--flform-border: #3d3e42;
|
||||
--flform-border-soft: #333438;
|
||||
@@ -92,11 +98,20 @@ html.gin--dark-mode .figli-ledger-form {
|
||||
box-sizing: border-box;
|
||||
border: 1px solid var(--flform-border);
|
||||
border-radius: 6px;
|
||||
padding: 0.4rem 0.55rem;
|
||||
padding: 0.32rem 0.5rem;
|
||||
font-size: 0.88rem;
|
||||
background: transparent;
|
||||
color: var(--flform-text);
|
||||
}
|
||||
/* Not select: Claro positions its dropdown-chevron background-image via
|
||||
background-position/-repeat/-size, which the `background` shorthand
|
||||
below would silently reset to their initial values (top-left,
|
||||
repeating) -- that turned the single right-aligned arrow into a tiled
|
||||
pattern smeared across the whole field. Selects keep Claro's own
|
||||
background untouched; only the border/radius/padding above apply. */
|
||||
.figli-ledger-form input.form-element,
|
||||
.figli-ledger-form textarea.form-element {
|
||||
background: transparent;
|
||||
}
|
||||
.figli-ledger-form input.form-element:focus,
|
||||
.figli-ledger-form select.form-element:focus,
|
||||
.figli-ledger-form textarea.form-element:focus {
|
||||
@@ -130,10 +145,10 @@ html.gin--dark-mode .figli-ledger-form {
|
||||
}
|
||||
.figli-ledger-form table.field-multiple-table thead th {
|
||||
text-align: left;
|
||||
padding: 0.5rem 0.6rem 0.35rem;
|
||||
padding: 0.4rem 0.6rem 0.25rem;
|
||||
}
|
||||
.figli-ledger-form table.field-multiple-table tbody td {
|
||||
padding: 0.5rem 0.6rem;
|
||||
padding: 0.35rem 0.6rem;
|
||||
vertical-align: top;
|
||||
border-top: 1px solid var(--flform-border-soft);
|
||||
}
|
||||
@@ -181,7 +196,13 @@ html.gin--dark-mode .figli-ledger-form {
|
||||
.figli-ledger-form .paragraphs-dropdown-toggle:hover {
|
||||
color: var(--flform-accent);
|
||||
}
|
||||
.figli-ledger-form .paragraphs-dropdown-actions {
|
||||
/* Closed by default (Claro's own paragraphs.actions.css already sets
|
||||
display: none here and toggles a sibling .open class on click via
|
||||
paragraphs.actions.js) -- only restyle the panel's look, and only once
|
||||
Drupal's own JS has actually opened it. Getting this wrong (e.g.
|
||||
forcing `display: flex` unconditionally here) makes every "Toggle
|
||||
Actions" menu render permanently expanded. */
|
||||
.figli-ledger-form .paragraphs-dropdown.open .paragraphs-dropdown-actions {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.2rem;
|
||||
|
||||
Reference in New Issue
Block a user