adrian/gaia
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update css

Browse Source
This commit is contained in:
Adrian Amaglio 2024-03-13 10:57:55 +01:00
parent 2818d3675c
commit 5fab510d67
6 changed files with 111 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/balade.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 111 KiB

19
src/index.html
View File

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Les Enfants de Gaia</title> <title>Les Enfants de Gaia</title>
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="style.css">
</head> </head>
<body> <body>
<header> <header>
@ -20,28 +20,45 @@
</header> </header>
<section id="accueil"> <section id="accueil">
<img src="./balade.jpg" />
<main>
<h2>Bienvenue dans l'univers mystique</h2> <h2>Bienvenue dans l'univers mystique</h2>
<p>L'association <b>Les Enfants de Gaia</b> vous guide à travers les énergies du cosmos. Explorez notre site pour découvrir nos événements, ateliers et séances de méditation.</p> <p>L'association <b>Les Enfants de Gaia</b> vous guide à travers les énergies du cosmos. Explorez notre site pour découvrir nos événements, ateliers et séances de méditation.</p>
</main>
</section> </section>
<section id="evenements"> <section id="evenements">
<img src="jardin.jpg" />
<main>
<h2>Nos Événements</h2> <h2>Nos Événements</h2>
<ul> <ul>
<li>Atelier de méditation stellaire</li> <li>Atelier de méditation stellaire</li>
<li>Conférence sur les énergies lunaires</li> <li>Conférence sur les énergies lunaires</li>
<li>Retraite spirituelle en pleine nature</li> <li>Retraite spirituelle en pleine nature</li>
</ul> </ul>
</main>
</section> </section>
<section id="equipe"> <section id="equipe">
<img src="laredoute.jpg" />
<main>
<h2>Notre Équipe</h2> <h2>Notre Équipe</h2>
<p>Nous sommes une équipe passionnée par l'astrologie, la méditation et le bien-être. Rencontrez nos membres et découvrez leurs expertises.</p> <p>Nous sommes une équipe passionnée par l'astrologie, la méditation et le bien-être. Rencontrez nos membres et découvrez leurs expertises.</p>
</main>
</section> </section>
<section id="contact"> <section id="contact">
<img src="lettre.jpg" />
<main>
<h2>Contactez-nous</h2> <h2>Contactez-nous</h2>
<p>Pour toute question ou demande, n'hésitez pas à nous contacter à l’adresse enfants-de-gaia@jean-cloud.net</p> <p>Pour toute question ou demande, n'hésitez pas à nous contacter à l’adresse enfants-de-gaia@jean-cloud.net</p>
</main>
</section> </section>
<footer>
<p>
Text généré par chatGPT, images pixabay.com, hébergement web jean-cloud.net, css domaine publique.
</p>
</footer>
</body> </body>
</html> </html>

BIN
src/jardin.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 124 KiB

BIN
src/laredoute.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 130 KiB

BIN
src/lettre.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 109 KiB

93
src/style.css Normal file
View File

@ -0,0 +1,93 @@
/* Réinitialisation des marges et des paddings */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html {
height:95%;
}
/* Styles pour le corps de la page */
body {
font-size:1.4em;
font-family: 'Helvetica Neue', sans-serif;
background-color: #f9f9f9;
color: #333;
height:95%;
}
/* Styles pour l'en-tête */
header {
background-color: #26a18a8c;
color: #fff;
padding: 20px;
text-align: center;
}
/* Styles pour les titres de section */
h1, h2 {
margin-bottom: 10px;
}
/* Styles pour les liens de navigation */
ul {
list-style: none;
}
nav ul li {
display: inline-block;
margin-right: 20px;
}
nav ul li a {
text-decoration: none;
color: #333;
font-weight: bold;
}
/* Styles pour les sections */
section {
background-color: #fff;
border-radius: 5px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
position:relative;
}
main {
color :#fff;
background-color: #0005;
padding: 20px;
position: absolute;
top:0;
width:100%;
}
/* Styles spécifiques pour chaque section */
section img {
width:100%;
}
#evenements main {
bottom:0 !important;
background-color: #0008;
top:auto;
}
#equipe main{
top:auto;
bottom:0 !important;
background-color: #0008;
}
#contact main {
top:auto;
bottom:0 !important;
background-color: #0008;
}
footer {
padding: 10px;
}