[fix] tweak the ux

assets/programme.css

@@ -1,18 +1,18 @@
 *{
-    font-family:"Museo W01 500",Arial,Helvetica Neue,Helvetica,sans-serif;
+  font-family:"Museo W01 500",Arial,Helvetica Neue,Helvetica,sans-serif;
 
-    -webkit-font-smoothing: antialiased;
+  -webkit-font-smoothing: antialiased;
-    -webkit-text-stroke-width: 0.2px;
+  -webkit-text-stroke-width: 0.2px;
-    -moz-osx-font-smoothing: grayscale;
+  -moz-osx-font-smoothing: grayscale;
   font-size: 16pt;
   line-height: 1.46em;
 }
 h1{
-font-size:36pt;
+  font-size:36pt;
 }
 h2{
-font-size:24pt;
+  font-size:24pt;
-margin-top:36pt;
+  margin-top:36pt;
 }
 
 a:link {color:#ff5555;}
@@ -20,34 +20,42 @@ a:visited {color:#ff5555;}
 a:hover {color:#999999;}
 a:active {color:#ff5555;}
 
-ul li {
-}
 body {
-    font-family:sans-serif;
+  font-family:sans-serif;
-    background:#000;
+  background:#000;
-    color:#ff5555;
+  color:#ff5555;
-    width: auto;
+  width: auto;
-    padding: 2% 5%;
+  padding: 2% 5%;
 }
+
+table{
+  display:none;
+}
+
 table tr td {
-    color: #ccc;
+  color: #ccc;
-    padding: 10px;
+  padding: 10px;
-    text-align: center;
+  text-align: center;
 }
+
 td.links a {
-    display: block;
+  display: block;
-    border-radius: 10px;
+  border-radius: 10px;
-    background: #333;
+  background: #333;
-    padding: 3% 6%;
+  padding: 3% 6%;
-    margin: 10%;
+  margin: 10%;
-    text-align: center;
+  text-align: center;
-    text-overflow: ellipsis;
+  text-overflow: ellipsis;
-    overflow: hidden;
+  overflow: hidden;
 }
 tr:nth-child(even) {background: #181818}
 th {
-    font-size: 12pt;
+  font-size: 12pt;
 }
 td.name {
-    min-width: 250px;
+  min-width: 250px;
+}
+span.info {
+  float: right;
+  color: #655;
 }

programme.html

@@ -25,6 +25,7 @@
   <h1>Festival HSF 2020 : Programme</h1>
 <h2>
 Stands permanents
+<span class="info">Cliquer pour afficher / masquer </span>
 </h2>
 
 <table>
@@ -180,6 +181,8 @@ Stands permanents
 
 <h2>
 Vendredi 7 février 2019
+<span class="info">Cliquer pour afficher / masquer </span>
+
 </h2>
 <table>
   <thead>
@@ -257,6 +260,8 @@ Vendredi 7 février 2019
 
 <h2>
 Samedi 8 février 2019
+<span class="info">Cliquer pour afficher / masquer </span>
+
 </h2>
 <table>
   <thead>
@@ -358,5 +363,15 @@ Samedi 8 février 2019
 
 </tbody>
 </table>
+<script>
+jQuery(function(){
+  jQuery("h2").live("click",function(e){
+    var el = jQuery(this);
+    el.next().toggle();
+    })
+
+
+  })
+</script>
 </body>
 </html>