2025-04-09 16:04:50 +04:00
<!-- Header avec barre de recherche et icônes -->
2025-07-22 11:54:05 +04:00
< header class = " header " role = " banner " >
2025-04-09 16:04:50 +04:00
< div class = " search-container " >
2025-07-22 11:54:05 +04:00
< form action = " recherche.php " method = " get " role = " search " aria - label = " Recherche de vidéos " >
< label for = " search-input " class = " sr-only " > Rechercher des vidéos </ label >
< input type = " text " id = " search-input " name = " q " placeholder = " Rechercher... " aria - describedby = " search-help " >
< button type = " submit " aria - label = " Lancer la recherche " >
< i class = " fas fa-search " aria - hidden = " true " ></ i >
</ button >
< div id = " search-help " class = " sr-only " > Tapez vos mots - clés pour rechercher des vidéos </ div >
2025-04-09 16:04:50 +04:00
</ form >
</ div >
2025-07-20 15:53:22 +04:00
2025-07-22 11:54:05 +04:00
< nav class = " social-icons " aria - label = " Réseaux sociaux " >
< a target = " _blank " rel = " me noreferrer " href = " <?php echo MASTODON_URL; ?> " class = " icon-button " aria - label = " Suivre sur Mastodon " >
< i class = " fab fa-mastodon icon-mastodon " aria - hidden = " true " ></ i >
</ a >
< a target = " _blank " rel = " noreferrer " href = " <?php echo INSTAGRAM_URL; ?> " class = " icon-button " aria - label = " Suivre sur Instagram " >
< i class = " fab fa-instagram icon-instagram " aria - hidden = " true " ></ i >
</ a >
< a target = " _blank " rel = " noreferrer " href = " <?php echo TIKTOK_URL; ?> " class = " icon-button " aria - label = " Suivre sur TikTok " >
< i class = " fab fa-tiktok icon-tiktok " aria - hidden = " true " ></ i >
</ a >
2025-04-09 16:04:50 +04:00
< div class = " more-social-container " >
2025-07-22 11:54:05 +04:00
< button type = " button " class = " icon-button more-social-toggle " aria - expanded = " false " aria - controls = " social-dropdown " aria - label = " Voir plus de réseaux sociaux " >
< i class = " fas fa-ellipsis-h " aria - hidden = " true " ></ i >
</ button >
< div id = " social-dropdown " class = " more-social-dropdown " role = " menu " >
< a target = " _blank " rel = " noreferrer " href = " <?php echo FACEBOOK_URL; ?> " class = " more-social-item " role = " menuitem " >
< i class = " fab fa-facebook icon-facebook " aria - hidden = " true " ></ i > Facebook
2025-04-09 16:04:50 +04:00
</ a >
2025-07-22 11:54:05 +04:00
< a target = " _blank " rel = " noreferrer " href = " <?php echo YOUTUBE_URL; ?> " class = " more-social-item " role = " menuitem " >
< i class = " fab fa-youtube icon-youtube " aria - hidden = " true " ></ i > YouTube
2025-04-09 16:04:50 +04:00
</ a >
2025-07-22 11:54:05 +04:00
< a target = " _blank " rel = " noreferrer " href = " <?php echo X_URL; ?> " class = " more-social-item " role = " menuitem " >
< i class = " fab fa-x-twitter icon-x " aria - hidden = " true " ></ i > X
2025-04-08 06:37:14 +04:00
</ a >
</ div >
</ div >
2025-07-22 11:54:05 +04:00
</ nav >
2025-07-20 15:53:22 +04:00
2025-04-09 16:04:50 +04:00
< div class = " action-icons " >
2025-09-28 20:39:47 +04:00
< ? php if ( defined ( 'DONATIONS_ENABLED' ) && DONATIONS_ENABLED && ! empty ( PAYPAL_ME_URL )) : ?>
<a href="dons.php" class="icon-button donation-link" aria-label="Soutenir KA UBUNTU" title="Faire un don">
<i class="fas fa-heart" aria-hidden="true"></i>
</a>
<?php endif; ?>
2025-07-22 12:57:49 +04:00
<button id="theme-toggle" class="icon-button" aria-label="Basculer entre mode clair et sombre" title="Changer le thème">
<i class="fas fa-sun" aria-hidden="true"></i>
</button>
2025-07-22 11:54:05 +04:00
<button id="install-pwa" class="icon-button install-pwa-button" style="display: none;" aria-label="Installer l'application">
<i class="fas fa-download" aria-hidden="true"></i>
2025-07-17 20:10:14 +04:00
</button>
2025-07-22 11:54:05 +04:00
<button class="mobile-menu-toggle" aria-expanded="false" aria-controls="mobile-menu" aria-label="Ouvrir le menu de navigation">
<i class="fas fa-bars" aria-hidden="true"></i>
2025-04-09 16:04:50 +04:00
</button>
</div>
2025-07-22 11:54:05 +04:00
</header>