Merge pull request 'Add new links' (#25) from content-update into dev
Reviewed-on: #25
This commit is contained in:
commit
976e7af488
@ -1,103 +1,176 @@
|
||||
import React, { useState } from 'react';
|
||||
import { Navigation } from './components/layout/Navigation';
|
||||
import { Footer } from './components/layout/Footer';
|
||||
import { HeroSection } from './components/sections/HeroSection';
|
||||
import { TechFeaturesSection } from './components/sections/TechFeaturesSection';
|
||||
import { ServicesSection } from './components/sections/ServicesSection';
|
||||
import { TechFeaturesSection } from './components/sections/TechFeaturesSection';
|
||||
import { AboutSection } from './components/sections/AboutSection';
|
||||
import { Footer } from './components/layout/Footer';
|
||||
import { Popup } from './components/ui/Popup';
|
||||
import { ScrollToTopButton } from './components/ui/ScrollToTopButton';
|
||||
import { ParallaxBackground } from './components/ui/ParallaxBackground';
|
||||
import { URLS } from './config/constants';
|
||||
|
||||
// Define Service interface directly in App
|
||||
interface Service {
|
||||
name: string;
|
||||
url: string;
|
||||
image: string;
|
||||
description: string;
|
||||
features: string[];
|
||||
icon: string;
|
||||
}
|
||||
|
||||
const App: React.FC = () => {
|
||||
// Define services directly in the component with enhanced data
|
||||
const services: Service[] = [
|
||||
const services = [
|
||||
{
|
||||
name: "Wiki",
|
||||
url: URLS.services.wiki,
|
||||
image: "/src/assets/iceberg.png",
|
||||
image: "/path/to/wiki-image.jpg",
|
||||
icon: "📚",
|
||||
description: "Notre wiki collaboratif est votre centre de documentation technique. Accédez à des guides détaillés, des tutoriels et de la documentation API pour tous nos services.",
|
||||
description: "Plateforme collaborative de documentation technique et de partage de connaissances. Créez, modifiez et organisez vos guides, tutoriels et documentations en équipe avec un système de versioning intégré.",
|
||||
features: [
|
||||
"Documentation collaborative en temps réel",
|
||||
"Guides d'installation détaillés",
|
||||
"API et références techniques",
|
||||
"Tutoriels pas à pas",
|
||||
"Base de connaissances communautaire",
|
||||
"Recherche avancée intégrée"
|
||||
"Éditeur markdown avancé avec prévisualisation en temps réel",
|
||||
"Système de versioning pour suivre les modifications",
|
||||
"Collaboration en temps réel avec plusieurs contributeurs",
|
||||
"Recherche intelligente dans tous les documents",
|
||||
"Templates prédéfinis pour différents types de documentation",
|
||||
"Système de commentaires et de révisions",
|
||||
"Export PDF et HTML pour partage externe",
|
||||
"Intégration avec Git pour la sauvegarde"
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Gitea",
|
||||
url: URLS.services.gitea,
|
||||
image: "/src/assets/iceberg.png",
|
||||
image: "/path/to/gitea-image.jpg",
|
||||
icon: "🔧",
|
||||
description: "Instance Gitea auto-hébergée pour la gestion de vos dépôts Git. Collaborez sur vos projets avec un contrôle total sur votre code source.",
|
||||
description: "Service Git auto-hébergé lightweight et performant pour vos projets de développement. Alternative open-source à GitHub avec toutes les fonctionnalités essentielles pour gérer vos repositories.",
|
||||
features: [
|
||||
"Dépôts Git illimités",
|
||||
"Issues et pull requests",
|
||||
"Actions CI/CD intégrées",
|
||||
"Gestion d'équipes et permissions",
|
||||
"Interface web intuitive",
|
||||
"Intégration avec outils externes"
|
||||
"Repositories Git illimités publics et privés",
|
||||
"Interface web intuitive pour la gestion des projets",
|
||||
"Issues et pull requests avec système de review",
|
||||
"Wiki intégré pour chaque projet",
|
||||
"Actions CI/CD pour l'automatisation",
|
||||
"Gestion fine des permissions et des équipes",
|
||||
"API REST complète pour l'intégration",
|
||||
"Webhooks pour les notifications externes"
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Panel",
|
||||
name: "Panel Gaming",
|
||||
url: URLS.services.panel,
|
||||
image: "/src/assets/iceberg.png",
|
||||
image: "/path/to/panel-image.jpg",
|
||||
icon: "🎮",
|
||||
description: "Interface de gestion centralisée pour vos serveurs de jeux. Déployez, configurez et surveillez vos serveurs gaming en quelques clics.",
|
||||
description: "Interface de gestion centralisée pour tous vos serveurs de jeux. Déployez, configurez et surveillez facilement vos serveurs Minecraft, CS2, Garry's Mod et bien d'autres.",
|
||||
features: [
|
||||
"Déploiement automatisé de serveurs",
|
||||
"Monitoring en temps réel",
|
||||
"Gestion des ressources système",
|
||||
"Interface d'administration web",
|
||||
"Support multi-jeux",
|
||||
"Support de 20+ jeux populaires (Minecraft, CS2, GMod...)",
|
||||
"Déploiement en un clic avec templates préconfigurés",
|
||||
"Console d'administration en temps réel",
|
||||
"Gestion des fichiers avec éditeur intégré",
|
||||
"Monitoring des performances et ressources",
|
||||
"Système de sauvegarde automatique",
|
||||
"Planificateur de tâches automatisées"
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Pelican",
|
||||
url: URLS.services.pelican,
|
||||
image: "/path/to/pelican-image.jpg",
|
||||
icon: "🐧",
|
||||
description: "Générateur de sites statiques Python ultra-rapide et flexible. Créez des blogs, portfolios ou sites de documentation avec une performance optimale et un déploiement simplifié.",
|
||||
features: [
|
||||
"Gestion de serveurs de jeux avec serveurs dedies (Minecraft, CS2, Palworld...)",
|
||||
"Déploiement en un clic avec templates préconfigurés",
|
||||
"Console d'administration en temps réel",
|
||||
"Gestion des fichiers avec éditeur intégré",
|
||||
"Monitoring des performances et ressources",
|
||||
"Système de sauvegarde automatique",
|
||||
"Planificateur de tâches automatisées"
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Intranet",
|
||||
url: URLS.services.intra,
|
||||
image: "/path/to/intra-image.jpg",
|
||||
icon: "🏢",
|
||||
description: "Espace privé sécurisé de l'association pour centraliser les ressources internes, communications et outils de collaboration entre membres.",
|
||||
features: [
|
||||
"Tableau de bord personnalisé pour chaque membre",
|
||||
"Calendrier des événements et réunions",
|
||||
"Partage de fichiers sécurisé",
|
||||
"Forums de discussion privés",
|
||||
"Annuaire des membres avec profils",
|
||||
"Système de notifications internes",
|
||||
"Gestion des projets et tâches",
|
||||
"Archive des décisions et procès-verbaux"
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Mails",
|
||||
url: URLS.services.mails,
|
||||
image: "/path/to/mails-image.jpg",
|
||||
icon: "📧",
|
||||
description: "Service de messagerie électronique professionnel avec interface web moderne. Bénéficiez d'une adresse email personnalisée @la-banquise.fr avec toutes les fonctionnalités avancées.",
|
||||
features: [
|
||||
"Adresses email personnalisées @la-banquise.fr",
|
||||
"Interface webmail moderne et responsive",
|
||||
"Filtres anti-spam et antivirus intégrés",
|
||||
"Contacts et calendrier synchronisés",
|
||||
"Support IMAP/SMTP pour clients externes",
|
||||
"Stockage généreux avec archivage",
|
||||
"Chiffrement des communications",
|
||||
"Sauvegarde automatique des données"
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Password change",
|
||||
url: URLS.services.ssp,
|
||||
image: "/path/to/ssp-image.jpg",
|
||||
icon: "📧",
|
||||
description: "Service de messagerie électronique professionnel avec interface web moderne. Bénéficiez d'une adresse email personnalisée @la-banquise.fr avec toutes les fonctionnalités avancées.",
|
||||
features: [
|
||||
"Interface pour changer votre mot de passe"
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "OpenCloud",
|
||||
url: URLS.services.opencloud,
|
||||
image: "/path/to/opencloud-image.jpg",
|
||||
icon: "☁️",
|
||||
description: "Plateforme cloud collaborative open-source pour le stockage, le partage et la synchronisation de fichiers. Alternative libre à Google Drive avec contrôle total sur vos données.",
|
||||
features: [
|
||||
"Stockage cloud sécurisé et chiffré",
|
||||
"Synchronisation multi-appareils",
|
||||
"Partage de fichiers avec liens sécurisés",
|
||||
"Édition collaborative de documents",
|
||||
"Versioning automatique des fichiers",
|
||||
"Applications mobiles natives",
|
||||
"Intégration avec outils externes",
|
||||
"Sauvegarde géoredondante des données"
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
const [selectedService, setSelectedService] = useState<Service | null>(null);
|
||||
|
||||
// Inline accordion logic
|
||||
const App: React.FC = () => {
|
||||
const [selectedService, setSelectedService] = useState<typeof services[0] | null>(null);
|
||||
const [openAccordion, setOpenAccordion] = useState<string | null>(null);
|
||||
|
||||
const toggleAccordion = (title: string) => {
|
||||
setOpenAccordion(openAccordion === title ? null : title);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col min-h-screen w-full">
|
||||
<div className="min-h-screen bg-gradient-to-b from-banquise-blue-dark via-banquise-blue-dark/95 to-banquise-blue-dark text-white overflow-x-hidden relative">
|
||||
{/* Background Effects */}
|
||||
<ParallaxBackground />
|
||||
|
||||
{/* Main Content */}
|
||||
<div className="relative z-10">
|
||||
<Navigation />
|
||||
|
||||
<main className="flex-1 flex flex-col overflow-x-hidden overflow-y-auto">
|
||||
<div className="relative flex-1 bg-ocean-gradient w-full min-h-screen flex flex-col justify-start items-center overflow-x-hidden">
|
||||
|
||||
<HeroSection />
|
||||
<TechFeaturesSection />
|
||||
<ServicesSection services={services} onServiceClick={setSelectedService} />
|
||||
<TechFeaturesSection />
|
||||
<AboutSection openAccordion={openAccordion} toggleAccordion={toggleAccordion} />
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
|
||||
{/* Bouton de retour en haut */}
|
||||
{/* UI Components */}
|
||||
<ScrollToTopButton />
|
||||
|
||||
{selectedService && (
|
||||
<Popup service={selectedService} onClose={() => setSelectedService(null)} />
|
||||
<Popup
|
||||
service={selectedService}
|
||||
onClose={() => setSelectedService(null)}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -24,6 +24,26 @@ export const Footer: React.FC = () => (
|
||||
Panel
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href={URLS.services.pelican} className="text-banquise-gray/80 no-underline transition-all duration-200 inline-flex items-center hover:text-banquise-gray hover:translate-x-1 text-sm sm:text-base">
|
||||
Pelican
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href={URLS.services.intra} className="text-banquise-gray/80 no-underline transition-all duration-200 inline-flex items-center hover:text-banquise-gray hover:translate-x-1 text-sm sm:text-base">
|
||||
Intranet
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href={URLS.services.mails} className="text-banquise-gray/80 no-underline transition-all duration-200 inline-flex items-center hover:text-banquise-gray hover:translate-x-1 text-sm sm:text-base">
|
||||
Webmail
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href={URLS.services.opencloud} className="text-banquise-gray/80 no-underline transition-all duration-200 inline-flex items-center hover:text-banquise-gray hover:translate-x-1 text-sm sm:text-base">
|
||||
OpenCloud
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
@ -80,6 +80,38 @@ export const AboutSection: React.FC<AboutSectionProps> = ({ openAccordion, toggl
|
||||
<p className="text-banquise-gray/80 text-sm">Interface de gestion pour serveurs de jeux</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={`flex items-start space-x-4 p-4 ${commonStyles.gradients.card} rounded-xl ${commonStyles.cards.base}`}>
|
||||
<div className={`${commonStyles.icons.small} ${commonStyles.gradients.primaryBr} font-bold`}>🐧</div>
|
||||
<div>
|
||||
<h4 className="font-semibold text-banquise-gray mb-1">Pelican</h4>
|
||||
<p className="text-banquise-gray/80 text-sm">Générateur de sites statiques</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={`flex items-start space-x-4 p-4 ${commonStyles.gradients.card} rounded-xl ${commonStyles.cards.base}`}>
|
||||
<div className={`${commonStyles.icons.small} ${commonStyles.gradients.primaryBr} font-bold`}>🏢</div>
|
||||
<div>
|
||||
<h4 className="font-semibold text-banquise-gray mb-1">Intranet</h4>
|
||||
<p className="text-banquise-gray/80 text-sm">Espace privé de l'association</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={`flex items-start space-x-4 p-4 ${commonStyles.gradients.card} rounded-xl ${commonStyles.cards.base}`}>
|
||||
<div className={`${commonStyles.icons.small} ${commonStyles.gradients.primaryBr} font-bold`}>📧</div>
|
||||
<div>
|
||||
<h4 className="font-semibold text-banquise-gray mb-1">Webmail</h4>
|
||||
<p className="text-banquise-gray/80 text-sm">Service de messagerie électronique</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={`flex items-start space-x-4 p-4 ${commonStyles.gradients.card} rounded-xl ${commonStyles.cards.base}`}>
|
||||
<div className={`${commonStyles.icons.small} ${commonStyles.gradients.primaryBr} font-bold`}>☁️</div>
|
||||
<div>
|
||||
<h4 className="font-semibold text-banquise-gray mb-1">OpenCloud</h4>
|
||||
<p className="text-banquise-gray/80 text-sm">Plateforme cloud collaborative</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p className={`${commonStyles.text.muted} mt-4`}>
|
||||
Tous nos services sont maintenus avec soin et régulièrement mis à jour pour garantir une expérience optimale.
|
||||
|
||||
@ -3,7 +3,12 @@ export const URLS = {
|
||||
wiki: "https://wiki.la-banquise.fr",
|
||||
gitea: "https://git.la-banquise.fr",
|
||||
panel: "https://panel.la-banquise.fr",
|
||||
auth: "https://auth.la-banquise.fr"
|
||||
auth: "https://auth.la-banquise.fr",
|
||||
pelican: "https://pelican.la-banquise.fr",
|
||||
intra: "https://intra.la-banquise.fr",
|
||||
mails: "https://mails.la-banquise.fr",
|
||||
opencloud: "https://opencloud.la-banquise.fr"
|
||||
ssp: "https://ssp.la-banquise.fr"
|
||||
},
|
||||
social: {
|
||||
discord: "https://discord.gg/labanquise"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user