From 87d06ad174bdf432be9a49946c3c008b2bb872c0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20FAMIBELLE-PRONZOLA?= <c.pronzola@tuta.io>
Date: Thu, 10 Apr 2025 11:48:56 +0400
Subject: [PATCH] add channel link on video page

---
 css/video-page.css | 41 +++++++++++++++++++++++++++++++++++++++++
 video.php          | 23 ++++++++++++++++-------
 2 files changed, 57 insertions(+), 7 deletions(-)

diff --git a/css/video-page.css b/css/video-page.css
index b96ee81..00121f8 100644
--- a/css/video-page.css
+++ b/css/video-page.css
@@ -1,3 +1,7 @@
+:root {
+    --primary-red: #FF0000;
+}
+
 /* Styles pour la page vidéo */
 .video-page {
     display: grid;
@@ -216,6 +220,43 @@
     line-height: 1.4;
 }
 
+.channel-avatar-link {
+    transition: transform 0.2s ease-in-out;
+    display: block;
+}
+
+.channel-avatar-link:hover {
+    transform: scale(1.05);
+}
+
+.channel-name-link {
+    text-decoration: none;
+    color: inherit;
+    position: relative;
+    display: inline-block;
+}
+
+.channel-name-link:hover .channel-name {
+    color: var(--primary-red);
+}
+
+.channel-name-link:after {
+    content: '';
+    position: absolute;
+    width: 100%;
+    height: 2px;
+    bottom: -3px;
+    left: 0;
+    background-color: var(--primary-red);
+    transform: scaleX(0);
+    transition: transform 0.3s;
+    transform-origin: bottom left;
+}
+
+.channel-name-link:hover:after {
+    transform: scaleX(1);
+}
+
 .subscribe-button {
     background-color: #0d6efd;
     color: white;
diff --git a/video.php b/video.php
index 502a9d3..733453d 100644
--- a/video.php
+++ b/video.php
@@ -245,17 +245,26 @@ if (empty($videoData) || isset($videoData['error'])) {
                 
                 <div class="video-secondary-info">
                     <div class="channel-info">
+                        <?php 
+                        $channelUrl = PEERTUBE_URL . '/c/' . $video['channelHandle'];
+                        ?>
                         <?php if (strpos($channelAvatar, 'default-avatar') !== false || empty($channelAvatar)): ?>
-                            <div class="channel-avatar-placeholder">
-                                <i class="fas fa-user-circle"></i>
-                            </div>
+                            <a href="<?php echo $channelUrl; ?>" target="_blank" rel="noopener noreferrer" class="channel-avatar-link">
+                                <div class="channel-avatar-placeholder">
+                                    <i class="fas fa-user-circle"></i>
+                                </div>
+                            </a>
                         <?php else: ?>
-                            <div class="channel-avatar">
-                                <img src="<?php echo $channelAvatar; ?>" alt="<?php echo $video['channel']; ?>">
-                            </div>
+                            <a href="<?php echo $channelUrl; ?>" target="_blank" rel="noopener noreferrer" class="channel-avatar-link">
+                                <div class="channel-avatar">
+                                    <img src="<?php echo $channelAvatar; ?>" alt="<?php echo $video['channel']; ?>">
+                                </div>
+                            </a>
                         <?php endif; ?>
                         <div class="channel-details">
-                            <h3 class="channel-name"><?php echo $video['channel']; ?></h3>
+                            <a href="<?php echo $channelUrl; ?>" target="_blank" rel="noopener noreferrer" class="channel-name-link">
+                                <h3 class="channel-name"><?php echo $video['channel']; ?></h3>
+                            </a>
                         </div>
                     </div>