affinage style event

user/themes/epau-antimatter/css-compiled/template.css

@@ -1247,7 +1247,7 @@ body#top.modular.fullwidth.title-center.title-h1h2 {
       line-height: 2,5rem;
       background: #fff;
       width: 4rem;
-      height: 5rem;
+      height: 2rem;
       border-radius: 3px;
       display: inline-block;
       text-align: top; }
@@ -1325,6 +1325,31 @@ button:focus {
 
 .event .callout {
   filter: opacity(1); }
+  .event .callout h2 {
+    font-family: "Sarabun Light";
+    font-weight: 100 !important;
+    font-size: 1.8rem;
+    line-height: 1.2;
+    text-transform: uppercase;
+    margin: 0; }
+  .event .callout .titre_bsn {
+    position: relative; }
+    .event .callout .titre_bsn #explog {
+      position: absolute;
+      right: 100%;
+      top: 25%;
+      max-width: 30%; }
+    .event .callout .titre_bsn .text-titre-event h1 {
+      text-transform: uppercase;
+      line-height: 1 !important;
+      margin-bottom: 0.5rem !important; }
+    .event .callout .titre_bsn .text-titre-event .sous-titre {
+      margin-top: 1rem; }
+
+h1 {
+  text-transform: uppercase;
+  line-height: 1 !important;
+  margin-bottom: 0.5rem !important; }
 
 .presentation-event {
   display: flex;
@@ -1334,13 +1359,31 @@ button:focus {
   height: auto;
   background-color: white;
   color: #000;
+  padding-top: 1.5rem;
   padding-left: 2em;
   padding-right: 2em;
   margin-top: 6rem;
+  margin-bottom: 6rem;
   text-align: left; }
-
+  .presentation-event p {
-.event .titre_bsn h1 {
+    font-size: 1.2rem;
-  text-transform: uppercase; }
+    line-height: 1.5;
+    margin: 1rem; }
+  .presentation-event .boutons-event {
+    margin-top: 2rem;
+    margin-bottom: 2rem;
+    display: flex;
+    flex-direction: column; }
+    .presentation-event .boutons-event .bouton {
+      border: solid !important;
+      background-color: transparent;
+      border-radius: 0px !important;
+      text-transform: uppercase;
+      align-self: flex-end;
+      margin: auto;
+      margin-bottom: 0.8rem !important;
+      font-size: 0.7rem;
+      padding: 2px 10px; }
 
 .intervenant {
   background-color: #d9d9d9;
@@ -1463,6 +1506,9 @@ button:focus {
     display: flex;
     padding: 2rem; }
 
+.event #new-footer {
+  border-top: solid 5px #d9d9d9; }
+
 .modular.header-image #header {
   background-color: rgba(255, 255, 255, 0);
   box-shadow: none; }

user/themes/epau-antimatter/scss/template/_custom.scss

@@ -674,7 +674,7 @@ body#top.modular.fullwidth.title-center.title-h1h2 {
       line-height: 2,5rem;
       background: #fff;
       width: 4rem;
-      height: 5rem;
+      height: 2rem;
       border-radius: $border-radius;
       display: inline-block;
       text-align: top;
@@ -794,11 +794,49 @@ button:focus {
 
 // CSS page evenement
 
-.event .callout{
+.event{
-  filter:opacity(1);
+  .callout{
+    filter:opacity(1);
+    h2 {
+      font-family: "Sarabun Light";
+      font-weight: 100 !important;
+      font-size:1.8rem;
+      line-height: 1.2;
+      text-transform: uppercase;
+      margin:0 ;
+    }
+
+    .titre_bsn {
+      position: relative;
+      #explog{
+        position: absolute;
+        right: 100%;
+        top: 25%;
+        max-width:30%;
+      }
+      .text-titre-event{
+        h1{
+        text-transform: uppercase;
+        line-height:1 !important;
+        margin-bottom: 0.5rem !important;
+        }
+        .sous-titre{
+          margin-top: 1rem;
+        }
+      }
+    }
+
+  } 
+
 }
 
 
+h1{
+  text-transform: uppercase;
+  line-height:1 !important;
+  margin-bottom: 0.5rem !important;
+  }
+
 .presentation-event{
   display: flex;
   flex-direction: column;
@@ -807,17 +845,38 @@ button:focus {
   height:auto;
   background-color: white;
   color: #000;
+  padding-top: 1.5rem;
   padding-left: 2em;
   padding-right: 2em;
   margin-top: 6rem;
+  margin-bottom: 6rem;
   text-align: left;
+  p{
+    font-size: 1.2rem;
+    line-height: 1.5;
+    margin: 1rem;
+  }
+  .boutons-event {
+    margin-top: 2rem;
+    margin-bottom: 2rem;
+    display: flex;
+    flex-direction: column;
+    .bouton {
+      border: solid !important;
+      background-color: transparent;
+      border-radius: 0px !important;
+      text-transform: uppercase;
+      align-self: flex-end;
+      margin:auto;
+      margin-bottom: 0.8rem !important;
+      font-size: 0.7rem;
+      padding: 2px 10px;
+    }
+  }
 }
 
 
 
-.event .titre_bsn h1{
-  text-transform: uppercase;
-}
 
 .intervenant{
   background-color: #d9d9d9;
@@ -825,7 +884,6 @@ button:focus {
   text-transform: uppercase;
   padding-bottom: 2rem;
   padding-top: 2rem;
-
 }
 
 
@@ -990,6 +1048,7 @@ button:focus {
   // padding-left: 3rem;
   // padding-right: 6rem;
   flex-wrap: wrap;
+
   p{
     display: flex;
     margin: auto;
@@ -1000,4 +1059,8 @@ button:focus {
     padding: 2rem;
 
   }
-}
+}
+
+.event #new-footer{
+  border-top:solid 5px #d9d9d9;
+}

user/themes/epau-antimatter/scss/template/modular/_showcase.scss

@@ -22,8 +22,10 @@
         padding-top: 4rem;
         padding-bottom: 4rem;
         background-color: #666;
-        background-size: cover;
+        background-size:cover;
         background-position: center;
+        // background-repeat: no-repeat;
+        
 
         text-align: center;
         color: $header-text;

user/themes/epau-antimatter/templates/modular/showcase.html.twig

@@ -7,10 +7,11 @@
 
     <div class="presentation-event">
         {{ content|raw }}
-
+        <div class="boutons-event">
-        {% for button in page.header.buttons %}
+            {% for button in page.header.buttons %}
-            <a class="bouton{% if button.primary %} primary{% endif %}" href="{{ button.url }}">{{ button.text }}</a>
+                <a class="bouton{% if button.primary %} primary{% endif %}" href="{{ button.url }}">{{ button.text }}</a>
-        {% endfor %}
+            {% endfor %}
+        </div>
     </div>    
 
 </div>

user/themes/epau-antimatter/templates/modular/titre-event.html.twig

@@ -1,4 +1,6 @@
 <div class="callout after-h1">
+
+
     <!-- {% set image = page.media.images|first %}
     {% if image %}
         {{ image.cropResize(400,400).html('','','align-'~page.header.image_align)|raw }}
@@ -9,26 +11,22 @@
   </div>     -->
 
   <div class="titre_bsn">
+    <div class="logo-event">
+    <img id="explog" src="Republique-francaise-logo-sans-text.svg" alt="logo Expérimentation Logement">
+    </div>
 
-  <h1>Lancement du programme Expérimentation Logement</h1>
+    <div class="text-titre-event"> 
+      <h1>Lancement du programme </br>Expérimentation Logement</h1>
 
-  <div class="souligne toleft " >
+      <div class="souligne toleft " >
-    <svg width="100%" height="0.5rem">
+        <svg width="100%" height="0.5rem">
-     <rect class="" width="100%" height="100%" style="fill:rgb(255,255,255)" />
+        <rect class="" width="100%" height="100%" style="fill:rgb(255,255,255)" />
-   </svg>
+      </svg>
-  </div>
+      </div>
 
-  <!-- <h2>L'EUROPE DES PROJETS ARCHITECTURAUX ET URBAINS</h2> -->
+      <div class="sous-titre">
-
+      {{ content|raw }}
-  <!-- <p>L'EUROPE DES PROJETS ARCHITECTURAUX ET URBAINS EST UN GROUPEMENT
+      </div>
-D'INTÉRÊT PUBLIC, SOUS LA TUTELLE DU MINISTÈRE EN CHARGE DE
+    </div>
-L'ARCHITECTURE, DU MINISTÈRE EN CHARGE DE L'URBANISME, LA CITÉ DE
-L'ARCHITECTURE ET DU PATRIMOINE ET DE L'ASSOCIATION EUROPAN FRANCE. IL
-CONDUIT DES ACTIONS DE RECHERCHE, D'EXPÉRIMENTATION, DE VALORISATION ET
-D'ANIMATION DES RÉSEAUX PROFESSIONNELS DU CADRE BÂTI, DE LA VILLE ET DES
-TERRITOIRES.</p> -->
-
-
-  {{ content|raw }}
   </div>
 </div>

user/themes/epau-antimatter/templates/partials/base.html.twig

@@ -47,10 +47,12 @@
     <div id="sb-site">
         {% block header %}
         <header id="header">
-            <div id="logo">
+            <a href="http://www.epau.archi.fr">
-              <img id="gouv" src="user/pages/01.home/Republique-francaise-logo-sans-text.svg" alt="logo République Française">
+                <div id="logo">
-              <img id="epau" src="user/pages/01.home/EPAU_logo_EPAU_vecto-seul.svg" alt="logo EPAU">
+                <img id="gouv" src="Republique-francaise-logo-sans-text.svg" alt="logo République Française">
-            </div>
+                <img id="epau" src="EPAU_logo_EPAU_vecto-seul.svg" alt="logo EPAU">
+                </div>
+            </a>
             <div id="navbar">
                 {% block header_extra %}{% endblock %}
                 {% if config.plugins.langswitcher.enabled %}