commit 2e4177bb36b3754704dfabbb0d9849d4d0ddde55
parent 816f5657fbf7ad3e92e334a165f8cfc985351d14
Author: JayVii <jayvii[AT]posteo[DOT]de>
Date: Tue, 9 Dec 2025 11:55:59 +0100
feat: remove buttons and integrate links
Diffstat:
3 files changed, 49 insertions(+), 23 deletions(-)
diff --git a/assets/css/custom.css b/assets/css/custom.css
@@ -1,6 +1,7 @@
* {
scroll-behavior: smooth;
}
+
.preview, .player, .player_container {
height: auto;
width: 100%;
@@ -9,6 +10,29 @@
margin-bottom: 1em;
border: 0;
}
+
+/* Put animated play button on top of thumbnails */
+.preview {
+ position: relative;
+}
+.preview:before {
+ position: absolute;
+ content: "\25B6";
+ top: 25%;
+ left: 25%;
+ height: 50%;
+ width: 50%;
+ background: url("/assets/motion-play.svg") #cccccc55;
+ background-size: 100% 100%;
+ border: 2px solid;
+ border-radius: 5px;
+ opacity: 0.5;
+}
+.preview:hover:before {
+ filter: invert(100%);
+ opacity: 1;
+}
+
#searchbar {
width: 100%;
margin-top:2em;
diff --git a/assets/motion-play.svg b/assets/motion-play.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M22 12C22 6.46 17.54 2 12 2C10.83 2 9.7 2.19 8.62 2.56L9.32 4.5C10.17 4.16 11.06 3.97 12 3.97C16.41 3.97 20.03 7.59 20.03 12C20.03 16.41 16.41 20.03 12 20.03C7.59 20.03 3.97 16.41 3.97 12C3.97 11.06 4.16 10.12 4.5 9.28L2.56 8.62C2.19 9.7 2 10.83 2 12C2 17.54 6.46 22 12 22C17.54 22 22 17.54 22 12M5.47 3.97C6.32 3.97 7 4.68 7 5.47C7 6.32 6.32 7 5.47 7C4.68 7 3.97 6.32 3.97 5.47C3.97 4.68 4.68 3.97 5.47 3.97M18 12C18 8.67 15.33 6 12 6C8.67 6 6 8.67 6 12C6 15.33 8.67 18 12 18C15.33 18 18 15.33 18 12M15 12L10 15V9" /></svg>
+\ No newline at end of file
diff --git a/index.php b/index.php
@@ -335,13 +335,31 @@
<section id="video_<?php echo $index; ?>">
<!-- Headline: streamer name -->
- <h3 style="margin-bottom:5px;"><?php echo $video["title"]; ?></h3>
+ <h3 style="margin-bottom:5px;">
+ <a
+ target="_blank"
+ href="https://www.youtube.com/watch?v=<?php echo $video["vid"]; ?>"
+ >
+ <?php echo $video["title"]; ?>
+ </a>
+ </h3>
<!-- Video Information -->
<div style="width:100%;margin-bottom:1em;color:var(--border);">
- <span style="margin-right:0.25em;"><?php echo $video["author"]; ?></span>
- <span style="margin-left:0.25em;margin-right:0.25em;"><?php echo date("Y-m-d, H:i:s", $video["time"]); ?></span>
- <span style="margin-left:0.25em;"><?php echo "(" . $video["views"] . " Views)"; ?></span>
+ <!-- Channel Name -->
+ <span style="margin-right:0.25em;">
+ <a href="/?channels=<?php echo $video["aid"]; ?>">
+ <?php echo $video["author"]; ?>
+ </a>
+ </span>
+ <!-- Timestamp -->
+ <span style="margin-left:0.25em;margin-right:0.25em;">
+ <?php echo date("Y-m-d, H:i:s", $video["time"]); ?>
+ </span>
+ <!-- Views -->
+ <span style="margin-left:0.25em;margin-right:0.25em;">
+ <?php echo "(" . $video["views"] . " Views)"; ?>
+ </span>
</div>
<!-- player Container -->
@@ -353,27 +371,9 @@
class="preview"
src="https://i4.ytimg.com/vi/<?php echo $video["vid"]; ?>/hqdefault.jpg"
loading="lazy"
+ onclick="yt2html_toggle_player(<?php echo $js_args; ?>)"
>
- <!-- Video Buttons -->
- <?php $js_args = $index . ",'" . $video["vid"] . "'"; ?>
- <button onclick="yt2html_toggle_player(<?php echo $js_args; ?>)">
- Toggle Player
- </button>
- <a
- class="button"
- href="/?channels=<?php echo $video["aid"]; ?>"
- >
- Open Channel
- </a>
- <a
- class="button"
- href="https://www.youtube.com/watch?v=<?php echo $video["vid"]; ?>"
- target="_blank"
- >
- Open on YouTube
- </a>
-
<!-- Chat Collapsable -->
<details>
<summary>
