mirror of
https://github.com/ZHANGTIANYAO1/teamspeak-music-bot.git
synced 2026-10-02 04:52:50 +08:00
feat(web): mobile-responsive redesign with Library view and design tokens
Add mobile layout (mini player, bottom tab bar, responsive navbar), new Library view, redesigned bot dropdown with action buttons, and centralize colors/typography/shadows into CSS variables in variables.scss. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
1bd6ab9975
commit
1552fa1a39
11 files changed
+684
-139
No files matched your search
@@ -63,7 +63,7 @@ function formatDuration(seconds: number): string {
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: rgba(51, 94, 234, 0.1);
|
||||
background: var(--color-primary-10);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -96,31 +96,31 @@ function formatDuration(seconds: number): string {
|
||||
|
||||
.platform-badge {
|
||||
flex-shrink: 0;
|
||||
font-size: 10px;
|
||||
font-weight: 600;
|
||||
font-size: var(--fs-micro);
|
||||
font-weight: var(--fw-semi);
|
||||
padding: 1px 5px;
|
||||
border-radius: 3px;
|
||||
border-radius: var(--radius-xs);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.badge-netease {
|
||||
background: rgba(232, 17, 35, 0.15);
|
||||
color: #e81123;
|
||||
background: var(--brand-netease-15);
|
||||
color: var(--brand-netease);
|
||||
}
|
||||
|
||||
.badge-qq {
|
||||
background: rgba(18, 183, 106, 0.15);
|
||||
color: #12b76a;
|
||||
background: var(--brand-qq-15);
|
||||
color: var(--brand-qq);
|
||||
}
|
||||
|
||||
.badge-bilibili {
|
||||
background: rgba(0, 161, 214, 0.15);
|
||||
color: #00a1d6;
|
||||
background: var(--brand-bilibili-15);
|
||||
color: var(--brand-bilibili);
|
||||
}
|
||||
|
||||
.badge-youtube {
|
||||
background: rgba(255, 0, 0, 0.12);
|
||||
color: #ff0000;
|
||||
background: var(--brand-youtube-12);
|
||||
color: var(--brand-youtube);
|
||||
}
|
||||
|
||||
.song-artist {
|
||||
|
||||
Reference in new issue
Block a user