add font

web/themes/custom/popsu_colloque/css-compiled/typography.min.css

@@ -1 +1 @@
-main h2{text-transform:uppercase}main h3{margin:2rem 0;text-transform:uppercase}.more_link span{padding-left:.5rem}
+@font-face{font-family:dukefill;font-weight:400;font-style:normal;src:url(../fonts/duke_fill-webfont.woff2) format('woff2'),url(../fonts/duke_fill-webfont.woff) format('woff')}main h2{font-family:dukefill;font-family:1rem;text-transform:capitalize}main h3{margin:2rem 0;text-transform:uppercase}.more_link span{padding-left:.5rem}

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

@@ -1,6 +1,8 @@
 #block-popsu-colloque-submenu{
+  margin: 3rem auto;
   ul{
     display: flex;
+    padding: 0;
     li{
       margin-right: 1rem;
       a{
@@ -11,8 +13,9 @@
         background: white;
         transition: color 0.3s ease, background 0.3s ease;
         &:hover{
+          text-decoration: none;
           color: white;
-          background: blue;
+          background: $color2;
           transition: all 0.3s ease;
         }
       }

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

@@ -1,11 +1,11 @@
 .__img-hero{
   height: 400px;
-  width: 100vw;
-  position: relative;
-  left: 50%;
-  right: 50%;
-  margin-left: -50vw;
-  margin-right: -50vw;
+  // width: 100vw;
+  // position: relative;
+  // left: 50%;
+  // right: 50%;
+  // margin-left: -50vw;
+  // margin-right: -50vw;
     img{
       width:100%;
       height: 100%;

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

@@ -1,7 +1,10 @@
-// main{
-//   margin-top: $margin-hero;
-// }
+html,body{
+  background: $fond;
+}
 
+header{
+  background: white;
+}
 
 img{
   width:100%;
@@ -31,8 +34,12 @@ article{
   .__head{
     div{
       & > div{
-        margin: 0rem 0.5rem;
+        margin-right: 0.5rem;
+      }
+      & > div:not(:first-child){
+        margin-left: 0.5rem;
       }
+
     }
   }
 }
@@ -50,8 +57,15 @@ blockquote{
 
 .container{
   &.programme{
+    margin-top: 3rem;
+    h3{
+      margin: 0;
+    }
     .views{
       section{
+        & > div{
+          margin-bottom: 3rem;
+        }
         &:not(:last-child){
           @include croix_or;
           margin: 0 0 2rem 0;

web/themes/custom/popsu_colloque/css/components/sidebar/role_inter.scss

@@ -1,3 +1,6 @@
+.paragraph--type--role-de-l-intervenant{
+  margin-bottom: 5rem;
+}
 .___title_inter{
   border-bottom: 1px solid black;
   margin-bottom: 2rem;

web/themes/custom/popsu_colloque/css/components/sidebar/rs.scss

@@ -1,7 +1,7 @@
 .__rs{
   & > div{
-    width: 20px;
-    height: 20px;
+    width: 25px;
+    height: 25px;
     margin: 0 0.25rem;
   }
 }

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

@@ -225,6 +225,13 @@ article{
           }
         }
       }
+      .views{
+        &.__publications{
+          article{
+            width: calc( 25% - #{$gutter1} * 4);
+          }
+        }
+      }
     }
     &.bibliographie{
       article{

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

@@ -9,7 +9,7 @@
 
 @import "variables/var.scss";
 @import "mixins/mixin.scss";
-@import "typography.scss";
+@import "./typography.scss";
 @import "components/admin/edit.scss";
 @import "components/admin/toolbar.scss";
 

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

@@ -1,14 +1,162 @@
+@font-face {
+    font-family: 'dukefill';
+    src: url('../fonts/duke_fill-webfont.woff2') format('woff2'),
+         url('../fonts/duke_fill-webfont.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'cormorantBold';
+    src: url('../fonts/Cormorant-Bold-webfont.woff2') format('woff2'),
+         url('../fonts/Cormorant-Bold-webfont.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'cormorantBoldItalic';
+    src: url('../fonts/Cormorant-BoldItalic-webfont.woff2') format('woff2'),
+         url('../fonts/Cormorant-BoldItalic-webfont.woff') format('woff');
+    font-weight: lighter;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'truenoregular';
+    src: url('../fonts/truenorg-webfont.woff2') format('woff2'),
+         url('../fonts/truenorg-webfont.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+
+}
+
 main{
   h2{
-    text-transform: uppercase;
+    font-family: 'dukefill';
+    font-size: 3.5rem;
+    line-height: 3rem;
+    letter-spacing: $letter_spacingH;
   }
   h2, a{
-    // color: $color2;
+    color: $color2;
   }
+  &.home{
+    h2{
+      font-size: 2rem;
+    }
+  }
+
   h3{
     text-transform: uppercase;
     margin: 2rem 0;
+    font-family: 'dukefill';
+    font-size: 3rem;
+    letter-spacing: $letter_spacingH;
+    color: $lightgrey;
+  }
+  .__ressources{
+    h4{
+      text-transform: uppercase;
+      margin: 2rem 0;
+      font-family: 'dukefill';
+      font-size: 2rem;
+      letter-spacing: $letter_spacingH;
+      color: $color2
+    }
+  }
+
+blockquote{
+  p{
+    font-family: 'cormorantBold';
+    font-size: 3rem;
+    line-height: 3rem;
+    font-weight: lighter;
+  }
+}
+
+p{
+  font-size: 1rem;
+  line-height: 1.5rem;
+  font-family: 'truenoregular';
+}
+
+a{
+  color: black;
+  &:hover{
+    color: black;
+  }
+}
+.__wrap_content{
+  p{
+    a{
+      display: inline;
+      background: $underline;
+    }
+  }
+}
+
+.thumbnails_participants{
+  *{
+    color: $color2;
   }
+  .__name{
+    font-family: 'truenoregular';
+    font-size: 1rem;
+  }
+  .__qualite{
+    font-family: 'truenoregular';
+    font-size: 1rem;
+    font-style: italic;
+  }
+}
+
+
+
+.programme{
+  h3{
+    font-size: 1.5rem;
+    font-family: 'truenoregular';
+  }
+}
+
+.thumbnails{
+  time, .type_moment{
+    font-family: 'truenoregular';
+    font-size: 0.9rem;
+    text-transform: uppercase;
+  }
+
+  .__content{
+    a{
+      font-family: 'truenoregular';
+      font-weight: bold;
+      font-size: 1rem;
+      text-transform: uppercase;
+    }
+  }
+}
+
+.paragraph--type--role-de-l-intervenant{
+  .___title_inter{
+    div{
+      font-family: 'truenoregular';
+      font-weight: bold;
+      font-size: 0.8rem;
+      text-transform: uppercase;
+    }
+  }
+}
+
+article{
+  .__head{
+   div{
+     font-family: 'truenoregular';
+     font-size: 1rem;
+     text-transform: uppercase;
+   }
+  }
+}
   .blue, #txt_present{
     // color: $color2;
   }
@@ -20,6 +168,20 @@ main{
   }
 }
 
+#block-popsu-colloque-submenu{
+  ul{
+    li{
+      a{
+        font-size: 2rem;
+        font-family: 'dukefill';
+        letter-spacing: 0.05rem;
+        text-transform: uppercase;
+      }
+    }
+  }
+}
+
+
 .more_link{
   span{
     padding-left: 0.5rem;

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

@@ -1,8 +1,12 @@
 $color1: red;
 $color2: #1d378eff;
 $col_black: black;
-$lightgrey: grey;
+$lightgrey: #6f6d7dff;
+$fond: #1d378e0d;
+$underline:#d2d2ebff;
 
 $gutter1 : 1rem;
 
 $croix_or: '../images/croix_filetsable.svg';
+
+$letter_spacingH: 0.1rem;

web/themes/custom/popsu_colloque/fonts/stylesheet.css

@@ -0,0 +1,12 @@
+/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on July 19, 2020 */
+
+
+
+@font-face {
+    font-family: 'truenoregular';
+    src: url('truenorg-webfont.woff2') format('woff2'),
+         url('truenorg-webfont.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+
+}

web/themes/custom/popsu_colloque/template/block/block--popsu-colloque-submenu.html.twig

@@ -0,0 +1,39 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a block.
+ *
+ * Available variables:
+ * - plugin_id: The ID of the block implementation.
+ * - label: The configured label of the block if visible.
+ * - configuration: A list of the block's configuration values.
+ *   - label: The configured label for the block.
+ *   - label_display: The display settings for the label.
+ *   - provider: The module or other provider that provided this block plugin.
+ *   - Block plugin specific settings will also be stored here.
+ * - content: The content of this block.
+ * - attributes: array of HTML attributes populated by modules, intended to
+ *   be added to the main container tag of this template.
+ *   - id: A valid HTML ID and guaranteed unique.
+ * - title_attributes: Same as attributes, except applied to the main title
+ *   tag that appears in the template.
+ * - title_prefix: Additional output populated by modules, intended to be
+ *   displayed in front of the main title tag that appears in the template.
+ * - title_suffix: Additional output populated by modules, intended to be
+ *   displayed after the main title tag that appears in the template.
+ *
+ * @see template_preprocess_block()
+ *
+ * @ingroup themeable
+ */
+#}
+<div{{ attributes }} class="container">
+  {{ title_prefix }}
+  {% if label %}
+    <h2{{ title_attributes }}>{{ label }}</h2>
+  {% endif %}
+  {{ title_suffix }}
+  {% block content %}
+    {{ content }}
+  {% endblock %}
+</div>

web/themes/custom/popsu_colloque/template/node/node--presentation.html.twig

@@ -83,11 +83,11 @@
     <div class="__wrap_side col-sm-12 col-md-1 p-0 mt-0 mb-3">
       {% include 'themes/custom/popsu_colloque/template/components/share_rs.html.twig' %}
     </div>
-    <div class="__wrap_content col-sm-12 col-md-9 ">
+    <div class="__wrap_content col-sm-12 col-md-8">
       {{content.body}}
       {{content.field_les_notes}}
     </div>
-    <div class="__wrap_side col-sm-12 col-md-2">
+    <div class="__wrap_side col-sm-12 col-md-3 mt-3">
       {{content.field_add_participant}}
     </div>
   </div>