« Utilisateur:Hiob/Brouillon » : différence entre les versions
De Nefald
Autres actions
Aucun résumé des modifications |
Aucun résumé des modifications |
||
| Ligne 1 : | Ligne 1 : | ||
<div class="home-wrapper"> | |||
<!-- HEADER --> | |||
<div class="home-header"> | |||
<div class="home-header__content"> | |||
<img src="logo.png" alt="Logo" class="home-header__logo"> | |||
<h1 class="home-header__title">Bienvenue sur le Wiki</h1> | |||
<p class="home-header__subtitle">Votre source d'information complète</p> | |||
</div> | |||
</div> | |||
<!-- BARRE DE RECHERCHE --> | |||
<div class="home-search"> | |||
<span class="home-search__icon">🔍</span> | |||
<input type="text" class="home-search__input" placeholder="Rechercher..."> | |||
<kbd class="home-search__kbd">Ctrl+K</kbd> | |||
</div> | |||
<!-- BANNIÈRE ÉVÉNEMENT --> | |||
<div class="home-event-bar"> | |||
<span class="home-event-bar__icon">🎉</span> | |||
<div class="home-event-bar__content"> | |||
<span class="home-event-bar__label">Événement</span> | |||
<span class="home-event-bar__title">Nouveau contenu disponible</span> | |||
</div> | |||
<a href="#" class="home-event-bar__link">En savoir plus →</a> | |||
</div> | |||
== | <!-- NAVIGATION CARDS --> | ||
<div class="home-nav"> | |||
<div class="home-nav-grid"> | |||
<a href="#" class="home-nav-card"> | |||
<span class="home-nav-card__icon">📚</span> | |||
<span class="home-nav-card__title">Articles</span> | |||
</a> | |||
<a href="#" class="home-nav-card"> | |||
<span class="home-nav-card__icon">🎮</span> | |||
<span class="home-nav-card__title">Guides</span> | |||
</a> | |||
<a href="#" class="home-nav-card"> | |||
<span class="home-nav-card__icon">🗺️</span> | |||
<span class="home-nav-card__title">Cartes</span> | |||
</a> | |||
<a href="#" class="home-nav-card"> | |||
<span class="home-nav-card__icon">👥</span> | |||
<span class="home-nav-card__title">Communauté</span> | |||
</a> | |||
<a href="#" class="home-nav-card"> | |||
<span class="home-nav-card__icon">🎨</span> | |||
<span class="home-nav-card__title">Galerie</span> | |||
</a> | |||
<a href="#" class="home-nav-card"> | |||
<span class="home-nav-card__icon">📰</span> | |||
<span class="home-nav-card__title">Actualités</span> | |||
</a> | |||
</div> | |||
</div> | |||
= | <!-- LAYOUT PRINCIPAL : 2 COLONNES + SIDEBAR --> | ||
<div class="home-layout"> | |||
<!-- ZONE PRINCIPALE (2 colonnes de cards) --> | |||
<div class="home-main"> | |||
<!-- ROW 1 : 2 cards côte à côte --> | |||
<div class="home-main__row"> | |||
{{Card | |||
|title=📝 Dernières modifications | |||
|badge=LIVE | |||
|text=Contenu card 1 | |||
}} | |||
{{Card | |||
|title=⭐ Articles populaires | |||
|text=Contenu card 2 | |||
}} | }} | ||
</div> | |||
=== | <!-- ROW 2 : 2 cards côte à côte --> | ||
<div class="home-main__row"> | |||
{{Card | |||
|title=🎯 En vedette | |||
|text=Contenu card 3 | |||
}} | |||
{{Card | |||
|title=📊 Statistiques | |||
|text=Contenu card 4 | |||
}} | |||
</div> | |||
<!-- ROW 3 : Card pleine largeur --> | |||
<div class="home-main__row home-main__row--full"> | |||
{{Card | |||
|title=📰 Actualités récentes | |||
|text=Contenu card pleine largeur | |||
}} | |||
</div> | |||
}} | |||
</div> | |||
<!-- SIDEBAR (cards verticales) --> | |||
<aside class="home-sidebar"> | |||
{{Card | |||
|title=💬 Rejoindre Discord | |||
|text=Contenu sidebar 1 | |||
}} | |||
{{Card | |||
|title=📊 Statistiques du wiki | |||
|text=Contenu sidebar 2 | |||
}} | |||
{{Card | |||
|title=🔗 Liens utiles | |||
|text=Contenu sidebar 3 | |||
}} | |||
{{Card | |||
|title=❤️ Soutenir le projet | |||
|text=Contenu sidebar 4 | |||
}} | |||
</aside> | |||
</div> | |||
</div> | |||
</ | |||