fork from github/youtube-local

youtube/templates/home.html

@@ -0,0 +1,82 @@
+{% set page_title = title %}
+{% extends "base.html" %}
+{% block style %}
+    ul {
+        background-color: var(--interface-color);
+        padding: 20px;
+        width: 400px;
+        max-width: 100%;
+        margin: auto;
+        margin-top: 20px;
+    }
+        li {
+            margin-bottom: 10px;
+        }
+    .recommended {
+        max-width: 1200px;
+        margin: 40px auto;
+        display: flex;
+        flex-wrap: wrap;
+        gap: 24px;
+        justify-content: center;
+    }
+    .video-card {
+        background: var(--interface-color);
+        border-radius: 8px;
+        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
+        width: 320px;
+        overflow: hidden;
+        text-align: left;
+        transition: box-shadow 0.2s;
+    }
+    .video-card:hover {
+        box-shadow: 0 4px 16px rgba(0,0,0,0.16);
+    }
+    .video-thumb {
+        width: 100%;
+        height: 180px;
+        object-fit: cover;
+        display: block;
+    }
+    .video-info {
+        padding: 12px 16px;
+    }
+    .video-title {
+        font-size: 1.1em;
+        font-weight: bold;
+        margin-bottom: 6px;
+        color: var(--text-color);
+        text-decoration: none;
+    }
+    .video-meta {
+        color: #888;
+        font-size: 0.95em;
+    }
+{% endblock style %}
+{% block main %}
+    <ul>
+        <li><a href="/youtube.com/playlists">Local playlists</a></li>
+        <li><a href="/youtube.com/subscriptions">Subscriptions</a></li>
+        <li><a href="/youtube.com/subscription_manager">Subscription Manager</a></li>
+        <li><a href="/youtube.com/settings">Settings</a></li>
+    </ul>
+    {% if recommended_videos %}
+    <h2 style="text-align:center;margin-top:40px;">Recommended Videos</h2>
+    <div class="recommended">
+        {% for video in recommended_videos %}
+        <div class="video-card">
+            <a href="/watch?v={{ video.videoId }}">
+                <img class="video-thumb" src="{{ video.thumbnail.thumbnails[-1].url }}" alt="Thumbnail">
+            </a>
+            <div class="video-info">
+                <a class="video-title" href="/watch?v={{ video.videoId }}">{{ video.title.runs[0].text }}</a>
+                <div class="video-meta">
+                    {{ video.ownerText.runs[0].text }}<br>
+                    {{ video.viewCountText.simpleText if video.viewCountText else '' }}
+                </div>
+            </div>
+        </div>
+        {% endfor %}
+    </div>
+    {% endif %}
+{% endblock main %}