peterstockings/Stride
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace large personal record cards with compact badges

Browse Source
This commit is contained in:
Peter Stockings
2026-10-02 14:45:52 +10:00
parent 5830976e31
commit c99d51336c
3 changed files with 13 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/static/style.css
+10 -5
View File
@@ -27,11 +27,16 @@ body{font-family:"Segoe UI",Arial,sans-serif}h1{font-weight:650;letter-spacing:-
.sidebar .sidebar-bottom{margin-top:auto}
.records-panel { margin-bottom: 24px; }
.records-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.record-card { display: flex; flex-direction: column; gap: 8px; padding: 16px; border: 1px solid #394246; border-radius: 8px; color: inherit; text-decoration: none; }
.record-card > span { color: #a0aaac; font-size: 13px; }
.record-card > strong { font-size: 27px; }
.record-card > small { color: #a0aaac; overflow-wrap: anywhere; }
.compact-records { padding: 16px 20px; }
.compact-records .section-head { margin-bottom: 12px; }
.compact-records .section-head h2 { font-size: 16px; }
.record-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.record-badge { display: inline-flex; align-items: center; gap: 9px; padding: 8px 11px; border: 1px solid #394246; border-radius: 6px; color: #c5cccc; background: #202629; font-size: 12px; text-decoration: none; }
.record-badge strong { font-size: 15px; color: #eeeae4; font-variant-numeric: tabular-nums; }
.record-badge.is-pr { border-color: #886b34; background: #30291e; }
.badge-award { color: #f3cb78; font-size: 11px; font-weight: 600; }
a.record-badge:hover { border-color: #f3cb78; background: #3a3020; }
a.record-badge:focus-visible { outline: 2px solid #f3cb78; outline-offset: 3px; }
.run-badges { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.run-badges:empty { display: none; }
.pr-badge { display: inline-block; border: 1px solid #886b34; border-radius: 4px; padding: 3px 6px; color: #f3cb78; background: #3a3020; font-size: 11px; font-weight: 600; }