BPPP/smb-online
2
0
Fork 0
Code Issues 15 Pull Requests Actions Packages Projects Releases Wiki Activity

Dashboard: full-width tables, no horizontal scrollbar

Browse Source 
Remove the 1280px content cap and the table's overflow scroll; let cells wrap
(word-break) instead of forcing a horizontal scrollbar, so rows span the full
screen width and show full values.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
rogalik27
2026-06-25 09:41:21 +02:00
parent 10fea59e05
commit b84a5d4c6f
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backoffice/app/static/index.html
+6 -6
View File
@@ -18,7 +18,7 @@
display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 5; } display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 5; }
header h1 { font-size: 1.15rem; margin: 0; } header h1 { font-size: 1.15rem; margin: 0; }
header .src { font-size: .74rem; color: var(--muted); font-weight: 500; } header .src { font-size: .74rem; color: var(--muted); font-weight: 500; }
.wrap { max-width: 1280px; margin: 0 auto; padding: 22px 24px 60px; } .wrap { max-width: none; margin: 0; padding: 22px 24px 60px; }
.tabs { display: flex; gap: 8px; margin-bottom: 18px; } .tabs { display: flex; gap: 8px; margin-bottom: 18px; }
.tab { background: var(--surface); border: 1px solid var(--line); border-radius: 999px; .tab { background: var(--surface); border: 1px solid var(--line); border-radius: 999px;
padding: 9px 18px; font-size: .9rem; font-weight: 600; color: var(--muted); cursor: pointer; } padding: 9px 18px; font-size: .9rem; font-weight: 600; color: var(--muted); cursor: pointer; }
@@ -31,12 +31,12 @@
font: inherit; font-size: .88rem; font-weight: 600; cursor: pointer; } font: inherit; font-size: .88rem; font-weight: 600; cursor: pointer; }
.btn.ghost { background: var(--surface); color: var(--teal-2); border: 1px solid var(--line); } .btn.ghost { background: var(--surface); color: var(--teal-2); border: 1px solid var(--line); }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; .card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px;
box-shadow: var(--shadow); overflow: auto; } box-shadow: var(--shadow); overflow: hidden; }
table { width: 100%; border-collapse: collapse; font-size: .85rem; } table { width: 100%; border-collapse: collapse; font-size: .85rem; table-layout: auto; }
th, td { text-align: left; padding: 10px 13px; border-bottom: 1px solid var(--line); white-space: nowrap; } th, td { text-align: left; padding: 10px 13px; border-bottom: 1px solid var(--line); white-space: normal; }
th { background: #f0f5f4; color: var(--muted); font-size: .72rem; text-transform: uppercase; th { background: #f0f5f4; color: var(--muted); font-size: .72rem; text-transform: uppercase;
letter-spacing: .5px; position: sticky; top: 0; } letter-spacing: .5px; }
td { max-width: 280px; overflow: hidden; text-overflow: ellipsis; } td { vertical-align: top; word-break: break-word; }
tr:hover td { background: #fafdfc; } tr:hover td { background: #fafdfc; }
.pillv { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: .74rem; font-weight: 600; .pillv { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: .74rem; font-weight: 600;
background: var(--teal-soft); color: var(--teal-2); } background: var(--teal-soft); color: var(--teal-2); }