From c0549ab262a307455d7303814cbb179e72741661 Mon Sep 17 00:00:00 2001
From: "4 raccoons in a trenchcoat. / luna vivian" <nightlyonie@airmail.cc>
Date: Thu, 20 Apr 2023 12:43:14 +0200
Subject: [PATCH] redesigned playlist section (and moved it up in the process)
 fixes issue #17

sometimes, the thinking sand in our white or black boxes (which we often
call CPU's) don't work the way we expect them to, even if we give them
the same 1's and 0's lol
---
 templates/themes/default-v2/watch.html | 35 +++++++++++++++-----------
 1 file changed, 20 insertions(+), 15 deletions(-)

diff --git a/templates/themes/default-v2/watch.html b/templates/themes/default-v2/watch.html
index 721f06a..7076ef2 100644
--- a/templates/themes/default-v2/watch.html
+++ b/templates/themes/default-v2/watch.html
@@ -12,7 +12,7 @@
 				Uploaded by <b><a href='/channel/{{.channel_id}}'>{{.uploader}}</a></b> on <b>{{.upload_date}}</b><br>
 				<br>
 				{{start ?fav}}<a href='fav.shs?v={{.id}}' target='_blank'>Add to favourites</a><br>{{end ?fav}}
-				{{start ?unfav}}<a href='unfav.shs?v={{.id}}' target='_blank'>Remove from favourites</a><br>{{else ?unfav}}{{end ?unfav}}
+				{{start ?unfav}}<a href='unfav.shs?v={{.id}}' target='_blank' style="color:#d00;">Remove from favourites</a><br>{{else ?unfav}}{{end ?unfav}}
 				{{start ?sub}}<a href='subscribe.shs?id={{.channel_id}}' target='_blank'>Subscribe to {{.uploader}}!</a><br>{{end ?sub}}
 				{{start ?unsub}}<a href='unsubscribe.shs?id={{.channel_id}}' target='_blank'>Unsubscribe from {{.uploader}}!</a><br>{{end ?unsub}}
 				{{start ?login}}<b><a href='/login.shs?r={{.login_r}}'>Log in</a> to add this video to your favourites and/or subscribe to this channel!</b><br>{{end ?login}}
@@ -26,17 +26,6 @@
 </div>
 <pre><i>Description</i>:<br>{{.description}}</pre>
 </div>
-<h1>Recommended</h1>
-<div style='display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));'>
-{{start _recommended}}
-
-<div><a href='/watch?v={{.id}}'><img src='https://i.ytimg.com/vi/{{.id}}/mqdefault.jpg'>{{.title}}</a></div>
-
-{{end _recommended}}
-</div><h1>Comments</h1>
-<div class='comments'></div>
-<script src='/js/watch.js'></script>
-
 
 {{start ?playlist}}
 <h1>Playlist</h1>
@@ -49,9 +38,25 @@
 		});
 	});
 </script>
+
+<div style='display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));'>
 	{{start _playlist}}
-
-	<a href='watch?v={{.id}}&playlist={{.playlist_id}}'><img src='//i.ytimg.com/vi/{{.id}}/mqdefault.jpg'><br>{{.title}}</a><br>
-
+	<div class='video-image-container'>
+		<a href='watch?v={{.id}}&playlist={{.playlist}}'>
+			<div class='video-image' style='background-image: url(http://i.ytimg.com/vi/{{.id}}/mqdefault.jpg)'></div>
+			<b>{{.title}}</b></a>
+	</div>
 	{{end _playlist}}
+	</div>
 {{end ?playlist}}
+
+<h1>Recommended</h1>
+<div style='display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));'>
+{{start _recommended}}
+
+<div><a href='/watch?v={{.id}}'><img src='https://i.ytimg.com/vi/{{.id}}/mqdefault.jpg'><br>{{.title}}</a></div>
+
+{{end _recommended}}
+</div><h1>Comments</h1>
+<div class='comments'></div>
+<script src='/js/watch.js'></script>