From 67dd63d1a25e19a1623f0303ca77f6078da95265 Mon Sep 17 00:00:00 2001
From: Kévin Le Gouguec <kevin.legouguec@gmail.com>
Date: Sat, 13 Mar 2021 23:19:59 +0100
Subject: Move credits closer to photos in concerts page

---
 concerts.html | 98 ++++++++++++++++++-----------------------------------------
 1 file changed, 30 insertions(+), 68 deletions(-)

(limited to 'concerts.html')

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>
-- 
cgit v1.2.3