banda.ens.fr/www/index.html
2024-06-05 12:39:36 +02:00

199 lines
6.4 KiB
HTML

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0," />
<meta name="description" content="Site de la bandarretdurgence &mdash; Le club de la banda de l'ENS" />
<meta name="keywords" content="ENS Banda" />
<title>La Bandarretdurgence</title>
<link rel="stylesheet" href="css/normalize.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/tipso.css" />
<link rel="stylesheet" href="css/calendar.css" />
</head>
<body>
<header>
<style>
header {
width: 100%;
text-align: center; /* Pour centrer l'image horizontalement */
}
header img {
width: 100%; /* Pour que l'image occupe toute la largeur de son conteneur */
max-width: 100%; /* Pour s'assurer que l'image ne dépasse pas la largeur de la page */
height: auto; /* Pour que la hauteur de l'image soit ajustée proportionnellement à sa largeur */
}
</style>
<header>
<img src="img/header/banda_header.svg" alt="titre" />
</header>
</header>
<section>
<img src="img/content/presentation.svg" alt="Présentation" />
<div>
<p>
La <strong>Bandarrêtdurgence</strong> c'est un morceau du Sud-Ouest à Paris !
Jeunes musicien⸱nes dynamiques et chahuteurs⸱ses, on anime les soirées
des bars à tapas comme les matchs du <strong>sport roi</strong>. 🏉
</p>
<p>
Tu nous trouveras le plus souvent
sagement en répétition dans le 5ème arrondissement comme depuis le début de l'aventure en 2018 !
Mais nous préférons par dessus tout réjouir petits et grands en jouant en manche dans le quartier
(et le plus souvent, accoudé⸱es au comptoir le plus proche une fois la soirée arrivée). 🍺
</p>
<p>
Finalement, le but ultime et avoué est de rejoindre nos compatriotes du Sud-Ouest pour les
férias et fêtes de villages de l'été : de Toulouse à Gourdon, on s'y donne à coeur joie !
</p>
<p>
Qu'est-ce qu'on y joue, à la Bandarrêtdurgence, me direz-vous ? Et bien on y retrouve tout ce qu'on aime pardi !
De la bonne <strong>chanson française</strong> avec Joe Dassin et Claude François, les incontournables traditionnels <strong>pasodobles espagnols</strong>,
les meilleurs tubes qui vous feront chanter à pleins poumons jusqu'au bout des <strong>démons de minuit</strong>.
</p>
<p>
Tu es musicien⸱ne et cherches une banda conviviale pour venir jouer ? 🎷 <strong>Nous recrutons à tous les pupitres !</strong>
Nous répétons les mercredis soirs au 45 rue d'Ulm dans le 5ème arrondissement. Contacte-nous par mail ou sur un réseau social et nous t'accueillerons avec plaisir.
Il n'y a pas de niveau musical requis mais la bonne humeur et l'enthousiasme sont de mise.
</p>
</div>
<div class="logo">
<p align="center">
<img src="img/logo/logo_sombre_bin.png" />
</p>
</div>
</section>
<section id="Contrats">
<img src="img/content/contrats.svg" alt="Contrats" />
<div>
<p>
Nous jouons régulièrement, dans les <strong>rues de Paris</strong>, pour animer des matchs de rugby,
mais également en vacances, dans les <strong>fêtes de village</strong> aux alentours du Pays Basque!
Tu nous as peut-être vu⸱es ou entendu⸱es : 🎺
</p>
<ul id = list_contrats>
<li>- Au rugby club de Suresnes</li>
<li>- Au rugby club du XVe arrondissement de Paris</li>
<li>- A la maison basque de Saint-Ouen</li>
<li>- Aux aubades de Montastruc</li>
<li>- A la Saint Jean et à la fête du pain de Gourdon avec la Dede's banda</li>
</ul>
</div>
</section>
<section id="photos">
<img src="img/content/photos.svg" alt="Photos" />
<div>
<p>
On est beaux et belles, on joue bien, on s'amuse et on vous divertit ; en voici quelques exemples :
</p>
</div>
<br>
<div class="banda_photos">
<p align="center">
<img src="img/photos/banda/sax.JPG" />
</p>
<p align="center">
<img src="img/photos/banda/trombone.JPG" />
</p>
<p align="center">
<img src="img/photos/banda/charette.JPG" />
</p>
<p align="center">
<img src="img/photos/banda/photobanda3.jpg" />
</p>
<p align="center">
<img src="img/photos/banda/photobanda4.jpg" />
</p>
<p align="center">
<img src="img/photos/banda/encantada.JPG" />
</p>
</div>
</section>
<section>
<img src="img/content/nouscontacter.svg" alt="Nous contacter" />
<div>
<p id="contact-email">
<span><a href="mailto:bandarretdurgence@gmail.com">bandarretdurgence@gmail.com</a></span>
</p>
<br>
<a href="https://www.instagram.com/bandarretdurgence/" target="_blank">
<div id="instagram-button" class="button">
<span>Page Instagram</span>
</div>
</a>
<a href="https://www.facebook.com/Bandarretdurgence.Paris" target="_blank">
<div id="facebook-button" class="button">
<span>Page Facebook</span>
</div>
</a>
</div>
<br>
<div id="sponsors">
<a href="https://www.ens.fr/">
<img class="sponsor-disc" src="img/sponsors/ens.png" alt="ENS" />
</a>
<a href="https://www.cof.ens.fr">
<img class="sponsor-disc" src="img/sponsors/cof.png" alt="COF" />
</a>
</div>
</section>
<p id="signature">© Louise Harari, Louise Nassor, Camille Gobert</p>
</body>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="js/tipso.min.js"></script>
<script type="text/javascript" src="js/calendar.js"></script>
<script type="text/javascript">
$(window).ready(() => {
// Starry background init (used in 2019 but not in 2021 because there was no starry background behind the header)
// const canvas = document.getElementById("main-header-stars");
// const sky = new StarrySky(canvas);
// Calendar init
let calendar1 = new Calendar({
containerNode: $("#cal-container-1"),
startDate: new Date(2024, 3, 12, 18),
endDate: new Date(2024, 3, 13, 3),
groupEventsByLocation: true,
});
let calendar2 = new Calendar({
containerNode: $("#cal-container-2"),
startDate: new Date(2024, 3, 13, 11),
endDate: new Date(2024, 3, 14, 4),
groupEventsByLocation: true,
});
let calendar3 = new Calendar({
containerNode: $("#cal-container-3"),
startDate: new Date(2024, 3, 14, 10),
endDate: new Date(2024, 3, 14, 14),
groupEventsByLocation: true,
});
});
</script>
</html>