Skip to content

Commit

Permalink
Commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@psychowolf960
psychowolf960 committed Feb 3, 2025
1 parent d7fda1c commit a2ed071
Show file tree
Hide file tree
Showing 8 changed files with 329 additions and 82 deletions.
75 changes: 50 additions & 25 deletions CSS/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ body {
font-family: "Verdana", "Helvetica", sans-serif;
margin: 0;
padding: 0;
line-height: 1;
line-height: 1.5;
background-color: #f5f5f5;
color: #333;
display: flex;
Expand All @@ -15,17 +15,16 @@ body {
main {
flex: 1;
text-align: center;
margin: 20px auto;
padding: 20px;
min-width: 900px;
max-width: 900px;
margin: 5vh auto;
padding: 5vh 5vw;
min-width: 80%;
max-width: 90%;
background: #ffffff;
border-radius: 10px;
box-shadow: 0 4px 60px rgba(0, 0, 0, 0.1);
box-shadow: 0 0.5vh 1vh rgba(0, 0, 0, 0.1);
}

main h1 {
font-size: 2rem;
font-size: 3rem;
color: #18004b;
}

Expand All @@ -34,32 +33,35 @@ main h1 {
background-color: #18004b;
overflow: hidden;
display: flex;
justify-content: flex-end;
padding: 0 10px;
justify-content: flex-start;
padding: 0 2vw;
}

.topnav a {
color: #ad9fff;
text-decoration: none;
text-align: center;
padding: 15px 20px;
font-size: 16px;
padding: 2vh 3vw;
font-size: 1rem;
transition: background-color 0.3s ease, color 0.3s ease;
margin-left: auto;
}

.topnav a:hover {
background-color: #4a007d;
color: #ffffff;
border-radius: 5px;
}

logo {
border-radius: 8px;
vertical-align: left;
}
/* Footer */
footer {
background-color: #18004b;
color: #ad9fff;
text-align: center;
padding: 15px 10px;
font-size: 14px;
padding: 2vh 2vw;
font-size: 0.9rem;
margin-top: auto;
}

Expand All @@ -74,14 +76,37 @@ footer a:hover {
text-decoration: underline;
}

/* Responsive */
@media (max-width: 768px) {
.topnav a {
font-size: 14px;
padding: 12px 10px;
}
/* Style sections */
section {
background-color: #f9f9ff;
border: 0.2vh solid #e0e0e0;
padding: 4vh 4vw;
margin-bottom: 4vh;
transition: transform 0.1s ease;
}

main h1 {
font-size: 1.8rem;
}
/* Hover sections */
section:hover {
transform: scale(1.005);
}

/* Title sections */
section h2 {
font-size: 1.5rem;
color: #18004b;
margin-bottom: 2vh;
border-bottom: 0.4vh solid #ad9fff;
display: inline-block;
}

/* Lists */
section ul {
margin-top: 2vh;
display: inline-block;
text-align: left;
padding-left: 4vw;
}

section ul li {
margin-bottom: 1.5vh;
}
49 changes: 41 additions & 8 deletions Html/about.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,23 +4,56 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Ecole Coda</title>
<title>Ecole Coda - À propos</title>
<link rel="stylesheet" href="../CSS/style.css">
<link rel="icon" href="./favicon.ico" type="image/x-icon">
</head>
<body>
<nav>
<nav> <!-- Barre de Navigation -->
<div class="topnav">
<a href="../Index.html">accueil</a>
<a href="./events.html">Evenements</a>
<img src="../Images/tempLogo.svg" alt="Logo">
<a href="../Index.html">Accueil</a>
<a href="./events.html">Événements</a>
<a href="./instruments.html">Instruments</a>
<a href="./signin.html">Inscriptions</a>
</div>
</div>
</nav>
<main>
<h1>A propos</h1>
<main> <!-- Contenu de la page -->
<h1>À propos</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tincidunt, risus vel varius aliquam, ex ligula
tempor velit, ut consequat lorem eros eget eros. Cras nec libero vitae elit efficitur malesuada.
</p>
<section>
<h2>Notre Mission</h2>
<p>
Integer at lacus non odio volutpat pharetra. Curabitur tristique, orci a sodales vehicula, tortor nisl sagittis
purus, id aliquet elit sapien quis ligula. Suspendisse ac magna ultricies, scelerisque lorem sed, malesuada augue.
</p>
</section>
<section>
<h2>Notre Histoire</h2>
<p>
Sed viverra interdum turpis, et aliquam urna dictum a. Vestibulum non felis nisi. Nullam convallis sit amet
turpis a egestas. Morbi eget eros non lacus tincidunt fringilla sit amet ac libero.
</p>
</section>
<section>
<h2>Pourquoi Choisir Coda ?</h2>
<p>
Vestibulum ac nisi feugiat, pulvinar arcu sed, eleifend lorem. Donec eu augue libero. In varius vel odio nec
sodales. Phasellus suscipit, lacus a blandit consectetur, felis tortor sodales libero, vitae placerat elit lacus
vel nisi.
</p>
</section>
</main>

<footer> <!-- Pied de page -->
<div class="footer-content">
<p>&copy; 2025 Ecole Coda. Tous droits réservés.</p>
<p>Contactez-nous : <a href="mailto:[email protected]">[email protected]</a></p>
<p>Téléphone : <a href="tel:+3315152780">+36 30 36 30 36 30</a></p>
</div>
</footer>
<script src="../JS/index.js"></script>
</body>
</html>
54 changes: 49 additions & 5 deletions Html/events.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,22 +4,66 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Ecole Coda</title>
<title>Ecole Coda - Événements</title>
<link rel="stylesheet" href="../CSS/style.css">
<link rel="icon" href="./favicon.ico" type="image/x-icon">
</head>
<body>
<nav>
<div class="topnav">
<a href="../Index.html">accueil</a>
<a href="./about.html">A propos</a>
<img src="../Images/tempLogo.svg" alt="Logo">
<a href="../Index.html">Accueil</a>
<a href="./about.html">À propos</a>
<a href="./instruments.html">Instruments</a>
<a href="./signin.html">Inscriptions</a>
</div>
</div>
</nav>
<main>
<h1>Les Evenements</h1>
<h1>Les Événements</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Découvrez les événements organisés par l'école de musique Coda pour partager votre passion musicale !
</p>

<section>
<h2>Concerts à venir</h2>
<p>
Proin tincidunt risus nec massa sodales, eu efficitur arcu vulputate. Nos concerts offrent une opportunité unique de découvrir le talent de nos élèves et professeurs.
</p>
<ul>
<li><strong>Concert world trade center :</strong> Le 11 septembre 2022, à 17h.</li>
<li><strong>Festival des Jeunes déceptions :</strong> Le 10 juin 2025, à 14h.</li>
</ul>
</section>

<section>
<h2>Ateliers et Masterclasses</h2>
<p>
Nulla facilisi. Integer posuere sem ut nisi fringilla, vel auctor justo varius. Participez à nos ateliers et masterclasses pour approfondir vos compétences musicales.
</p>
<ul>
<li><strong>Atelier Bébés :</strong> Animé par P.Diddy, le 25 février 2025.</li>
<li><strong>Masterclass Dropshipping :</strong> Avec un invité spécial, le 12 avril 2025.</li>
</ul>
</section>

<section>
<h2>Événements passés</h2>
<p>
Phasellus dapibus, ex sit amet malesuada blandit, mi felis commodo arcu, a sollicitudin nunc sapien et sapien. Revivez nos événements mémorables.
</p>
<ul>
<li><strong>Concert d'hiver :</strong> Décembre 2024.</li>
<li><strong>Fête de la muzik :</strong> Juin 2024.</li>
</ul>
</section>
</main>
<footer>
<div class="footer-content">
<p>&copy; 2025 Ecole Coda. Tous droits réservés.</p>
<p>Contactez-nous : <a href="mailto:[email protected]">[email protected]</a></p>
<p>Téléphone : <a href="tel:+3315152780">+36 30 36 30 36 30</a></p>
</div>
</footer>
<script src="../JS/index.js"></script>
</body>
</html>
3 changes: 2 additions & 1 deletion Html/instruments.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
<body>
<nav> <!-- Barre de Navigation -->
<div class="topnav">
<img src="../Images/tempLogo.svg" alt="Logo">
<a href="../Index.html">Accueil</a>
<a href="./about.html">À propos</a>
<a href="./events.html">Événements</a>
Expand Down Expand Up @@ -48,7 +49,7 @@ <h2>Les percussions</h2>
<div class="footer-content">
<p>&copy; 2025 Ecole Coda. Tous droits réservés.</p>
<p>Contactez-nous : <a href="mailto:[email protected]">[email protected]</a></p>
<p>Téléphone : <a href="tel:+33123456789">+33 1 23 45 67 89</a></p>
<p>Téléphone : <a href="tel:+3315152780">+36 30 36 30 36 30</a></p>
</div>
</footer>
<script src="../JS/index.js"></script>
Expand Down
64 changes: 57 additions & 7 deletions Html/signin.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,22 +4,72 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Ecole Coda</title>
<title>Ecole Coda - Inscriptions</title>
<link rel="stylesheet" href="../CSS/style.css">
<link rel="icon" href="./favicon.ico" type="image/x-icon">
</head>
<body>
<nav>
<nav> <!-- Barre de Navigation -->
<div class="topnav">
<a href="../Index.html">accueil</a>
<a href="./about.html">A propos</a>
<a href="./events.html">Evenements</a>
<img src="../Images/tempLogo.svg" alt="Logo">
<a href="../Index.html">Accueil</a>
<a href="./about.html">À propos</a>
<a href="./events.html">Événements</a>
<a href="./instruments.html">Instruments</a>
</div>
</div>
</nav>
<main>
<main> <!-- Contenu de la page -->
<h1>Inscriptions</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tincidunt risus nec massa sodales, eu efficitur arcu vulputate.
Rejoignez l'école de musique Coda ! Rejoignez l'école de musique Coda ! Rejoignez l'école de musique Coda ! Rejoignez l'école de musique Coda !
</p>

<section>
<h2>Procédure d'inscription</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla facilisi. Integer posuere sem ut nisi fringilla, vel auctor justo varius.
Suivez les étapes suivantes pour vous inscrire :
</p>
<ol>
<li>Remplissez le formulaire d'inscription en ligne.</li>
<li>Envoyez les documents nécessaires (copie d'identité, justificatif de domicile, etc.).</li>
<li>Payez les frais d'inscription pour valider votre place.</li>
</ol>
</section>

<section>
<h2>Tarifs et options</h2>
<p>
Phasellus dapibus, ex sit amet malesuada blandit, mi felis commodo arcu, a sollicitudin nunc sapien et sapien.
Choisissez parmi nos différentes formules adaptées à vos besoins :
</p>
<ul>
<li><strong>Formule noob :</strong> Lorem ipsum dolor sit amet.</li>
<li><strong>Formule premium :</strong> Consectetur adipiscing elit.</li>
<li><strong>Formule légendaire :</strong> Integer posuere sem ut nisi fringilla.</li>
</ul>
</section>

<section>
<h2>Contact pour plus d'informations</h2>
<p>
Si vous avez des questions, n'hésitez pas à nous contacter :
</p>
<!-- Fromulaire de contact/Inscriptions -->
<ul>
<li>Email : <a href="mailto:[email protected]">[email protected]</a></li>
<li>Téléphone : <a href="tel:+33123456789">+33 1 23 45 67 89</a></li>
</ul>
</section>
</main>
<footer> <!-- Pied de page -->
<div class="footer-content">
<p>&copy; 2025 Ecole Coda. Tous droits réservés.</p>
<p>Contactez-nous : <a href="mailto:[email protected]">[email protected]</a></p>
<p>Téléphone : <a href="tel:+3315152780">+36 30 36 30 36 30</a></p>
</div>
</footer>
<script src="../JS/index.js"></script>
</body>
</html>
1 change: 1 addition & 0 deletions Images/tempLogo.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit a2ed071

Please sign in to comment.