footer v0

web/themes/custom/popsu/css/styles.css

@@ -1176,6 +1176,7 @@ iframe {
   .header_top_left_container a[rel~='home'] {
     height: 100%;
     display: block;
+    font-size: 0;
     color: transparent;
     background: left/contain no-repeat url(../images/popsu-home-logo.png); }
 
@@ -1272,8 +1273,62 @@ iframe {
   #header-top-right .header_top_right_container #block-views-block-programmes-block-2 .views-row {
     width: 100%; }
 
-footer * {
-  word-wrap: break-word; }
+#footer-bottom {
+  padding: 2rem 0; }
+  #footer-bottom * {
+    word-wrap: break-word; }
+  #footer-bottom h2 {
+    font-weight: 500; }
+  #footer-bottom .footer_bottom_left_container {
+    height: 100%; }
+    #footer-bottom .footer_bottom_left_container div {
+      height: 100%; }
+    #footer-bottom .footer_bottom_left_container p {
+      height: 100%;
+      display: grid; }
+  #footer-bottom .logo-gouv {
+    height: 100%;
+    display: block;
+    color: transparent;
+    font-size: 0;
+    background: left/contain no-repeat url(../images/gouv.svg); }
+  #footer-bottom .logo-puca {
+    height: 100%;
+    display: block;
+    color: transparent;
+    font-size: 0;
+    background: left/contain no-repeat url(../images/puca.svg); }
+  #footer-bottom #block-pieddepage ul {
+    line-height: 2; }
+    #footer-bottom #block-pieddepage ul li a {
+      text-transform: uppercase;
+      text-decoration: none;
+      font-weight: 400; }
+      #footer-bottom #block-pieddepage ul li a:hover {
+        text-decoration: underline; }
+  #footer-bottom .footer_bottom_right_container > div > div p {
+    display: inline-block; }
+    #footer-bottom .footer_bottom_right_container > div > div p a {
+      min-width: 2rem;
+      min-height: 2rem; }
+    #footer-bottom .footer_bottom_right_container > div > div p a[href*='twitter'] {
+      height: 100%;
+      display: block;
+      font-size: 0;
+      color: transparent;
+      background: left/contain no-repeat url(../images/tw.svg); }
+    #footer-bottom .footer_bottom_right_container > div > div p a[href*='linkedin'] {
+      height: 100%;
+      display: block;
+      font-size: 0;
+      color: transparent;
+      background: left/contain no-repeat url(../images/ln.svg); }
+    #footer-bottom .footer_bottom_right_container > div > div p a[href*='youtube'] {
+      height: 100%;
+      display: block;
+      font-size: 0;
+      color: transparent;
+      background: left/contain no-repeat url(../images/yt.svg); }
 
 .about {
   background: lightblue;

web/themes/custom/popsu/partials/footer.html.twig

@@ -3,13 +3,13 @@
       {{ page.footer_top }}
     </section>
     <section id="footer-bottom" class="row">
-      <div id="footer-left" class="columns small-1">
+      <div id="footer-left" class="columns small-3 small-offset-1">
         {{ page.footer_bottom_left }}
       </div>
-      <div id="footer-middle" class="columns small-10">
+      <div id="footer-middle" class="columns small-2 small-offset-0">
         {{ page.footer_bottom_middle }}
       </div>
-      <div id="footer-right" class="columns small-1">
+      <div id="footer-right" class="columns small-4 small-offset-1">
         {{ page.footer_bottom_right }}
       </div>
     </section>

web/themes/custom/popsu/popsu.theme

@@ -45,13 +45,21 @@ function popsu_preprocess_views_view_unformatted(&$variables) {
 /* implements template_preprocess_region() */
 
 function popsu_preprocess_region(&$variables) {
-  $r = $variables['region'];
+
   if (isset($variables['region'])) {
-    $variables['attributes']['class'][] = $variables['region'].'_container';
-    
+    $variables['attributes']['class'][] = $variables['region'].'_container'; 
   }
+  // if ($variables['region'] == 'footer_bottom_right') {
+  //   if ($node = \Drupal::routeMatch()->getParameter('node')) {
+  //     $t = $node->getType();
+  //   }
+  // }
 }
 
+// function popsu_preprocess_field(&$variables){
+//   $v = $variables;
+// }
+
 
 
 // function popsu_theme_suggestions_views_view_alter(array &$suggestions, array $variables) {

web/themes/custom/popsu/sass/pages/partials/_header_footer.scss

@@ -10,6 +10,7 @@
 	a[rel~='home']{
 		height: 100%;
 		display: block;
+        font-size: 0;
 		color: transparent;
 		background: left / contain no-repeat url(../images/popsu-home-logo.png);
 	}
@@ -151,15 +152,88 @@
 		}
 	}
 }
-// nav{
 
-// 	// position: absolute;
-// 	// display: none;
-// }
-//footer
-
-footer{
+#footer-bottom{
+    padding: 2rem 0;
 	*{
 		word-wrap: break-word;
 	}
+    h2{
+        font-weight: 500;
+    }
+    .footer_bottom_left_container{
+        height: 100%;
+        div{
+            height: 100%;
+        }
+        p{
+            height: 100%;
+            display: grid;
+        }
+    }
+    .logo-gouv{
+        height: 100%;
+		display: block;
+		color: transparent;
+        font-size: 0;
+		background: left / contain no-repeat url(../images/gouv.svg);
+    }
+    .logo-puca{
+        height: 100%;
+		display: block;
+		color: transparent;
+        font-size: 0;
+		background: left / contain no-repeat url(../images/puca.svg);
+    }
+
+    #block-pieddepage{
+        ul{
+            line-height: 2;
+            li{
+                a{
+                    text-transform: uppercase;
+                    text-decoration: none;
+                    font-weight: 400;
+                    &:hover{
+                        text-decoration: underline;
+                    }
+                }
+            }
+        }
+    }
+    .footer_bottom_right_container{
+        &>div>div{
+            // display: grid;
+            // grid-template-columns: repeat(3,1fr);
+            p{
+                display: inline-block;
+                a{
+                    min-width: 2rem;
+                    min-height: 2rem;
+
+                }
+                a[href*='twitter']{
+                    height: 100%;
+                    display: block;
+                    font-size: 0;
+                    color: transparent;
+                    background: left / contain no-repeat url(../images/tw.svg);
+                }
+                a[href*='linkedin']{
+                    height: 100%;
+                    display: block;
+                    font-size: 0;
+                    color: transparent;
+                    background: left / contain no-repeat url(../images/ln.svg);
+                }
+                a[href*='youtube']{
+                    height: 100%;
+                    display: block;
+                    font-size: 0;
+                    color: transparent;
+                    background: left / contain no-repeat url(../images/yt.svg);
+                }
+            }
+        }
+    }
 }