detail home

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

@@ -1,30 +1,28 @@
 header{
-  padding: 0 1rem;
+  padding: 0 3rem;
   height: 130px;
   div {
     height: inherit;
   }
 }
+
 #block-popsu-colloque-branding{
   width: 100%;
   position: relative;
   z-index: 999;
-  padding: 1rem 0 0 0;
+  padding:0;
   & > div {
     & > a{
       display: inline-block;
-      height: 8rem;
-      max-height: 150px;
       position: relative;
       img{
-        width: auto;
+        width: 100%;
         height: 100%;
         object-fit: contain;
       }
     }
   }
 }
-
 #block-mainnavigation{
   width: auto;
   border-left: 1px solid $color1;
@@ -35,7 +33,9 @@ header{
     flex-wrap: nowrap;
     li{
       padding: 0 1rem;
-      border-right: 1px solid $col_black;
+      &:not(:last-child){
+        border-right: 1px solid $col_black;
+      }
       a{
         white-space: nowrap;
       }
@@ -50,3 +50,25 @@ header{
     height: auto;
   }
 }
+
+header.front{
+  #block-popsu-colloque-branding{
+    width: 100%;
+    position: relative;
+    z-index: 999;
+    padding: 1rem 0 0 0;
+    & > div {
+      & > a{
+        display: inline-block;
+        height: 8rem;
+        max-height: 150px;
+        position: relative;
+        img{
+          width: auto;
+          height: 100%;
+          object-fit: contain;
+        }
+      }
+    }
+  }
+}

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

@@ -1,11 +1,18 @@
+body{
+  overflow-x: hidden;
+}
+.home{
+  .__img-hero{
+    width: 100vw;
+    position: relative;
+    left: 50%;
+    right: 50%;
+    margin-left: -50vw;
+    margin-right: -50vw;
+  }
+}
 .__img-hero{
-  height: 400px;
-  // width: 100vw;
-  // position: relative;
-  // left: 50%;
-  // right: 50%;
-  // margin-left: -50vw;
-  // margin-right: -50vw;
+  height: 500px;
     img{
       width:100%;
       height: 100%;

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

@@ -13,13 +13,31 @@ img{
 }
 
  #txt_present{
+   margin: 5rem 0;
+   & * {
+     color: $color2;
+   }
    & > div{
      margin: 2rem auto;
    }
+   .more_link{
+     padding: 0rem 1rem 0.2rem 1rem;
+     background: white;
+   }
+ }
+
+ .more_link{
+   padding: 0rem 1rem 0.2rem 1rem;
+   background: white;
+   border-radius: 0;
+   a{
+     color: $color2;
+   }
  }
 
 #block-views-block-slide-programme-block-1,
 #block-views-block-dernieres-publications-block-1{
+  margin: 5rem 0;
   .views{
     section.wrap_head{
       @include croix_or;

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

@@ -1,22 +1,30 @@
+#block-views-block-slide-programme-block-1{
+  .__slide{
+    article{
+      min-height: calc(100% - 30px );
+    }
+  }
+}
+
+#block-views-block-dernieres-publications-block-1{
+  .__media{
+    padding: 1rem 0;
+  }
+}
 #block-views-block-slide-programme-block-1,
 #block-views-block-dernieres-publications-block-1{
+  section:not(.wrap_head){
+    margin: 1rem 0;
+  }
   .views{
     section{
       .head{
         display: flex;
         width: 100%;
         justify-content: space-between;
-        align-items: baseline;
+        align-items: center;
       }
-      // .__day{
-      //   border-right: 1px solid $color1;
-      //   margin-right: 1rem;
-      //   padding-right: 1rem;
-      // }
       .thumbnails{
-        &:first-child{
-          // margin-left: 2rem;
-        }
         margin: 1rem;
       }
       .flickity-slider{
@@ -33,11 +41,10 @@
   }
 }
 
-/* icon color */
 .flickity-button-icon {
   fill: $col_black;
 }
-/* hide disabled button */
+
 .flickity-button:disabled {
   display: none;
 }

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

@@ -10,9 +10,9 @@
    a{
      display: block;
      height: 100%;
-   }
-    & > .__wrap{
+     & > .__wrap{
        padding: 1rem;
+     }
    }
    .__media{
      margin-right: 1rem;
@@ -25,14 +25,18 @@
        }
      }
    }
+   .__content{
+     margin-top: 1rem;
+   }
   .d-flex{
-     padding: 1rem;
+     // padding: 1rem;
    }
  }
 
  .thumbnails{
    figure{
-     height: 100px;
+     height: 120px;
+     margin: 0;
      img{
        width: 100%;
        height: 100%;

web/themes/custom/popsu_colloque/css/mixins/mixin.scss

@@ -1,6 +1,6 @@
 @mixin croix_or {
   &:after{
-    height: 2rem;
+    height: 10px;
     margin-top: 0.5rem;
     content: " ";
     display: block;
@@ -13,7 +13,7 @@
 @mixin croix_or_B {
   &:before{
     width: 100px;
-    height: 1rem;
+    height: 10px;
     margin-top: 0.5rem;
     content: " ";
     display: block;

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

@@ -31,7 +31,29 @@
 
 }
 
+#block-mainnavigation{
+  ul{
+    li{
+      font-size: 0.9rem;
+      a{
+        color: black;
+        font-family: 'truenoregular';
+        &:hover{
+          color: black;
+          text-decoration: none;
+          font-weight: bold;
+        }
+      }
+    }
+  }
+}
+a{
+  &:hover{
+    text-decoration: none;
+  }
+}
 main{
+
   h2{
     font-family: 'dukefill';
     font-size: 3.5rem;
@@ -44,9 +66,42 @@ main{
   &.home{
     h2{
       font-size: 2rem;
+      font-family: 'truenoregular';
+      line-height: normal;
     }
   }
 
+ #txt_present{
+   .__sub-title-present{
+     p{
+       font-family: 'truenoregular';
+       font-style: italic;
+       font-size: 0.9rem;
+       line-height: 1.2rem;
+     }
+   }
+   .__body-present{
+     p{
+       font-family: 'truenoregular';
+       font-weight: lighter;
+       font-size: 1.2rem;
+       line-height: 1.8rem;
+     }
+   }
+   .more_link{
+     a{
+       font-size: 0.7rem
+     }
+   }
+ }
+
+.more_link{
+  a{
+    font-family: 'truenoregular';
+    font-size: 0.6rem;
+  }
+}
+
   h3{
     text-transform: uppercase;
     margin: 2rem 0;
@@ -148,24 +203,28 @@ a{
   }
 }
 
-article{
-  .__head{
-   div{
-     font-family: 'truenoregular';
-     font-size: 1rem;
-     text-transform: uppercase;
-   }
-  }
-}
-  .blue, #txt_present{
-    // color: $color2;
+  article{
+    .__head{
+     div{
+       font-family: 'truenoregular';
+       font-size: 1rem;
+       text-transform: uppercase;
+     }
+    }
   }
 
-  #block-views-block-slide-programme-block-1{
-    .thumbnails a{
-      // color: $col_black;
+  #block-views-block-slide-programme-block-1,
+  #block-views-block-dernieres-publications-block-1{
+    h3{
+      text-transform: uppercase;
+      margin: 0;
+      font-family: 'dukefill';
+      font-size: 2rem;
+      letter-spacing: $letter_spacingH;
+      color: $color2
     }
   }
+
 }
 
 #block-popsu-colloque-submenu{

web/themes/custom/popsu_colloque/css/variables/var.scss

@@ -1,4 +1,4 @@
-$color1: red;
+$color1: #b9a47eff;
 $color2: #1d378eff;
 $col_black: black;
 $lightgrey: #6f6d7dff;

web/themes/custom/popsu_colloque/template/block/block--mainpagecontent.html.twig

@@ -29,11 +29,14 @@
 #}
 
 {% set id = [elements][0].content['#view_id'] %}
+
 <div class="container {{id}}">
+{% if id == 'programme' %}
   {{ title_prefix }}
   {% if label %}
     <h2{{ title_attributes }}>{{ label }}</h2>
   {% endif %}
+{% endif %}
   {{ title_suffix }}
   {% block content %}
     {{ content }}

web/themes/custom/popsu_colloque/template/components/header_slide.html.twig

@@ -1,5 +1,5 @@
 <div class="head">
-  <h2>{{ header }}</h2>
+  <h3>{{ header }}</h3>
   <div class="more_link">
     <a class="blue" href="{{more['#url']}}">{{ more['#title'] }}<span>+</span></a>
   </div>

web/themes/custom/popsu_colloque/template/node/node--page-d-accueil.html.twig

@@ -79,7 +79,7 @@
 
 
 <article{{ attributes }} id="txt_present">
-  <div class="col-12 px-0 col-sm-10 col-md-8">
+  <div class="col-12 px-0 col-md-12 col-lg-8">
 
     <div class="__title-present">
       {{ content.field_titre_txt_present }}

web/themes/custom/popsu_colloque/template/page--front.html.twig

@@ -46,7 +46,7 @@
  */
 #}
 <div class="layout-container">
-  <header role="banner">
+  <header role="banner" class="front">
     {{ page.header }}
   </header>
 

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

@@ -31,5 +31,6 @@
  * @ingroup themeable
  */
 #}
-
-{% include 'themes/custom/popsu_colloque/template/components/thumbnails.html.twig' %}
+<a href="{{fields.view_node.content}}">
+  {% include 'themes/custom/popsu_colloque/template/components/thumbnails.html.twig' %}
+</a>

web/themes/custom/popsu_colloque/template/views/lists/views-view-unformatted--dernieres_publications.html.twig

@@ -27,7 +27,7 @@
         default_row_class ? 'views-row',
       ]
     %}
-    <article class="thumbnails col-lg-3 col-sm-6 col-12 m-2">
+    <article class="thumbnails col-lg-3 col-sm-6 col-12">
       {{- row.content -}}
     </article>
   {% endfor %}

web/themes/custom/popsu_colloque/template/views/lists/views-view-unformatted--slide_programme.html.twig

@@ -17,21 +17,14 @@
  * @ingroup themeable
  */
 #}
-{# <div class="__day"> #}
-{% if title %}
-  {# <h3>{{ title }}</h3> #}
-{% endif %}
-{# <div class="d-flex"> #}
 
-  {% for row in rows %}
-    {%
-      set row_classes = [
-        default_row_class ? 'views-row',
-      ]
-    %}
-    <article class="thumbnails">
-      {{- row.content -}}
-    </article>
-  {% endfor %}
-{# </div> #}
-{# </div> #}
+{% for row in rows %}
+  {%
+    set row_classes = [
+      default_row_class ? 'views-row',
+    ]
+  %}
+  <article class="thumbnails">
+    {{- row.content -}}
+  </article>
+{% endfor %}