snw/bot_pozhitki
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Detach leaderboard switch from animated view

Browse source
This commit is contained in:
Codex 2026-09-07 21:14:00 +00:00
parent 3e27ee7263
commit e1b91a2bed
2 changed files with 10 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
static/index.html
View file

@ -6,7 +6,7 @@
<meta name="color-scheme" content="dark" />
<meta name="theme-color" content="#111111" />
<title>Пожитки</title>
<link rel="stylesheet" href="./styles.css?v=15" />
<link rel="stylesheet" href="./styles.css?v=16" />
<script src="./telegram-web-app.js"></script>
<script src="./app.js?v=15" defer></script>
</head>
@ -106,10 +106,6 @@
<div><p class="eyebrow">Сберегательный рейтинг</p><h2>Лидерборд</h2></div>
<button id="shareButton" class="icon-button" type="button" aria-label="Пригласить друга">↗</button>
</div>
<div class="board-switch" role="tablist">
<button id="allBoardButton" class="active" type="button">Все</button>
<button id="friendsBoardButton" type="button">Друзья</button>
</div>
<label class="leader-filter">
<span>Категория</span>
<select id="leaderboardCategory">
@ -122,6 +118,11 @@
</div>
</main>
<div class="board-switch" role="tablist" aria-label="Тип лидерборда">
<button id="allBoardButton" class="active" type="button">Все</button>
<button id="friendsBoardButton" type="button">Друзья</button>
</div>
<nav class="bottom-nav" aria-label="Основная навигация">
<div class="nav-tabs">
<button id="dashboardTab" class="active" data-view="dashboardView"><span>◫</span>Обзор</button>

7
static/styles.css
View file

@ -179,13 +179,14 @@ h2 { margin: 0; font-size: 23px; letter-spacing: -.025em; }
.board-heading { align-items: center; margin-top: 5px; margin-bottom: 20px; }
.icon-button { width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); color: var(--link); font-size: 21px; }
.board-switch { position: fixed; z-index: 9; bottom: calc(max(12px, calc(var(--app-safe-bottom) + 8px)) + 64px); left: 50%; width: fit-content; margin: 0; padding: 5px; border: 1px solid var(--line); border-radius: 999px; transform: translateX(-50%); box-shadow: var(--shadow); backdrop-filter: blur(50px); -webkit-backdrop-filter: blur(50px); }
.board-switch { position: fixed; z-index: 9; bottom: calc(max(12px, calc(var(--app-safe-bottom) + 8px)) + 64px); left: 50%; display: none; width: fit-content; margin: 0; padding: 5px; border: 1px solid var(--line); border-radius: 999px; transform: translateX(-50%); box-shadow: var(--shadow); backdrop-filter: blur(50px); -webkit-backdrop-filter: blur(50px); }
.leaderboard-open .board-switch { display: grid; }
.board-switch button { min-width: 84px; padding: 8px 14px; border-radius: 999px; }
.board-switch button.active { color: var(--accent); background: transparent; box-shadow: none; }
.leader-filter { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; margin: 0 3px 13px; color: var(--muted); font-size: 11px; font-weight: 700; }
.leader-filter select { width: 100%; min-height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 12px; outline: none; background: var(--surface); }
.leaderboard-list { overflow: hidden; min-height: 100px; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); }
.leaderboard-list.loading { padding: 30px; color: var(--muted); text-align: center; font-size: 13px; }
.leaderboard-list { overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); }
.leaderboard-list.loading { min-height: 100px; padding: 30px; color: var(--muted); text-align: center; font-size: 13px; }
.leader-row { display: grid; grid-template-columns: 25px 42px 1fr auto; align-items: center; gap: 10px; padding: 13px 14px; border-bottom: 1px solid var(--line); }
.leader-row:last-child { border-bottom: 0; }
.leader-row.me { background: color-mix(in srgb, var(--accent) 9%, var(--surface)); }