Gaming/the-button
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Achievements

Browse Source
This commit is contained in:
eric
2026-10-21 13:19:43 -04:00
parent f9afa8ccbe
commit a9f578571c
6 changed files with 260 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+15
View File
@@ -202,6 +202,21 @@ details[open] summary { margin-bottom: 1rem; }
.rival-card #my-rival-title { margin: 0.8rem 0 0.4rem; font-size: 1rem; color: var(--lavender); overflow-wrap: anywhere; }
#my-rival-description { font-size: 0.85rem; color: var(--text); margin: 0; }
.rival-card .fine-print { font-size: 0.65rem; margin-bottom: 0; }
.achievements-heading { margin: 1.75rem 0 0.5rem; }
.achievements-heading .subheading { margin: 0; }
.achievement-list { display: grid; gap: 0.7rem; list-style: none; margin: 1rem 0; padding: 0; }
.achievement-card { display: flex; align-items: flex-start; gap: 0.85rem; padding: 1rem; background: var(--base); border: 1px solid var(--surface); border-radius: 12px; }
.achievement-icon { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 11px; color: var(--subtext); background: var(--surface); font-size: 1.1rem; }
.achievement-content { flex: 1; min-width: 0; }
.achievement-title { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 0.4rem; }
.achievement-title h4 { margin: 0; color: var(--text); font-size: 0.85rem; }
.achievement-state { color: var(--subtext); font-size: 0.65rem; }
.achievement-content p { color: var(--subtext); font-size: 0.75rem; margin: 0.3rem 0; line-height: 1.6; }
.achievement-content small { display: block; color: var(--subtext); font-size: 0.65rem; overflow-wrap: anywhere; }
.achievement-content progress { display: block; width: 100%; height: 5px; margin-top: 0.7rem; accent-color: var(--mauve); }
.achievement-card.is-unlocked { border-color: #a6e3a135; background: linear-gradient(110deg, #a6e3a108, transparent), var(--base); }
.is-unlocked .achievement-icon { background: #a6e3a118; color: var(--green); }
.is-unlocked .achievement-state { color: var(--green); }
#my-subscribed { padding: 0.65rem; border-radius: 8px; background: #a6e3a110; color: var(--green); font-size: 0.75rem; }
#leaderboard-status:empty { display: none; }