refactor: replace followed youtubers

feat:       switch site style to dark mode
This commit is contained in:
2026-01-30 16:49:32 +08:00
parent 21cae2336c
commit 12878d6e1c
14 changed files with 401 additions and 128 deletions

View File

@@ -22,7 +22,7 @@
<div class="header-center">
<div class="search-container">
<input type="text" class="search-input" placeholder="搜索">
<input type="text" class="search-input" placeholder="Search">
<button class="search-btn">
<i class="fas fa-search"></i>
</button>
@@ -35,7 +35,7 @@
<div class="header-right">
<button class="create-btn">
<i class="fas fa-plus"></i>
<span>创建</span>
<span>Create</span>
</button>
<button class="notification-btn">
<i class="fas fa-bell"></i>
@@ -54,17 +54,17 @@
<div class="nav-section">
<button class="nav-btn active">
<i class="fas fa-home"></i>
<span>首页</span>
<span>Home</span>
</button>
<button class="nav-btn">
<i class="fas fa-play"></i>
<i class="fas fa-play-circle"></i>
<span>Shorts</span>
</button>
</div>
<div class="nav-section">
<div class="nav-section-title">
<span>订阅</span>
<span>Subscriptions</span>
<i class="fas fa-chevron-right"></i>
</div>
<div class="subscriptions-list">
@@ -74,59 +74,59 @@
<div class="nav-section">
<div class="nav-section-title">
<span></span>
<span>My YouTube</span>
</div>
<button class="nav-btn">
<i class="fas fa-history"></i>
<span>历史记录</span>
<span>History</span>
</button>
<button class="nav-btn">
<i class="fas fa-list"></i>
<span>播放列表</span>
<span>Playlists</span>
</button>
<button class="nav-btn">
<i class="fas fa-clock"></i>
<span>稍后再看</span>
<span>Later</span>
</button>
<button class="nav-btn">
<i class="fas fa-thumbs-up"></i>
<span>赞过的视频</span>
<span>Liked Videos</span>
</button>
<button class="nav-btn">
<i class="fas fa-video"></i>
<span>我的视频</span>
<span>My Videos</span>
</button>
</div>
<div class="nav-section">
<div class="nav-section-title">
<span>探索</span>
<span>Explore</span>
</div>
<button class="nav-btn">
<i class="fas fa-music"></i>
<span>音乐</span>
<span>Music</span>
</button>
<button class="nav-btn">
<i class="fas fa-film"></i>
<span>电影</span>
<span>Films</span>
</button>
<button class="nav-btn">
<i class="fas fa-video"></i>
<span>直播</span>
<span>Live</span>
</button>
</div>
<div class="nav-section">
<div class="nav-section-title">
<span>更多 YouTube 产品与功能</span>
<span>More YouTube Products & Features</span>
</div>
<button class="nav-btn">
<i class="fas fa-crown"></i>
<span>YouTube Premium</span>
<span>YouTube Premium</span>
</button>
<button class="nav-btn">
<i class="fas fa-store"></i>
<span>YouTube 工作室</span>
<span>YouTube Studio</span>
</button>
<button class="nav-btn">
<i class="fas fa-music"></i>
@@ -141,19 +141,19 @@
<div class="nav-section">
<button class="nav-btn">
<i class="fas fa-cog"></i>
<span>设置</span>
<span>Settings</span>
</button>
<button class="nav-btn">
<i class="fas fa-flag"></i>
<span>举报记录</span>
<span>Report History</span>
</button>
<button class="nav-btn">
<i class="fas fa-question-circle"></i>
<span>帮助</span>
<span>Help</span>
</button>
<button class="nav-btn">
<i class="fas fa-comment"></i>
<span>发送反馈</span>
<span>Send Feedback</span>
</button>
</div>
</nav>
@@ -169,16 +169,16 @@
<div class="video-content">
<!-- 板块按钮 -->
<div class="category-buttons">
<button class="category-btn active">全部</button>
<button class="category-btn">音乐</button>
<button class="category-btn">游戏</button>
<button class="category-btn">直播</button>
<button class="category-btn">合辑</button>
<button class="category-btn">动画</button>
<button class="category-btn">手工艺品</button>
<button class="category-btn">最近上传</button>
<button class="category-btn">已观看</button>
<button class="category-btn">发现新视频</button>
<button class="category-btn active">All</button>
<button class="category-btn">Music</button>
<button class="category-btn">Game</button>
<button class="category-btn">Live</button>
<button class="category-btn">Album</button>
<button class="category-btn">Animation</button>
<button class="category-btn">Art</button>
<button class="category-btn">Recently Uploaded</button>
<button class="category-btn">Watched</button>
<button class="category-btn">New</button>
</div>
<!-- 横屏视频 -->