ajout du dropdown dans la page collectif

user/themes/figureslibres-v2/css/theme.css

@@ -160,6 +160,63 @@ h1, h2 {
   line-height: 1.1em;
 }
 
+h4 {
+  display: block;
+  padding-top: 0.8rem;
+  width: 100%;
+  font-family: Syne, Sans-serif;
+  font-size: 1.25em;
+  cursor: pointer;
+}
+h4 a {
+  text-decoration: underline;
+  text-decoration-thickness: 1px;
+}
+
+h4:first-of-type {
+  padding-top: 0;
+}
+
+h4 + p {
+  margin-bottom: 0.5rem !important;
+}
+h4 + p em {
+  display: block;
+  font-size: 0.75em;
+  cursor: pointer;
+}
+h4 + p em > img {
+  display: inline-block;
+  height: 0.75em;
+  width: 0.75em !important;
+  margin-bottom: unset !important;
+  margin-left: 0.3rem;
+  transform: rotate(0deg);
+  transition: transform 0.4s ease-out;
+}
+h4 + p em > img.open {
+  transform: rotate(180deg);
+}
+
+h4 + p + p {
+  margin-bottom: 0 !important;
+  padding-bottom: 0rem;
+  font-size: 0.75em;
+  max-height: 0px;
+  height: auto;
+  overflow: hidden;
+  transition: max-height 0.4s ease-out, padding-bottom 0.4s ease-out;
+}
+
+h4 + p + p.open {
+  max-height: 50vh;
+  padding-bottom: 1rem;
+}
+
+h4 + p + p + h2 {
+  margin-top: 1.5rem;
+}
+
 p, ul, figcaption {
   font-family: Lato, Sans-serif;
   font-size: 1.2em;
@@ -1124,10 +1181,10 @@ body footer p a {
     width: 70%;
   }
   body main #text-content .text-item:first-of-type {
-    position: fixed;
-    top: calc(7vh + 2vh + 30px);
-    width: 20%;
-    left: 70%;
+    position: absolute;
+    top: 0;
+    width: 20vw;
+    left: 82%;
   }
   body main #text-content .text-item:first-of-type img {
     width: 70%;