projet-R1-02/catalogue.html at main · mankaiadamgit/projet-R1-02 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
<!DOCTYPE html>
<html lang="fr">
<head>
    <link rel="stylesheet" href="style.css">
    <link rel="preconnect" href="https://fonts.googleapis.com"> <!-- Liens pour la police d'écriture custom -->
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <!-- Liens pour la police d'écriture custom -->
    <link href="https://fonts.googleapis.com/css2?family=Geo:ital@0;1&display=swap" rel="stylesheet">   <!-- Liens pour la police d'écriture custom -->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SpaceTravel</title>
    <link rel="icon" type="image/png" href="assets/favicon.png">
    <meta name="description" content="Découvrez notre site sur les voyages Spatiaux !">
</head>

<body>
    <nav class="menu">
        <ul>
            <li><a href="index.html">Accueil</a></li>
            <li><a href="catalogue.html">Catalogue</a></li>
            <li><a href="formules.html">Tarifs</a></li>
            <li><a href="propos.html">A propos</a></li>
            <li><a href="reclamations.html">Réclamations</a></li>
            <li><a class="btn_menu" href="#"><img src="assets/theme_icon.png" alt="icone du bouton de changement de theme"></a></li>
        </ul>
    </nav>
    <div>
        <h1>Destinations...</h1>

    </div>
    <div class="bloc-p2">
        <img src="assets/venus.png" alt="miniature de Vénus" class="planet-icon">
        <h3 class="planete_mini">Vénus</h3>
        <p class="desc_planete"> Vénus est la deuxième planète du Système solaire et l’un des astres les plus brillants du ciel.
             Souvent surnommée la “sœur de la Terre”, elle possède cependant une atmosphère extrêmement dense et brûlante,
             rendant sa surface totalement inhabitable. Sa couche de nuages acides lui donne un éclat jaune caractéristique.</p>

    </div>
    <div class="bloc-p2">
        <img src="assets/mars.png" alt="miniature de Mars" class="planet-icon">
        <h3 class="planete_mini">Mars</h3>
        <p class="desc_planete">Mars, la célèbre “planète rouge”, est une planète rocheuse plus froide et plus petite que la Terre.
             Sa surface est recouverte de poussière riche en oxyde de fer, ce qui lui donne sa couleur rougeâtre.
             Elle abrite des montagnes colossales, des canyons immenses et reste l’un des astres les plus étudiés pour la recherche de vie passée.</p>

    </div>
   <div class="bloc-p2">
        <img src="assets/jupiter.png" alt="miniature de Jupiter" class="planet-icon">
        <h3 class="planete_mini">Jupiter</h3>
        <p class="desc_planete">Jupiter est la plus grande planète du Système solaire, une géante gazeuse dont l’atmosphère tourbillonne en d’immenses tempêtes.
             La plus célèbre, la Grande Tache Rouge, est un cyclone gigantesque visible depuis des siècles.
              Son système d’anneaux fins et ses nombreuses lunes en font un monde fascinant.</p>
    </div>
    <div class="bloc-p2">
        <img src="assets/saturne.png" alt="miniature de Saturne" class="planet-icon">
        <h3 class="planete_mini">Saturne</h3>
        <p class="desc_planete">Saturne est une géante gazeuse reconnue pour ses spectaculaires anneaux composés de glace et de poussière.
             Sa silhouette élégante la rend unique parmi les planètes.
             Malgré son apparence calme, son atmosphère est secouée de vents violents et de tempêtes massives.</p>
    </div>
    <div class="bloc-p2">
        <img src="assets/pandora.png" alt="miniature de Pandora" class="planet-icon"> <!-- Pour les fans d'Avatar -->
        <h3 class="planete_mini">Pandora</h3>
        <p class="desc_planete"> Pandora est une lune luxuriante orbite autour de Polyphémus.
             Sa biosphère regorge de forêts bioluminescentes, de montagnes flottantes et d’une faune incroyablement diversifiée.
             C’est le monde natal du peuple Na’vi, qui vit en harmonie avec une nature profondément interconnectée.</p>
    </div>
    <div class="bloc-p2">
        <img src="assets/polyphemus.png" alt="miniature de Polyphémus" class="planet-icon">
        <h3 class="planete_mini">Polyphémus</h3>
        <p class="desc_planete">Polyphémus est une immense géante gazeuse bleutée située dans le système d’Alpha Centauri.
             Elle possède plusieurs lunes, dont Pandora, la plus connue.
             Depuis sa surface, son atmosphère turbulente et ses bandes nuageuses créent un spectacle lumineux impressionnant dans le ciel de ses satellites.</p>
    </div>
    <div class="bloc-p2">
        <img src="assets/cyberstan.png" alt="miniature de Cyberstan" class="planet-icon"> <!-- Pour les fans de HellDivers (moi du coup) -->
        <h3 class="planete_mini">Cyberstan</h3>
        <p class="desc_planete"> Cyberstan est une planète totalement transformée par la technologie et les machines.
             Ses paysages sont dominés par des installations industrielles, des ruines métalliques et des champs de bataille mécaniques.
             C’est le cœur du domaine des Automatons, un monde où la machine a surpassé l’organique.</p>
    </div>
    <div class="bloc-p2">
        <img src="assets/Mon-Cala.png" alt="miniature de Mon Cala" class="planet-icon"> <!-- Pour les fans bizarre de StarWars -->
        <h3 class="planete_mini">Mon-Cala</h3>
        <p class="desc_planete"> Mon-Cala est un monde océanique presque entièrement recouvert d’eau.
             Habité par les Mon Calamari et les Quarren, il abrite d’immenses cités sous-marines et une culture avancée tournée vers l’ingénierie navale.
             Sa beauté bleutée contraste avec son histoire souvent marquée par les conflits galactiques.</p>
    </div>
    <div class="bloc-p2">
        <img src="assets/planete_rose.png" alt="miniature d' Arkéos" class="planet-icon"> <!-- Planète fictive -->
        <h3 class="planete_mini">Arkéos</h3>
        <p class="desc_planete">Arkéos est une petite planète rocheuse dont la surface est teintée de rose par des minéraux irisés uniques.
             Ses déserts lumineux, ses falaises cristallines et ses légers voiles atmosphériques rosés lui donnent une apparence presque onirique.
             Malgré son climat sec, elle abrite une flore rare capable de briller doucement au crépuscule.</p>
    </div>
    <script>
        const btn = document.querySelector(".btn_menu");

        btn.addEventListener("click", function (e) {
            e.preventDefault(); // empêche le lien #
        document.body.classList.toggle("alt-theme");
    });
    </script>
</body>
</html>