Ygg - Moteur de recherche de torrents

Description

Un site web inspiré de The Pirate Bay construit avec SvelteKit, TailwindCSS v3 et des composants UI de style shadcn. Design épuré, moderne et professionnel avec une navbar noire et un thème clair.

Technologies

• SvelteKit - Framework web moderne
• TailwindCSS v3 - Framework CSS utility-first
• Lucide Svelte - Icônes
• JavaScript - Pas de TypeScript

Installation

# Installer les dépendances
npm install

# Démarrer le serveur de développement
npm run dev

# Build pour la production
npm run build

# Prévisualiser le build de production
npm run preview

Fonctionnalités

🏠 Page d'accueil

• Moteur de recherche avec filtres par catégorie
• Statistiques globales (torrents, utilisateurs, disponibilité)
• Liste des torrents récents populaires
• Interface épurée et concise

🔝 Top 100

• Classement des 100 torrents les plus populaires
• Filtres par période (24h, 7j, 30j, tout)
• Filtres par catégorie
• Vue tableau responsive
• Tri par nombre de seeders

📺 Page Série

• Informations détaillées de la série (synopsis, cast, note)
• Statistiques (saisons, épisodes, durée)
• Liste des torrents organisés par saison
• Filtres par saison et qualité
• Distinction entre packs complets et épisodes individuels
• Sections repliables par saison

📄 Page Torrent

• Informations complètes du torrent
• Statistiques détaillées (seeders, leechers, complétés)
• Description et liste des fichiers
• Section commentaires avec système de votes
• Informations techniques (hash, date)
• Badges de statut (vérifié, VIP)

🔐 Authentification

• Modale de connexion
• Modale d'inscription avec validation
• Navigation fluide entre les modales
• Formulaires avec icônes et validation

Structure du projet

src/
├── lib/
│   ├── components/
│   │   ├── auth/
│   │   │   ├── LoginForm.svelte      # Formulaire de connexion
│   │   │   └── RegisterForm.svelte   # Formulaire d'inscription
│   │   └── ui/
│   │       ├── button.svelte         # Bouton réutilisable
│   │       ├── input.svelte          # Champ de saisie
│   │       ├── card.svelte           # Carte
│   │       ├── badge.svelte          # Badge
│   │       └── modal.svelte          # Modale
│   └── utils.js                      # Fonctions utilitaires
├── routes/
│   ├── +layout.svelte                # Layout principal
│   ├── +page.svelte                  # Page d'accueil
│   ├── top/
│   │   └── +page.svelte              # Page Top 100
│   ├── series/
│   │   └── [id]/
│   │       └── +page.svelte          # Page d'une série
│   └── torrent/
│       └── [id]/
│           └── +page.svelte          # Page d'un torrent
├── app.css                           # Styles globaux + Tailwind
└── app.html                          # Template HTML de base

Design

Principes

• ✅ Interface épurée et concise
• ✅ Pas d'ombres (box-shadow)
• ✅ Bordures simples
• ✅ Navbar noire professionnelle
• ✅ Fond blanc/gris clair
• ✅ Couleurs modernes (bleu, vert, orange)
• ✅ Responsive mobile-first

Palette de couleurs

• Primaire : Bleu (#2563EB)
• Succès : Vert (seeders)
• Attention : Orange (leechers)
• Fond : Gris clair (#F9FAFB)
• Navbar : Gris foncé (#111827)
• Bordures : Gris (#D1D5DB)

Routes

• / - Page d'accueil
• /top - Top 100 des torrents
• /torrent/[id] - Détails d'un torrent
• /series/[id] - Page d'une série TV
• /browse - Parcourir (à implémenter)
• /recent - Torrents récents (à implémenter)

Avertissement

Ce projet est à des fins éducatives uniquement. Assurez-vous de respecter les lois sur le droit d'auteur dans votre juridiction.