diff --git a/css/video-page.css b/css/video-page.css index 73e2399..824bb9c 100644 --- a/css/video-page.css +++ b/css/video-page.css @@ -239,6 +239,51 @@ white-space: pre-line; } +/* Licence de la vidéo */ +.video-licence { + background-color: #f9f9f9; + border-radius: 8px; + padding: 1rem; + margin-bottom: 1.5rem; + border: 1px solid #eee; +} + +.licence-title { + font-size: 0.9375rem; + font-weight: 600; + margin: 0 0 0.5rem 0; + color: #333; +} + +.licence-info { + display: flex; + align-items: center; + gap: 0.75rem; +} + +.licence-link { + display: flex; + align-items: center; + gap: 0.75rem; + text-decoration: none; + color: inherit; + transition: opacity 0.2s; +} + +.licence-link:hover { + opacity: 0.8; +} + +.licence-logo { + height: 31px; + width: auto; +} + +.licence-label { + font-size: 0.875rem; + color: #555; +} + .video-tags { display: flex; flex-wrap: wrap; @@ -741,17 +786,17 @@ @media (max-width: 576px) { .video-page { - gap: 20px; - margin-top: 10px; + grid-template-columns: 1fr; + padding: 0; } .video-player-container { - margin-bottom: 0; + margin-bottom: 1rem; } .video-content, .video-suggestions { - width: 100%; + padding: 1rem; } .video-title { @@ -759,17 +804,17 @@ } .video-actions { - justify-content: space-around; + justify-content: flex-start; } .action-button { - font-size: 0.75rem; - min-width: 60px; - padding: 0.5rem 0.25rem; + padding: 0.4rem 0.6rem; + min-width: auto; + gap: 0.3rem; } .video-views, .video-date { - font-size: 0.8125rem; + font-size: 0.75rem; } .comment { @@ -777,22 +822,30 @@ } .comment-avatar { - margin-bottom: 10px; + margin-bottom: 0.75rem; } .suggested-video { - display: flex; flex-direction: column; } .suggested-video-thumbnail { width: 100%; - height: auto; - padding-top: 56.25%; /* Maintien du ratio 16:9 */ } .suggested-video-title { - font-size: 0.875rem; + font-size: 0.9375rem; + } + + /* Licence responsive */ + .licence-info { + flex-direction: column; + align-items: flex-start; + gap: 0.5rem; + } + + .licence-logo { + height: 28px; } } diff --git a/video.php b/video.php index 9f9230b..7d96c2b 100644 --- a/video.php +++ b/video.php @@ -32,7 +32,8 @@ if (empty($videoData) || isset($videoData['error'])) { 'views' => $videoData['views'], 'likes' => $videoData['likes'], 'date' => $videoData['publishedAt'], - 'tags' => $videoData['tags'] ?? [] + 'tags' => $videoData['tags'] ?? [], + 'licence' => $videoData['licence'] ?? null ]; // Récupérer l'image de la chaîne @@ -182,6 +183,61 @@ if (empty($videoData) || isset($videoData['error'])) { + + +
+

Licence

+ "Attribution", + 2 => "Attribution - Share Alike", + 3 => "Attribution - No Derivatives", + 4 => "Attribution - Non Commercial", + 5 => "Attribution - Non Commercial - Share Alike", + 6 => "Attribution - Non Commercial - No Derivatives", + 7 => "Public Domain Dedication" + ]; + + $licenceUrls = [ + 1 => "https://mirrors.creativecommons.org/presskit/buttons/88x31/png/by.png", + 2 => "https://mirrors.creativecommons.org/presskit/buttons/88x31/png/by-sa.png", + 3 => "https://mirrors.creativecommons.org/presskit/buttons/88x31/png/by-nd.png", + 4 => "https://mirrors.creativecommons.org/presskit/buttons/88x31/png/by-nc.png", + 5 => "https://mirrors.creativecommons.org/presskit/buttons/88x31/png/by-nc-sa.png", + 6 => "https://mirrors.creativecommons.org/presskit/buttons/88x31/png/by-nc-nd.png", + 7 => "https://mirrors.creativecommons.org/presskit/buttons/88x31/png/cc-zero.png" + ]; + + $licenceInfoUrls = [ + 1 => "https://creativecommons.org/licenses/by/4.0/deed.fr", + 2 => "https://creativecommons.org/licenses/by-sa/4.0/deed.fr", + 3 => "https://creativecommons.org/licenses/by-nd/4.0/deed.fr", + 4 => "https://creativecommons.org/licenses/by-nc/4.0/deed.fr", + 5 => "https://creativecommons.org/licenses/by-nc-sa/4.0/deed.fr", + 6 => "https://creativecommons.org/licenses/by-nc-nd/4.0/deed.fr", + 7 => "https://creativecommons.org/publicdomain/zero/1.0/deed.fr" + ]; + + $licenceId = $video['licence']['id']; + $licenceLabel = isset($licenceLabels[$licenceId]) ? $licenceLabels[$licenceId] : "Licence inconnue"; + $licenceUrl = isset($licenceUrls[$licenceId]) ? $licenceUrls[$licenceId] : ""; + $licenceInfoUrl = isset($licenceInfoUrls[$licenceId]) ? $licenceInfoUrls[$licenceId] : ""; + ?> +
+ + + + + + + + + + + +
+
+