diff options
Diffstat (limited to 'concerts.html')
| -rw-r--r-- | concerts.html | 98 |
1 files changed, 30 insertions, 68 deletions
diff --git a/concerts.html b/concerts.html index c219825..2982ff0 100644 --- a/concerts.html +++ b/concerts.html @@ -2,17 +2,31 @@ <div id="event-list"> <h1>Prochains concerts</h1> <div class="events"> - <a class="event canceled" href="#concert-2021-04-03"> - <img src="images/concerts/dinard.jpg"> - <p class="summary"> - <span class="canceled">ANNULÉ</span> - Dinard<br>3 avril 2021 - </p> - </a> - <a class="event" href="#concert-2021-06-21"> - <img src="images/concerts/pantin.jpg"> - <p class="summary">Paris<br>13 juin 2021</p> - </a> + <div class="eventcontainer"> + <a class="event canceled" href="#concert-2021-04-03"> + <img src="images/concerts/dinard.jpg"> + <p class="summary"> + <span class="canceled">ANNULÉ</span> + Dinard<br>3 avril 2021 + </p> + </a> + <div class="credits"> + <span> + <a href="https://www.piqsels.com/fr/public-domain-photo-zxmbk" target="_blank">Piqsels</a> / <a href="https://creativecommons.org/publicdomain/zero/1.0/" target="_blank">CC0</a> + </span> + </div> + </div> + <div class="eventcontainer"> + <a class="event" href="#concert-2021-06-21"> + <img src="images/concerts/pantin.jpg"> + <p class="summary">Paris<br>13 juin 2021</p> + </a> + <div class="credits"> + <span> + <a href="https://www.flickr.com/photos/129231073@N06/23414771992/" target="_blank">Fred Romero</a> / <a href="https://creativecommons.org/licenses/by/2.0/" target="_blank">CC BY</a> + </span> + </div> + </div> </div> </div> @@ -31,17 +45,7 @@ </ol> <p class="more"> Informations et réservations : - <a href="https://weekenddemusiqueclassique.fr" - target="_blank"> - https://weekenddemusiqueclassique.fr - </a> - </p> - <p class="photo-credits"> - Photo fournie par - <a href="https://www.piqsels.com/fr/public-domain-photo-zxmbk"> - Piqsels - </a> - / <a href="https://creativecommons.org/publicdomain/zero/1.0/">CC0</a> + <a href="https://weekenddemusiqueclassique.fr" target="_blank">https://weekenddemusiqueclassique.fr</a> </p> </div> <div class="details" id="concert-2021-06-21"> @@ -58,56 +62,14 @@ </ol> <p class="more"> Entrée libre sans réservation, dans la limite des places - disponibles.<br> + disponibles. + </p> + <p> Pour plus d'informations, merci de contacter : <a href="mailto:quatuorbellefeuille@gmail.com">quatuorbellefeuille@gmail.com</a> </p> - <p class="photo-credits"> - Photo fournie par - <a href="https://www.flickr.com/photos/129231073@N06/23414771992/"> - Fred Romero - </a> - / <a href="https://creativecommons.org/licenses/by/2.0/">CC BY</a> - </p> </div> </div> - <script> - // When JS is enabled, hide concert details by default, and - // allow the user to display concerts selectively. - var detailsStyle = document.createElement('style'); - document.head.appendChild(detailsStyle); - detailsStyle.sheet.insertRule('.details:not(.active) {display:none}'); - - var pHint = document.querySelector('p.hint'); - - var anchor = document.location.hash; - if (anchor.match(/#concert-/)) { - document.querySelector(anchor).classList.add('active'); - document.querySelector(`a[href="${document.location.hash}"]`) - .classList.add('active'); - pHint.style.display = 'none'; - } - document.querySelectorAll('a.event').forEach((link) => { - link.addEventListener('click', function(click) { - if (click.ctrlKey || click.shiftKey) - return; - - var prev = document.querySelector('.details.active'); - if (prev) - prev.classList.remove('active'); - var id = link.attributes['href'].value; - document.querySelector(id).classList.add('active'); - - prev = document.querySelector('a.event.active'); - if (prev) { - prev.classList.remove('active'); - } - link.classList.add('active'); - - pHint.style.display = 'none'; - }); - }); - </script> - + <script src="scripts/concerts.js"></script> </main> |