page publication && biblio

web/themes/custom/popsu_colloque/css/components/thumbnails/thumbnails.scss

@@ -21,22 +21,27 @@ header{
       margin-bottom: 0.5rem;
     }
   }
+
   // thumbnails publications
   &.publications{
+    @media screen and (min-width: 768px) {
+      width: calc(100% / 2 - #{$gutter1} * 2);
+    }
+    @media screen and (min-width: 992px) {
+      width: calc(100% / 3 - #{$gutter1} * 2);
+    }
+    @media screen and (min-width: 1200px) {
+      width: calc(100% / 4 - #{$gutter1} * 2);
+    }
     .__media{
       padding: 0.5rem 0 0.5rem 0.5rem;
-      // .__img{
-      //   height: 150px;
-      //   width: 100%;
-      //   img{
-      //     width: auto;
-      //     height: 100%;
-      //   }
-      // }
     }
     .__wrap{
       padding: 0.5rem;
     }
+  }
+
+  &.bibliographie{
     @media screen and (min-width: 768px) {
       width: calc(100% / 2 - #{$gutter1} * 2);
     }
@@ -46,6 +51,13 @@ header{
     @media screen and (min-width: 1200px) {
       width: calc(100% / 4 - #{$gutter1} * 2);
     }
+    a{
+      & > div  * {
+        display: inline;
+        background: white;
+        color: $color2;
+      }
+    }
   }
 }
 
@@ -143,292 +155,3 @@ header{
     }
   }
 }
-
-
-// @media screen and (min-width: 992px) {
-//   .programme{
-//     .row{
-//       margin: $gutter1 calc(-#{$gutter1});
-//     }
-//     .thumbnails{
-//       width: calc( 50% - #{$gutter1} * 2);
-//       margin: 0 $gutter1;
-//     }
-//   }
-//   .thumbnails{
-//     &.publications{
-//       width: calc(100% / 4 - #{$gutter1} * 4);
-//     }
-//   }
-// }
-
-//  .thumbnails{
-//    margin: 1rem 0rem;
-//    // max-width: 300px;
-//    min-width: 250px;
-//    height: auto;
-//    width: calc(100% / 4 );
-//    background: white;
-//    transform: scale(1);
-//    @include shadow;
-//    a{
-//      display: block;
-//      height: 100%;
-//    }
-//    .__content{
-//      margin-top: 1rem;
-//    }
-//    &.programme{
-//      .__wrap{
-//        padding: 1rem;
-//      }
-//    }
-//    &.publications{
-//      width: 100%;
-//      .__media{
-//        padding: 1rem;
-//        figure{
-//          height: 100%;
-//          img{
-//            width: 100%;
-//            height: 100%;
-//            object-fit: cover;
-//          }
-//        }
-//      }
-//      .__content{
-//        margin: 1rem 1rem 1rem 0;
-//      }
-//    }
-//  }
-//
-//  .thumbnails{
-//    figure{
-//      height: 120px;
-//      margin: 0;
-//      img{
-//        width: 100%;
-//        height: 100%;
-//        object-fit: cover;
-//      }
-//    }
-//  }
-//
-// .programme{
-//   .row{
-//     margin: 0;
-//   }
-//   .thumbnails{
-//     width: 100%;
-//     margin: 0;
-//     figure{
-//       height: 150px;
-//     }
-//   }
-// }
-//
-//
-
-//
-//
-// .container {
-//   &.programme{
-//     .views{
-//       section{
-//         .row{
-//           margin: 1rem 0;
-//         }
-//       }
-//     }
-//     .thumbnails{
-//       width: 100%;
-//       margin: 1rem 0;
-//     }
-//   }
-//   @media screen and (min-width: 768px) {
-//     &.programme{
-//       .row{
-//         .thumbnails{
-//           width: calc( 50% - #{$gutter1} * 2);
-//           // min-width: calc( 50% - #{$gutter1} * 2);
-//           margin: 0 $gutter1;
-//         }
-//       }
-//     }
-//   }
-//   @media screen and (min-width: 992px) {
-//     &.programme{
-//       .row{
-//         .thumbnails{
-//           width: calc( (100% / 3) - #{$gutter1} * 3);
-//           // min-width: calc( 50% - #{$gutter1} * 2);
-//           margin: 0 $gutter1;
-//         }
-//       }
-//     }
-//   }
-//   @media screen and (min-width: 1200px) {
-//     &.programme{
-//       .row{
-//         .thumbnails{
-//           width: calc( (100% / 4) - #{$gutter1} * 4);
-//           // min-width: calc( 50% - #{$gutter1} * 2);
-//           margin: 0 $gutter1;
-//         }
-//       }
-//     }
-//   }
-//
-
-// article{
-//   .__publications{
-//     & > div{
-//       article{
-//         width: 100%;
-//         @include shadow;
-//         figure{
-//           padding: 1rem;
-//           .__media{
-//             margin-right: 1rem;
-//           }
-//           figcaption {
-//             width: 80%;
-//           }
-//         }
-//       }
-//     }
-//   }
-//   .__bibliographie{
-//     & > div{
-//       article{
-//         width: 100%;
-//         a{
-//           & > div {
-//             p, span, div{
-//               display: inline;
-//               background: white;
-//             }
-//           }
-//         }
-//       }
-//     }
-//   }
-// }
-//
-//
-//   &.publications{
-//     section{
-//       article{
-//         width: 100%;
-//         @include shadow;
-//         figure{
-//           padding: 1rem;
-//           .__media{
-//             margin-right: 1rem;
-//           }
-//           figcaption {
-//             width: 80%;
-//           }
-//         }
-//       }
-//     }
-//   }
-//   &.bilbiographie{
-//     article{
-//       width: 100%;
-//       a{
-//         & > div {
-//           p, span, div{
-//             display: inline;
-//             background: white;
-//           }
-//         }
-//       }
-//     }
-//   }
-// }
-//
-// @media screen and (min-width: 992px) {
-//   article{
-//     .__publications{
-//       & > div{
-//         margin: 0 calc(-#{$gutter1});
-//         article{
-//           width: calc( 50% - #{$gutter1} * 2);
-//           margin: 0 $gutter1;
-//           @include shadow;
-//           figure{
-//             padding: 1rem;
-//             .__media{
-//               margin-right: 1rem;
-//             }
-//             figcaption {
-//               width: 80%;
-//             }
-//           }
-//         }
-//       }
-//     }
-//     .__bibliographie{
-//       & > div{
-//         margin: 0 calc(-#{$gutter1});
-//         article{
-//           width: calc( 100% / 3 - #{$gutter1} * 3);
-//           margin: 0 $gutter1;
-//           figure{
-//             padding: 1rem;
-//             .__media{
-//               margin-right: 1rem;
-//             }
-//             figcaption {
-//               width: 80%;
-//             }
-//           }
-//         }
-//       }
-//     }
-//   }
-//
-//   .container {
-//     &.publications{
-//       section{
-//         article{
-//           width: calc( 50% - #{$gutter1} * 2);
-//           margin: 0 $gutter1;
-//           @include shadow;
-//           figure{
-//             padding: 1rem;
-//             .__media{
-//               margin-right: 1rem;
-//             }
-//             figcaption {
-//               width: 80%;
-//             }
-//           }
-//         }
-//       }
-//       .views{
-//         &.__publications{
-//           article{
-//             width: calc( 25% - #{$gutter1} * 4);
-//           }
-//         }
-//       }
-//     }
-//     &.bibliographie{
-//       article{
-//         width: calc( 100% / 3 - #{$gutter1} * 3);
-//         margin: 0 $gutter1;
-//         figure{
-//           padding: 1rem;
-//           .__media{
-//             margin-right: 1rem;
-//           }
-//           figcaption {
-//             width: 80%;
-//           }
-//         }
-//       }
-//     }
-//   }
-// }

web/themes/custom/popsu_colloque/template/views/views-view--bibliographie.html.twig

@@ -44,7 +44,7 @@
   {{ attachment_before }}
 
   {% if rows -%}
-    <section class="d-lg-flex flex-wrap d-block" >
+    <section class="d-flex flex-wrap " >
       {{ rows }}
     </section>
   {% elseif empty -%}

web/themes/custom/popsu_colloque/template/views/views-view--publications.html.twig

@@ -44,7 +44,7 @@
   {{ attachment_before }}
 
   {% if rows -%}
-    <section class="d-lg-flex flew-wrap d-block" >
+    <section class="d-flex flex-wrap" >
       {{ rows }}
     </section>
   {% elseif empty -%}