marty/instantadpay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Campaigns list: stacked cards on phones with the buttons at the bottom, no sideways scroll (Jim, 2026-09-15)

Browse Source 
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-09-15 04:37:43 -05:00
parent f155a8cc24
commit a19a3fc31e
3 changed files with 26 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/assets/site.css
+15
View File
@@ -713,3 +713,18 @@ img{max-width:100%}
.tk-table{width:100%;border-collapse:collapse;font-size:13px} .tk-table th,.tk-table td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line)} .tk-table th{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)} .tk-table td.n{font-variant-numeric:tabular-nums;text-align:right} .tk-table th.n{text-align:right} .tk-table tr.best td{color:var(--mint)}
.tk-team{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:6px 0;font-size:13px;display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between} .tk-team .who b{font-weight:600} .tk-team .who span{color:var(--muted);font-size:12px} .tk-team.stalled{border-color:rgba(255,209,92,.45)}
.tk-nudge{width:100%;margin:8px 0 0;padding:8px 12px;border:1px dashed var(--line);border-radius:10px;font-size:13px}
/* campaigns list on phones: each row becomes a card, buttons at the bottom, no sideways scroll (Jim, 2026-09-15) */
@media (max-width:720px){
.tablewrap:has(.camp-table){overflow:visible}
.camp-table{display:block;width:100%;border-collapse:separate}
.camp-table thead{display:none}
.camp-table tbody{display:block}
.camp-table tr{display:block;border:1px solid var(--line);border-radius:12px;padding:10px 12px 12px;margin:0 0 10px;background:var(--panel)}
.camp-table td{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:5px 0;border:0;text-align:left;max-width:100%;overflow:hidden}
.camp-table td.num{text-align:right;font-variant-numeric:tabular-nums}
.camp-table td::before{content:attr(data-l);color:var(--muted);font-size:11px;letter-spacing:.06em;text-transform:uppercase;flex:0 0 auto}
.camp-table td:first-child{display:block;padding:0 0 6px;font-size:16px} .camp-table td:first-child::before{display:none}
.camp-table td:first-child > *{max-width:100%}
.camp-table td.act{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px;margin-top:8px;padding-top:10px;border-top:1px solid var(--line)} .camp-table td.act::before{display:none}
.camp-table td.act .btn{flex:1 1 auto;text-align:center}
}