Webstar/LibrePortal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge claude/1

Browse Source
This commit is contained in:
librelad 2026-05-28 00:17:02 +01:00
commit 081e15dcf2
1 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
containers/libreportal/frontend/css/apps.css
View File

@ -8,20 +8,24 @@
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--app-min), 1fr)); grid-template-columns: repeat(auto-fill, minmax(var(--app-min), 1fr));
gap: var(--app-gap); gap: var(--app-gap);
margin: 22px auto; margin: 22px;
padding: 22px; padding: 22px;
background: rgba(var(--text-rgb), 0.025); background: rgba(var(--text-rgb), 0.025);
border: 1px solid var(--border-subtle); border: 1px solid var(--border-subtle);
border-radius: 16px; border-radius: 16px;
/* Shrink the glass box to exactly the visible-card count so a row with /* Shrink the glass box to exactly the visible-card count so a row with
two apps doesn't leave a card-shaped hole on the right. --app-count two apps doesn't leave a card-shaped hole on the right. --app-count
is set from apps-manager.js (render + search filter); the 100%-44px is set from apps-manager.js (render + search filter). Box is
cap keeps the same 22px symmetric gap from the layout edges when left-aligned (margin: 22px, not auto) so cards stay where they were
there are enough cards to fill the row. Default 99 = no cap until before the cap was introduced — the box just shortens on the right.
JS reports a real count. */ The 100%-44px cap honours the same 22px gutter at full width. The
formula is the outer width under border-box (the global default from
style.css:4): N*min + (N-1)*gap + 44px padding + 2px border + 2px
buffer for sub-pixel rounding so 2 cards reliably stay on one row.
Default 99 = no cap until JS reports a real count. */
max-width: min( max-width: min(
calc(100% - 44px), calc(100% - 44px),
calc(var(--app-count, 99) * var(--app-min) + (var(--app-count, 99) - 1) * var(--app-gap) + 44px) calc(var(--app-count, 99) * var(--app-min) + (var(--app-count, 99) - 1) * var(--app-gap) + 48px)
); );
} }