Refactor navigation and add news functionality with WordPress integration

This commit is contained in:
ElPoyo
2026-02-11 10:15:36 +01:00
parent 4e11fd9a06
commit b7f55e0707
7 changed files with 721 additions and 27 deletions

View File

@@ -36,15 +36,15 @@
</div>
</router-link>
<router-link
to="/au-hasard"
to="/actualites"
class="nav-link"
:class="{ 'active': $route.name === 'Random' }"
:class="{ 'active': $route.name === 'News' || $route.name === 'NewsArticle' }"
>
<div class="flex items-center space-x-2">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2m-4-3H9M7 16h6M7 8h6v4H7V8z" />
</svg>
<span>Au Hasard</span>
<span>Actualités</span>
</div>
</router-link>
@@ -83,7 +83,7 @@
<div class="flex flex-col space-y-4">
<router-link to="/" class="nav-link-mobile">Accueil</router-link>
<router-link to="/textes" class="nav-link-mobile">Textes</router-link>
<router-link to="/au-hasard" class="nav-link-mobile">Au Hasard</router-link>
<router-link to="/actualites" class="nav-link-mobile">Actualités</router-link>
<div class="pt-2">
<input
v-model="searchQuery"
@@ -131,7 +131,9 @@ export default {
<style scoped>
.nav-link {
@apply font-medium transition-colors duration-200 pb-1;
font-weight: 500;
transition: color 0.2s;
padding-bottom: 0.25rem;
color: #6b7280;
}
@@ -140,11 +142,15 @@ export default {
}
.nav-link.active {
@apply text-black border-b-2 border-black;
color: black;
border-bottom: 2px solid black;
}
.nav-link-mobile {
@apply font-medium transition-colors duration-200 py-2;
font-weight: 500;
transition: color 0.2s;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
color: #6b7280;
}