UI is largely working

web/frag-index.go.html

@@ -0,0 +1,32 @@
+{{- /*gotype: vivaplusdl.VideoInfoVM*/}}
+{{define "frag-index"}}
+<div class="video-box">
+	<div class="thumbnail-container">
+		<a href="/video/{{.ID}}">
+			<img src="{{.Thumbnail}}" alt="Thumbnail" class="video-thumbnail" />
+			<div class="play-button">
+				<span class="play-symbol">▶</span>
+			</div>
+		</a>
+	</div>
+	<div class="video-info">
+		<h2 class="video-title">{{.Title}}</h2>
+		<p class="video-description">{{.Description}}</p>
+		<div class="video-actions">
+			<a href="/video/{{.ID}}" class="watch-button">Watch Now</a>
+			<form hx-boost="true" method="post" action="{{if .IsWatched}}/mark-unwatched/{{.ID}}{{else}}/mark-watched/{{.ID}}{{end}}">
+				<button type="submit" class="mark-watched">
+					{{if .IsWatched}}
+					Mark as Unwatched
+					{{else}}
+					Mark as Watched
+					{{end}}
+				</button>
+			</form>
+			{{if ne .PreviousID 0}}
+			<a href="/?video={{.PreviousID}}" class="mark-watched">Show Previous</a>
+			{{end}}
+		</div>
+	</div>
+</div>
+{{end}}