diff --git a/css/styles.css b/css/styles.css index c2bfb2f..4601e34 100644 --- a/css/styles.css +++ b/css/styles.css @@ -5,6 +5,19 @@ box-sizing: border-box; } +/* Accessibilité - Classes utilitaires */ +.sr-only { + position: absolute !important; + width: 1px !important; + height: 1px !important; + padding: 0 !important; + margin: -1px !important; + overflow: hidden !important; + clip: rect(0, 0, 0, 0) !important; + white-space: nowrap !important; + border: 0 !important; +} + :root { --primary-red: #FF0000; --primary-green: #008000; @@ -42,6 +55,38 @@ a { color: var(--text-color); } +/* Amélioration du focus pour l'accessibilité */ +a:focus, +button:focus, +input:focus, +textarea:focus, +select:focus { + outline: 2px solid var(--primary-red); + outline-offset: 2px; + border-radius: 2px; +} + +/* Support pour les préférences d'animation réduite */ +@media (prefers-reduced-motion: reduce) { + *, *::before, *::after { + animation-duration: 0.01ms !important; + animation-iteration-count: 1 !important; + transition-duration: 0.01ms !important; + } +} + +/* Support pour le contraste élevé */ +@media (prefers-contrast: high) { + :root { + --text-color: #000000; + --primary-red: #CC0000; + --card-bg: #FFFFFF; + --sidebar-bg: #F0F0F0; + --tag-bg: #E8E8E8; + --search-bg: #D0D0D0; + } +} + img { max-width: 100%; height: auto; diff --git a/includes/header.php b/includes/header.php index e9d3747..c1e18da 100644 --- a/includes/header.php +++ b/includes/header.php @@ -1,38 +1,50 @@ -
+ diff --git a/includes/sidebar.php b/includes/sidebar.php index 8c61aa6..5e9133b 100644 --- a/includes/sidebar.php +++ b/includes/sidebar.php @@ -1,7 +1,7 @@ - +
+ diff --git a/index.php b/index.php index b27ccd5..d61b533 100644 --- a/index.php +++ b/index.php @@ -65,12 +65,13 @@ setSecurityHeaders(); -
+
-
+
+

Diffusion en direct

"> + title="Diffusion en direct: " + aria-describedby="live-description"> +
+ Lecteur vidéo pour la diffusion en direct de +

-
- + - <?php echo $liveStream['channel']; ?> + Avatar de la chaîne <?php echo htmlspecialchars($liveStream['channel']); ?> - +
-
+
@@ -146,12 +151,12 @@ setSecurityHeaders();
-
+
-

Shorts

+

Shorts


-
-
+
+
-

Dernières vidéos

-
+

Dernières vidéos

+
-
+
- <?php echo $video['title']; ?> -
+ Miniature de la vidéo: <?php echo htmlspecialchars($video['title']); ?> + -
+
+ +
-

+

@@ -240,7 +247,7 @@ setSecurityHeaders();
-
+
-
+
-
-
+
+
-

Tendances

-
+ +
-
+
<?php echo $video['title']; ?>
@@ -298,7 +305,7 @@ setSecurityHeaders();
-
+ -
+
@@ -321,17 +328,17 @@ setSecurityHeaders(); if (!empty($category['videos'])): ?> -
-
+
+
-

-
+

+
-
+
<?php echo $video['title']; ?>
@@ -356,12 +363,12 @@ setSecurityHeaders();
-
+
-
+
@@ -372,10 +379,10 @@ setSecurityHeaders(); ?> -
+
-
+

@@ -388,12 +395,12 @@ setSecurityHeaders(); -
+ -
-

Tendances

+
-
-
+ + +
diff --git a/video.php b/video.php index 6fcd0c3..bb70da6 100644 --- a/video.php +++ b/video.php @@ -162,52 +162,58 @@ if (empty($videoData) || isset($videoData['error'])) { -
+
-
- -

Vidéo non trouvée

+
+ -
-
+
+
- +
-
+
-
-

+
+

- -
-
-

Licence

+
+

Licence

"CC BY (Attribution)", @@ -257,36 +263,36 @@ if (empty($videoData) || isset($videoData['error'])) {
-
+ -
+ -
+
- - -
+
-
- -
+
-
-
+
+
-

Commentaires

+

Commentaires

- - Voir sur + + Voir sur -
+
-
+ @@ -383,19 +389,20 @@ if (empty($videoData) || isset($videoData['error'])) {
-
-

Vidéos suggérées

+
-
+ + -
+