ressource video

web/themes/custom/eql/dist/assets/css/bundle.css

@@ -5757,6 +5757,71 @@ content .page-node-type-ressource .type-les-projets-en-images.layout__region--to
   margin-bottom: -46rem;
 }
 
+.carousel {
+  display: none;
+}
+
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top {
+  display: flex !important;
+  flex-direction: column;
+  margin-left: 11%;
+}
+@media screen and (min-width: 1100px) {
+  .page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top {
+    display: flex;
+  }
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block {
+  margin-left: 0;
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images {
+  margin-top: 5rem;
+  padding: 0;
+  order: 7;
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel {
+  display: block;
+  max-width: 80vw;
+  margin: auto;
+  text-align: center;
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel .main-image-container {
+  position: relative;
+  height: 500px;
+  max-height: 500px;
+  overflow: hidden;
+  width: 100%;
+  object-fit: contain;
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel .main-image-container img {
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  transition: transform 0.3s ease-in-out;
+  border: none;
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel .main-image-container img.animate {
+  transform: scale(1.02);
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel .main-image-container .arrow {
+  display: none !important;
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel .caption {
+  margin-top: 10px;
+  font-family: sans-serif;
+  display: none !important;
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel .thumbnails-wrapper {
+  display: none !important;
+}
+.page-node-type-ressource .type-media-vidéos.layout__region--top .block-region-top .block-entity-fieldnodefield-images .field__items {
+  display: none;
+}
+.page-node-type-ressource .block-region-third {
+  transform: translateY(-46rem);
+  margin-bottom: -46rem;
+}
+
 /*partials*/
 .layout-container {
   position: relative;

web/themes/custom/eql/scss/pages/_ressource-type-en-images copy.scss

@@ -1,157 +0,0 @@
-.carousel{display: none;}
-.page-node-type-ressource{
-
-        .type-les-projets-en-images.layout__region--top{
-            .block-region-top{
-            display: flex !important;
-            flex-direction: column;
-            margin-left: 11%;
-            @media screen and (min-width:1100px) {
-                display: flex;
-            }
-            .block {
-                margin-left: 0;
-            }
-            .block-entity-fieldnodefield-images{
-              margin-top: 5rem;
-                padding: 0;
-                order: 7;
-
-                .carousel {
-                    display: block;
-                    max-width: 60vw;
-                    margin: auto;
-                    text-align: center;
-                
-                    .main-image-container {
-                      position: relative;
-                    //   background: #e0f5ff;
-                      height: 500px;
-                      max-height: 500px;
-                      overflow: hidden;
-                      width: 100%;
-                      object-fit: contain;
-                
-                      img {
-                        width: 100%;
-                        height: 100%;
-                        object-fit: contain;
-                        transition: transform 0.3s ease-in-out;
-                        border: none ;
-                        // transition: opacity 0.4s ease-in-out; // à réactiver si fade souhaité
-                        &.animate {
-                          transform: scale(1.02); // léger effet smooth sur changement
-                        }
-                      }
-                
-                      .arrow {
-                        position: absolute;
-                        top: 50%;
-                        transform: translateY(-50%);
-                        background: #00aaff;
-                        border-radius: 50%;
-                        padding: 5px 10px;
-                        color: white;
-                        cursor: pointer;
-                        content
-                
-                        &.left {
-                          left: 10px;
-                        }
-                
-                        &.right {
-                          right: 10px;
-                        }
-                      }
-                        // #prevArrow{
-                        //     &::before{
-                        //     content:url("../images/pictos/fleche-droite-dans-rond.png");
-                        //     display: block;
-                        //     transform: scaleX(-1);
-                        //     width: 50px;
-                        // }
-                        // }
-                        // #nextArrow{
-                        //     &::before{
-                        //         content:url("../images/pictos/fleche-droite-dans-rond.png");
-                        //         display: block;
-                        //     }
-                        // }
-                    }
-                
-                    .caption {
-                      margin-top: 10px;
-                      font-family: sans-serif;
-                    }
-                
-                    .thumbnails-wrapper {
-                      position: relative;
-                      max-width: 100%;
-                      overflow: hidden;
-                      display: flex;
-                      align-items: center;
-                      justify-content: center;
-                
-                      .thumb-arrow {
-                        cursor: pointer;
-                        padding: 5px 10px;
-                        background: #00aaff;
-                        color: white;
-                        border-radius: 50%;
-                        user-select: none;
-                        z-index: 2;
-                        // font-weight: bold;
-                
-                        &.left {
-                          margin-right: 10px;
-                        }
-                
-                        &.right {
-                          margin-left: 10px;
-                        }
-                      }
-                
-                      .thumbnails {
-                        display: flex;
-                        gap: 10px;
-                        overflow-x: auto;
-                        scroll-behavior: smooth;
-                        max-width: 100%;
-                        padding: 10px 0;
-                        scrollbar-width: none; // Firefox
-                
-                        &::-webkit-scrollbar {
-                          display: none; // Chrome, Safari
-                        }
-                
-                        img {
-                          width: 60px;
-                          height: 60px;
-                          object-fit: cover;
-                          border: 2px solid transparent;
-                          cursor: pointer;
-                
-                          &.active {
-                            border-color: #00aaff;
-                          }
-                        }
-                      }
-                    }
-                  }
-                
-                  // Masquer les images Drupal originales (facultatif)
-                  .field__items {
-                    display: none;
-                  }
-            }
-            
-            }
-
-            
-        }
-
-        .block-region-third{
-          transform: translateY(-46rem);
-          margin-bottom: -46rem;
-        }
-}    

web/themes/custom/eql/scss/pages/_ressource-type-media-vidéos.scss

@@ -0,0 +1,82 @@
+.carousel{display: none;}
+.page-node-type-ressource{
+
+        .type-media-vidéos.layout__region--top{
+            .block-region-top{
+            display: flex !important;
+            flex-direction: column;
+            margin-left: 11%;
+            @media screen and (min-width:1100px) {
+                display: flex;
+            }
+            .block {
+                margin-left: 0;
+            }
+            .block-entity-fieldnodefield-images{
+              margin-top: 5rem;
+                padding: 0;
+                order: 7;
+
+                
+                .carousel {
+                  display: block;
+                  max-width: 80vw;
+                  margin: auto;
+                  text-align: center;
+              
+                  .main-image-container {
+                    position: relative;
+                  //   background: #e0f5ff;
+                    height: 500px;
+                    max-height: 500px;
+                    overflow: hidden;
+                    width: 100%;
+                    object-fit: contain;
+              
+                    img {
+                      width: 100%;
+                      height: 100%;
+                      object-fit: contain;
+                      transition: transform 0.3s ease-in-out;
+                      border: none ;
+                      // transition: opacity 0.4s ease-in-out; // à réactiver si fade souhaité
+                      &.animate {
+                        transform: scale(1.02); // léger effet smooth sur changement
+                      }
+                    }
+              
+                    .arrow {
+                      display: none !important;
+                    }
+                  
+                  }
+              
+                  .caption {
+                    margin-top: 10px;
+                    font-family: sans-serif;
+                    display: none !important;
+
+                  }
+              
+                  .thumbnails-wrapper {
+                    display: none !important;
+                    
+                    
+                  }
+                }
+                  // Masquer les images Drupal originales (facultatif)
+                  .field__items {
+                    display: none;
+                  }
+            }
+            
+            }
+
+            
+        }
+
+        .block-region-third{
+          transform: translateY(-46rem);
+          margin-bottom: -46rem;
+        }
+}    

web/themes/custom/eql/scss/styles.scss

@@ -54,7 +54,7 @@
 @import "pages/_lincubateur_newpage";
 @import "pages/ressources";
 @import "pages/ressource-type-en-images";
-
+@import "pages/_ressource-type-media-vidéos";
 
 
 /*partials*/