Fix actions column layout: display:flex on a <td> broke the table

display: flex on td.actions-col was fighting the table's own
column-width calculation -- a ~55px gap opened up between the actions
column and Date, and the buttons rendered outside their cell's actual
boundary. Buttons go back to sitting inline (already inline-flex
individually) inside a plain table-cell, spaced with a margin on the
first one instead of a flex gap on the container.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-04 12:44:24 +02:00
co-authored by Claude Sonnet 5
parent f3ce872b02
commit 5f4ec4dbee
@@ -202,14 +202,13 @@ html.gin--dark-mode #figli-home-app {
#figli-home-app th.actions-col {
width: 1%;
text-align: center;
white-space: nowrap;
}
#figli-home-app td.actions-col {
display: flex;
gap: 0.15rem;
justify-content: center;
}
/* Buttons stay inline (not flex) inside the <td> -- display: flex on a
table cell breaks the table's own column-width calculation (observed:
a ~55px gap opening up between this column and the next, and the
buttons rendering outside their cell's actual boundary). */
#figli-home-app .figli-edit-btn,
#figli-home-app .figli-link-btn {
display: inline-flex;
@@ -223,6 +222,11 @@ html.gin--dark-mode #figli-home-app {
border-radius: 4px;
color: var(--figli-text-light);
cursor: pointer;
vertical-align: middle;
}
#figli-home-app .figli-link-btn {
margin-right: 0.15rem;
}
#figli-home-app .figli-edit-btn:hover,