aissi/2026-DEV-BUT3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🎨 Remise au propre

Browse Source
This commit is contained in:
Adrien DICK
2026-06-10 16:24:37 -04:00
parent 9318d1c28b
commit 4e1a0b24f4
11 changed files with 37 additions and 624 deletions
Download Patch File Download Diff File Expand all files Collapse all files
my-library/src/pages/Home.jsx
-82
View File
@@ -1,91 +1,9 @@
import { Link } from 'react-router-dom';
import '../styles/home.css';
const features = [
{ icon: '📚', title: 'Enregistrer un livre', desc: 'Ajoutez un nouveau titre au catalogue de la bibliothèque.', role: 'admin', path: '/books/new' },
{ icon: '🛒', title: 'Passer une commande', desc: 'Commandez vos livres préférés en quelques secondes.', role: 'user', path: '/orders/new' },
{ icon: '🏷️', title: 'Appliquer une promotion', desc: 'Créez et gérez vos codes promotionnels.', role: 'admin', path: '/promotions/new' },
{ icon: '📌', title: 'Réserver un livre', desc: 'Réservez un exemplaire avant sa disponibilité.', role: 'user', path: '/reservations/new' },
{ icon: '↩️', title: 'Retour de livre', desc: 'Gérez les retours et remises en stock.', role: 'admin', path: '/returns/new' },
{ icon: '⭐', title: 'Points de fidélité', desc: 'Consultez et utilisez vos points cumulés.', role: 'user', path: '/loyalty' },
{ icon: '💬', title: 'Laisser un avis', desc: 'Partagez votre opinion sur vos dernières lectures.', role: 'user', path: '/reviews/new' },
{ icon: '🎫', title: 'Créer un abonnement', desc: 'Souscrivez à un abonnement mensuel ou annuel.', role: 'user', path: '/subscriptions/new' },
{ icon: '🤝', title: 'Prêt entre lecteurs', desc: "Prêtez vos livres à d'autres membres de la communauté.", role: 'user', path: '/loans/new' },
{ icon: '👥', title: 'Commande groupée', desc: 'Participez à des achats groupés avantageux.', role: 'user', path: '/group-orders' },
];
const stats = [
{ value: '10 000+', label: 'Livres disponibles' },
{ value: '5 000+', label: 'Lecteurs actifs' },
{ value: '50+', label: 'Catégories' },
];
export default function Home() {
return (
<main>
{/* Hero */}
<section className="hero">
<p className="hero__eyebrow">Votre bibliothèque en ligne</p>
<h1 className="hero__title">
Des livres pour tous,
<span className="hero__title-italic">partout, toujours.</span>
</h1>
<div className="hero__rule" />
<p className="hero__subtitle">
Commandez, réservez, prêtez et partagez vos lectures.
Une plateforme pensée pour les vrais amoureux des livres.
</p>
<div className="hero__actions">
<Link to="/books">
<button className="hero__btn-primary">Explorer le catalogue</button>
</Link>
<button className="hero__btn-secondary">En savoir plus</button>
</div>
</section>
{/* Stats */}
<section className="stats">
{stats.map(({ value, label }) => (
<div key={label} className="stats__item">
<div className="stats__value">{value}</div>
<div className="stats__label">{label}</div>
</div>
))}
</section>
{/* Features */}
<div className="section-header">
<p className="section-header__eyebrow">Fonctionnalités</p>
<h2 className="section-header__title">Tout ce dont vous avez besoin</h2>
</div>
<section className="features">
<div className="features__grid">
{features.map((f) => (
<Link to={f.path} key={f.title} className="feature-card">
<div className="feature-card__glyph">{f.icon}</div>
<span className={`badge badge--${f.role}`}>
{f.role === 'admin' ? 'Administrateur' : 'Utilisateur'}
</span>
<h3 className="feature-card__title">{f.title}</h3>
<p className="feature-card__desc">{f.desc}</p>
<span className="feature-card__arrow">→ Accéder</span>
</Link>
))}
</div>
</section>
{/* Footer CTA */}
<section className="home-cta">
<div className="home-cta__rule" />
<h2 className="home-cta__title">
Prêt à commencer<br />votre aventure ?
</h2>
<p className="home-cta__sub">Rejoignez des milliers de lecteurs dès aujourd'hui.</p>
<Link to="/register">
<span className="home-cta__btn">Créer un compte gratuit</span>
</Link>
</section>
</main>
);
}