Skip to content

Commit

Permalink
feat: liste animations
Browse files Browse the repository at this point in the history
  • Loading branch information
@SidonieBouthors
SidonieBouthors committed Dec 4, 2023
1 parent ed6367f commit ddc8a83
Show file tree
Hide file tree
Showing 2 changed files with 120 additions and 91 deletions.
16 changes: 15 additions & 1 deletion assets/css/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -724,7 +724,7 @@ main{
********************************************/

.planning {
margin: 3em;
margin: 1em 3em;
display: flex;
flex-direction: column;
align-items: center;
Expand Down Expand Up @@ -868,6 +868,20 @@ main{
.tl-altar { grid-area: altar; }
}

.anim{
text-align: left;

}

.anim li {
margin: .4em;
font-size: large;
}
.anim li::before {
content: "▶ ";
color: var(--blue);
}


/* Règlement
********************************************/
Expand Down
195 changes: 105 additions & 90 deletions infos.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,111 @@
</header>

<main>
<section class="planning planning-tournois">
<h2>Tournois</h2>
<p class="description">
Affrontez-vous sur nos nombreux tournois ! Des grands classiques
comme League of Legends, Minecraft ou Smash, aux jeux que
vous nous avez suggérés, choisissez vos compétitions peu
importe votre niveau.
<br> <br>
Les <span class="highlight-blue">plannings des tournois provisoires</span> sont disponibles ci-dessous! Ceux-ci sont encore susceptibles de changer dans les jours qui viennent...
</p>
<div class="timeline">
<div class="timeline-day">
<div class="tl-day tl-day-sat">Samedi</div>
<div class="tl-day tl-day-sun">Dimanche</div>
</div>
<div class="timeline-hours">
<div class="tl-hour tl-saturday">17h</div>
<div class="tl-hour tl-saturday">18h</div>
<div class="tl-hour tl-saturday">19h</div>
<div class="tl-hour tl-saturday">20h</div>
<div class="tl-hour tl-saturday">21h</div>
<div class="tl-hour tl-saturday">22h</div>
<div class="tl-hour tl-saturday">23h</div>
<div class="tl-hour tl-sunday">00h</div>
<div class="tl-hour tl-sunday">01h</div>
<div class="tl-hour tl-sunday">02h</div>
<div class="tl-hour tl-sunday">03h</div>
<div class="tl-hour tl-sunday">04h</div>
<div class="tl-hour tl-sunday">05h</div>
<div class="tl-hour tl-sunday">06h</div>
<div class="tl-hour tl-sunday">07h</div>
<div class="tl-hour tl-sunday">08h</div>
<div class="tl-hour tl-sunday">09h</div>
<div class="tl-hour tl-sunday">10h</div>
<div class="tl-hour tl-sunday">11h</div>
<div class="tl-hour tl-sunday">12h</div>
<div class="tl-hour tl-sunday">13h</div>
<div class="tl-hour tl-sunday">14h</div>
<div class="tl-hour tl-sunday">15h</div>
<div class="tl-hour tl-sunday">16h</div>
<div class="tl-hour tl-sunday">17h</div>
<div class="tl-hour tl-sunday">18h</div>
</div>
<div class="timeline-games">
<div class="tl-game tl-game-pink tl-accueil">Accueil</div>
<div class="tl-game tl-game-blue tl-mariokart">Mario Kart 8DX</div>
<div class="tl-game tl-game-pink tl-lol">League of Legends</div>
<div class="tl-game tl-game-blue tl-hearthstone">Hearthstone</div>
<div class="tl-game tl-game-green tl-valorant">Valorant</div>
<div class="tl-game tl-game-blue tl-overcooked">Overcooked 2</div>
<div class="tl-game tl-game-green tl-smashbros">Super Smash Bros Ultimate 1v1</div>
<div class="tl-game tl-game-pink tl-smashbros2">Super Smash Bros Ultimate 2v2</div>
<div class="tl-game tl-game-blue tl-echecs">Echecs</div>
<div class="tl-game tl-game-pink tl-babyfoot">Babyfoot</div>
<div class="tl-game tl-game-blue tl-jass">Jass</div>
<div class="tl-game tl-game-pink tl-triviapoly">TriviaPoly</div>
<div class="tl-game tl-game-blue tl-hades">Hades (Speedrun)</div>
<div class="tl-game tl-game-green tl-celeste">Celeste (Speedrun)</div>
<div class="tl-game tl-game-blue tl-slapshot">Slapshot</div>
<div class="tl-game tl-game-green tl-pokemonshowdown">Pokémon Showdown</div>
<div class="tl-game tl-game-blue tl-geoguessr">Geoguessr</div>
<div class="tl-game tl-game-green tl-minecraft">Minecraft</div>
<div class="tl-game tl-game-pink tl-overwatch">Overwatch 2</div>
<div class="tl-game tl-game-pink tl-starcraft">Starcraft 2</div>
<div class="tl-game tl-game-blue tl-osu">OSU</div>
<div class="tl-game tl-game-green tl-minimetro">Mini Metro</div>
<div class="tl-game tl-game-blue tl-streetfighter">Street<br> Fighter 6</div>
<div class="tl-game tl-game-green tl-altar">Altar</div>
<div class="tl-game tl-game-blue tl-jeumystere">Jeu Mystère</div>
<div class="tl-game tl-game-green tl-remiseprix">Remise des prix</div>
<div class="tl-game tl-game-pink tl-fin">Fin de la LAN</div>
</div>
</div>

<img class="timeline2" src="assets/img/timeline-mobile.svg">
</section>

<section class="planning planning-anim">
<h2>Animations</h2>
<p class="description">
Vous attendez votre tournoi? Venez prendre une pause
en profitant de nos diverses animations!
Il y en a pour tous les goûts!
<br> <br>
La <span class="highlight-blue">liste des animations</span> est disponible ci-dessous!
</p>
<ul class="anim">
<li>Just Dance</li>
<li>Karaoke</li>
<li>Bornes d'Arcade</li>
<li>Manettes Géantes (Nidhogg)</li>
<li>Tapis de Danse (Sayonara Wildhearts)</li>
<li>Casques VR (Beat Saber & SuperHot)</li>
<li>Survie Minecraft</li>
<li>Loup-Garou (Edition pour une Nuit)</li>
<li >Jeux de Société par Ludopoly</li>
<li >Lego</li>
<li >Jenga Géant</li>
<li >Mikado Géant</li>
<li >Babyfoot</li>
<li >Bingo</li>
<li >Escape Game !</li>
</ul>
</section>

<section class="container infos">
<h2>Informations Importantes</h2>
<div class="info-list">
Expand Down Expand Up @@ -202,96 +307,6 @@ <h2>Foire Aux Questions</h2>
</div>
</div>
</section>

<section class="planning planning-tournois">
<h2>Tournois</h2>
<p class="description">
Affrontez-vous sur nos nombreux tournois ! Des grands classiques
comme League of Legends, Minecraft ou Smash, aux jeux que
vous nous avez suggérés, choisissez vos compétitions peu
importe votre niveau.
<br> <br>
Les <span class="highlight-blue">plannings des tournois provisoires</span> sont disponibles ci-dessous! Ceux-ci sont encore susceptibles de changer dans les jours qui viennent...
</p>
<div class="timeline">
<div class="timeline-day">
<div class="tl-day tl-day-sat">Samedi</div>
<div class="tl-day tl-day-sun">Dimanche</div>
</div>
<div class="timeline-hours">
<div class="tl-hour tl-saturday">17h</div>
<div class="tl-hour tl-saturday">18h</div>
<div class="tl-hour tl-saturday">19h</div>
<div class="tl-hour tl-saturday">20h</div>
<div class="tl-hour tl-saturday">21h</div>
<div class="tl-hour tl-saturday">22h</div>
<div class="tl-hour tl-saturday">23h</div>
<div class="tl-hour tl-sunday">00h</div>
<div class="tl-hour tl-sunday">01h</div>
<div class="tl-hour tl-sunday">02h</div>
<div class="tl-hour tl-sunday">03h</div>
<div class="tl-hour tl-sunday">04h</div>
<div class="tl-hour tl-sunday">05h</div>
<div class="tl-hour tl-sunday">06h</div>
<div class="tl-hour tl-sunday">07h</div>
<div class="tl-hour tl-sunday">08h</div>
<div class="tl-hour tl-sunday">09h</div>
<div class="tl-hour tl-sunday">10h</div>
<div class="tl-hour tl-sunday">11h</div>
<div class="tl-hour tl-sunday">12h</div>
<div class="tl-hour tl-sunday">13h</div>
<div class="tl-hour tl-sunday">14h</div>
<div class="tl-hour tl-sunday">15h</div>
<div class="tl-hour tl-sunday">16h</div>
<div class="tl-hour tl-sunday">17h</div>
<div class="tl-hour tl-sunday">18h</div>
</div>
<div class="timeline-games">
<div class="tl-game tl-game-pink tl-accueil">Accueil</div>
<div class="tl-game tl-game-blue tl-mariokart">Mario Kart 8DX</div>
<div class="tl-game tl-game-pink tl-lol">League of Legends</div>
<div class="tl-game tl-game-blue tl-hearthstone">Hearthstone</div>
<div class="tl-game tl-game-green tl-valorant">Valorant</div>
<div class="tl-game tl-game-blue tl-overcooked">Overcooked 2</div>
<div class="tl-game tl-game-green tl-smashbros">Super Smash Bros Ultimate 1v1</div>
<div class="tl-game tl-game-pink tl-smashbros2">Super Smash Bros Ultimate 2v2</div>
<div class="tl-game tl-game-blue tl-echecs">Echecs</div>
<div class="tl-game tl-game-pink tl-babyfoot">Babyfoot</div>
<div class="tl-game tl-game-blue tl-jass">Jass</div>
<div class="tl-game tl-game-pink tl-triviapoly">TriviaPoly</div>
<div class="tl-game tl-game-blue tl-hades">Hades (Speedrun)</div>
<div class="tl-game tl-game-green tl-celeste">Celeste (Speedrun)</div>
<div class="tl-game tl-game-blue tl-slapshot">Slapshot</div>
<div class="tl-game tl-game-green tl-pokemonshowdown">Pokémon Showdown</div>
<div class="tl-game tl-game-blue tl-geoguessr">Geoguessr</div>
<div class="tl-game tl-game-green tl-minecraft">Minecraft</div>
<div class="tl-game tl-game-pink tl-overwatch">Overwatch 2</div>
<div class="tl-game tl-game-pink tl-starcraft">Starcraft 2</div>
<div class="tl-game tl-game-blue tl-osu">OSU</div>
<div class="tl-game tl-game-green tl-minimetro">Mini Metro</div>
<div class="tl-game tl-game-blue tl-streetfighter">Street<br> Fighter 6</div>
<div class="tl-game tl-game-green tl-altar">Altar</div>
<div class="tl-game tl-game-blue tl-jeumystere">Jeu Mystère</div>
<div class="tl-game tl-game-green tl-remiseprix">Remise des prix</div>
<div class="tl-game tl-game-pink tl-fin">Fin de la LAN</div>
</div>
</div>

<img class="timeline2" src="assets/img/timeline-mobile.svg">
</section>

<section class="planning planning-anim">
<h2>Animations</h2>
<p class="description">
Vous attendez votre tournoi? Venez prendre une pause
en profitant de nos diverses animations!
Just Dance, Beat Saber, Escape Game, Bornes d'Arcade et plein d'autres!
<br> <br>
La <span class="highlight-blue">liste des animations</span> sera disponible ici bientôt!
</p>
<!--<iframe class="timeline" src="https://docs.google.com/spreadsheets/d/e/2PACX-1vQrEBO1EtGne7xjH2exQuuKVR3XQh2Vw4F7L3wuLuczTvm7lq83CzngFqN74olftvx7Ht0_77-HFUWZ/pubhtml?gid=259007914&amp;single=true&amp;widget=true&amp;headers=false"></iframe>
<iframe class="timeline" src="https://docs.google.com/spreadsheets/d/e/2PACX-1vQrEBO1EtGne7xjH2exQuuKVR3XQh2Vw4F7L3wuLuczTvm7lq83CzngFqN74olftvx7Ht0_77-HFUWZ/pubhtml?gid=1066355641&amp;single=true&amp;widget=true&amp;headers=false"></iframe>-->
</section>
</main>

<footer>
Expand Down

0 comments on commit ddc8a83

Please sign in to comment.