ajax_notes

web/themes/custom/popsu_colloque/css/index.scss

@@ -50,11 +50,71 @@ article img,
   object-fit: cover;
 }
 
+#presentation{
+  .__wrapper{
+    .__wrap_side{
+      position: inherit;
+      @media screen and (min-width: 768px){
+        position: relative;
+      }
+    }
+  }
+}
+
 .side_notes{
-  & > a{
+  position: absolute;
+  width: calc(100% - 30px);
+  left: 30px;
+  width: calc(100% - 45px);
+  @media screen and (min-width: 768px){
+    margin-top: -3rem;
+  }
+  .wrap{
+    position: relative;
+    width: max-content;
+    .__hero{
+      margin: 0!important;
+      height: 200px;
+      max-width: 300px;
+      .__img{
+        height: 200px;
+        img{
+          width: auto;
+          height: 100%;
+        }
+      }
+    }
+    .__head{
+      background: white;
+      padding: 0.5rem;
+      width: max-content;
+      min-width: 300px;
+      & > *{
+        font-family: 'cormorantBold';
+        color: $color2;
+        display:inline;
+      }
+    }
+    .thumbnails.bibliographie{
+      width: 100%;
+    }
+  }
+  .close{
+    cursor: pointer;
+    background: $color2;
     position: absolute;
-    // margin-top: -5.5rem;
-    transform: translateY(-50%);
+    top: -12px;
+    left: -15px;
+    width: 30px;
+    height: 27px;
+    &::after{
+      content: "+";
+      color: white;
+      display: block;
+      margin: auto;
+      text-align: center;
+      transform: rotate(45deg);
+    }
   }
 }
 
@@ -64,7 +124,3 @@ article img,
   flex: 100%;
   max-width: 100%;
 }
-
-.side_notes .d-flex {
-  // flex-direction: column;
-}