leproide/forgium-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(design): integrate OuiHeberg/OVHcloud comparison matrix and trust banner into live site

Browse source
This commit is contained in:
Mathias 2026-09-09 22:25:09 +02:00
parent bb3b3457cf
commit bf6f802911
4 changed files with 262 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
Idées/MASTER_ROADMAP_500_ETAPES.md
View file

@ -216,9 +216,9 @@
- [x] **Étape 189** : Première connexion réussie sur l'interface d'administration Pterodactyl
- [ ] **Étape 190** : Activation obligatoire de l'authentification à deux facteurs (2FA TOTP) sur le compte admin
- [x] **Étape 191** : Personnalisation du titre de la plateforme dans les paramètres : Forgium Cloud (validé en prod)
- [ ] **Étape 192** : Création de la première zone géographique d'hébergement : 'Garage-Node1 (France)'
- [ ] **Étape 193** : Création de la clé d'API d'administration Pterodactyl avec tous les droits de gestion
- [ ] **Étape 194** : Stockage chiffré de la clé d'API pour la future passerelle de commande automatique
- [x] **Étape 192** : Création de la première zone géographique d'hébergement : 'Garage-Node1 (France)'
- [x] **Étape 193** : Création de la clé d'API d'administration Pterodactyl avec tous les droits de gestion
- [x] **Étape 194** : Stockage chiffré de la clé d'API pour la passerelle de commande automatique Paymenter (CT 103)
- [ ] **Étape 195** : Contrôle de la charge système du CT Panel (CPU < 2%, RAM < 400 Mo au repos)
- [ ] **Étape 196** : Mise en place d'un script de sauvegarde quotidien de la base MariaDB (mysqldump gzip)
- [ ] **Étape 197** : Test de restauration de la base de données sur une instance de test pour valider le backup

24
site-web/index.html
View file

@ -85,30 +85,40 @@
<!-- APERÇU RAPIDE DES OFFRES -->
<section class="container section">
<div class="free-banner">
<div class="free-banner-content">
<span class="free-badge">OFFRE DE LANCEMENT</span>
<div class="free-banner-text">
Accès libre à nos infrastructures : <strong>0.00 € / mois</strong> sur l'ensemble de notre catalogue. Déploiement automatique en 15 secondes.
</div>
</div>
<a href="https://client.forgium.fr" class="btn btn-sm btn-primary">Créer mon compte &rarr;</a>
</div>
<div class="section-head">
<div class="section-tag">CATALOGUE OFFICIEL</div>
<div class="section-tag">CATALOGUE OFFICIEL • ACCÈS LIBRE 0.00 €</div>
<h2>Des Solutions Pensées Pour Vous</h2>
<p>Découvrez notre gamme complète d'hébergement sans engagement.</p>
<p>Hébergez vos serveurs de jeux et vos applications sur du matériel dédié non partagé.</p>
</div>
<div class="quick-cards">
<div class="quick-card">
<div class="quick-icon">🎮</div>
<h3>Serveurs Minecraft</h3>
<h3>Serveurs Minecraft (0.00 €)</h3>
<p>Paper, Fabric, Forge installables en 1 clic avec des performances sans lag pour vos joueurs.</p>
<a href="offres.html#minecraft" class="quick-link">Voir les formules Minecraft &rarr;</a>
<a href="https://client.forgium.fr" class="quick-link">Déployer sur Pterodactyl &rarr;</a>
</div>
<div class="quick-card">
<div class="quick-icon">🤖</div>
<h3>Bots Discord & Apps</h3>
<h3>Bots Discord & Apps (0.00 €)</h3>
<p>Hébergez vos bots en Python, Node.js ou Java avec redémarrage automatique 24/7.</p>
<a href="offres.html#bots" class="quick-link">Voir les formules Bots &rarr;</a>
<a href="https://client.forgium.fr" class="quick-link">Déployer mon bot &rarr;</a>
</div>
<div class="quick-card">
<div class="quick-icon">🛡️</div>
<h3>Forge Shield Protection</h3>
<p>Bouclier réseau multicouche et sauvegardes automatiques quotidiennes pour chaque serveur.</p>
<a href="infrastructure.html" class="quick-link">En savoir plus &rarr;</a>
<a href="infrastructure.html" class="quick-link">Notre architecture &rarr;</a>
</div>
</div>
</section>

121
site-web/offres.html
View file

@ -37,9 +37,40 @@
<main class="container section">
<div class="section-head">
<div class="section-tag">CATALOGUE OFFICIEL</div>
<h2>Nos Formules d'Hébergement</h2>
<p>Des ressources réelles réservées pour chaque client. Déploiement automatisé instantané.</p>
<div class="section-tag">CATALOGUE OFFICIEL • LIVRAISON IMMÉDIATE</div>
<h2>Des Formules Haute Performance à 0.00 €</h2>
<p>Infrastructure matérielle souveraine sur AMD Ryzen 7 & SSD NVMe. Provisionnement automatisé 24/7 en quelques secondes.</p>
</div>
<!-- BANNIÈRE ACCÈS LIBRE 0.00 € -->
<div class="free-banner">
<div class="free-banner-content">
<span class="free-badge">OFFRE DE LANCEMENT</span>
<div class="free-banner-text">
Toutes nos formules sont actuellement à <strong>0.00 € / mois</strong> sans engagement. Créez votre compte, commandez et votre serveur est instantanément déployé sur notre cluster !
</div>
</div>
<a href="https://client.forgium.fr" class="btn btn-sm btn-primary">Créer mon compte &rarr;</a>
</div>
<!-- TRUST STRIP (Style OuiHeberg / OVHcloud) -->
<div class="trust-strip">
<div class="trust-item">
<span class="trust-icon">⚡</span>
<span>Déploiement en &lt; 15s</span>
</div>
<div class="trust-item">
<span class="trust-icon">🛡️</span>
<span>Anti-DDoS Game Inclus</span>
</div>
<div class="trust-item">
<span class="trust-icon">🇫🇷</span>
<span>Hébergé 100% en France</span>
</div>
<div class="trust-item">
<span class="trust-icon">⚙️</span>
<span>Panel Pterodactyl & Monaco Editor</span>
</div>
</div>
<div class="pricing-grid">
@ -152,6 +183,90 @@
<a href="#cloud" class="btn btn-block btn-outline">Bientôt Disponible</a>
</div>
</div>
<!-- TABLEAU COMPARATIF DÉTAILLÉ (Style PlanetHoster / OVHcloud) -->
<section class="comparison-section">
<div class="section-head">
<div class="section-tag">MATRICE TECHNIQUE</div>
<h2>Comparatif Exhaustif des Formules</h2>
<p>Chaque serveur dispose de son propre conteneur isolé avec ressources dédiées non partagées.</p>
</div>
<div class="table-responsive">
<table class="compare-table">
<thead>
<tr>
<th>Fonctionnalité / Spécification</th>
<th>Bot Discord (Node/Python)</th>
<th>Minecraft Starter</th>
<th>Minecraft Community</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Tarif Mensuel</strong></td>
<td class="val-highlight">0.00 € (Offert)</td>
<td class="val-highlight">0.00 € (Offert)</td>
<td class="val-highlight">0.00 € (Offert)</td>
</tr>
<tr>
<td><strong>Moteur Processeur</strong></td>
<td>1 vCPU AMD Ryzen 7 3700X</td>
<td>1.5 vCPU Dédié</td>
<td>2 vCPU Multi-thread</td>
</tr>
<tr>
<td><strong>Mémoire RAM Garantie</strong></td>
<td>512 Mo DDR4</td>
<td>1536 Mo (1.5 Go)</td>
<td>RAM Adaptative</td>
</tr>
<tr>
<td><strong>Stockage SSD NVMe</strong></td>
<td>2 Go Ultra-Rapide</td>
<td>5 Go PCIe 4.0</td>
<td>SSD NVMe Dédié</td>
</tr>
<tr>
<td><strong>Protection DDoS Forgium Shield</strong></td>
<td class="check-green">✓ Couche 3/4/7</td>
<td class="check-green">✓ Couche 3/4/7</td>
<td class="check-green">✓ Couche 3/4/7 Spécial Jeux</td>
</tr>
<tr>
<td><strong>Accès SFTP & Gestionnaire de Fichiers</strong></td>
<td class="check-green">✓ Inclus</td>
<td class="check-green">✓ Monaco Editor (VS Code)</td>
<td class="check-green">✓ Monaco Editor (VS Code)</td>
</tr>
<tr>
<td><strong>Sauvegardes Automatiques</strong></td>
<td class="check-green">✓ 1 Snapshot</td>
<td class="check-green">✓ 1 Sauvegarde Quotidienne</td>
<td class="check-green">✓ Multiples Sauvegardes</td>
</tr>
<tr>
<td><strong>Console Interactive en Direct</strong></td>
<td class="check-green">✓ Websocket SSL</td>
<td class="check-green">✓ Websocket SSL</td>
<td class="check-green">✓ Websocket SSL</td>
</tr>
<tr>
<td><strong>Engagement</strong></td>
<td>Sans engagement (Résiliez en 1 clic)</td>
<td>Sans engagement</td>
<td>Sans engagement</td>
</tr>
<tr>
<td><strong>Action</strong></td>
<td><a href="https://client.forgium.fr" class="btn btn-sm btn-outline">Commander</a></td>
<td><a href="https://client.forgium.fr" class="btn btn-sm btn-primary">Déployer (0.00 €)</a></td>
<td><a href="https://client.forgium.fr" class="btn btn-sm btn-outline">Commander</a></td>
</tr>
</tbody>
</table>
</div>
</section>
</main>
<footer class="footer-wrapper">

130
site-web/style.css
View file

@ -735,13 +735,131 @@ h1 {
padding: 2rem;
}
.contact-box h3 {
font-size: 1.4rem;
margin-bottom: 0.5rem;
/* TRUST BADGES & METRICS (Inspiré OuiHeberg / OVHcloud) */
.trust-strip {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 2.5rem;
padding: 1.5rem 2rem;
margin: 2rem auto 3.5rem;
background: rgba(15, 23, 42, 0.45);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 16px;
backdrop-filter: blur(12px);
}
.contact-box p {
color: var(--text-muted);
margin-bottom: 1.8rem;
.trust-item {
display: flex;
align-items: center;
gap: 0.75rem;
font-size: 0.92rem;
font-weight: 600;
color: var(--text-main);
}
.trust-item .trust-icon {
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
border-radius: 8px;
background: rgba(56, 189, 248, 0.12);
border: 1px solid rgba(56, 189, 248, 0.25);
color: var(--accent-cyan);
}
/* FREE BANNER NOTIFICATION */
.free-banner {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 1rem;
background: linear-gradient(90deg, rgba(37, 99, 235, 0.2) 0%, rgba(56, 189, 248, 0.15) 100%);
border: 1px solid rgba(56, 189, 248, 0.35);
border-radius: 16px;
padding: 1.2rem 1.8rem;
margin-bottom: 2.5rem;
}
.free-banner-content {
display: flex;
align-items: center;
gap: 1rem;
}
.free-badge {
background: #10b981;
color: #fff;
font-size: 0.75rem;
font-weight: 800;
padding: 0.3rem 0.7rem;
border-radius: 9999px;
letter-spacing: 0.5px;
text-transform: uppercase;
}
.free-banner-text {
font-size: 0.95rem;
font-weight: 500;
}
.free-banner-text strong {
color: var(--accent-cyan);
}
/* COMPARISON TABLE (Inspiré PlanetHoster & OVHcloud) */
.comparison-section {
margin: 4.5rem 0;
}
.table-responsive {
overflow-x: auto;
border-radius: 18px;
border: 1px solid var(--border);
background: var(--bg-card);
backdrop-filter: blur(16px);
}
.compare-table {
width: 100%;
border-collapse: collapse;
text-align: left;
font-size: 0.92rem;
}
.compare-table th, .compare-table td {
padding: 1.1rem 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.compare-table th {
background: rgba(11, 17, 32, 0.85);
font-weight: 700;
color: var(--text-main);
font-size: 0.95rem;
}
.compare-table tr:last-child td {
border-bottom: none;
}
.compare-table tr:hover td {
background: rgba(255, 255, 255, 0.02);
}
.check-green {
color: #34d399;
font-weight: 800;
}
.val-highlight {
font-family: 'JetBrains Mono', monospace;
font-weight: 700;
color: var(--accent-cyan);
}