footer

assets/sass/_theme/_configuration.sass

@@ -130,6 +130,7 @@ $spacing2: px2rem(48) !default
 $spacing3: px2rem(64) !default
 $spacing4: px2rem(128) !default
 $spacing5: px2rem(256) !default
+$spacing-section-y: px2rem(36) !default
 
 // TODO: choisir entre margin top / bottom --> https://matthewjamestaylor.com/css-margin-top-vs-bottom
 

assets/sass/_theme/design-system/footer.sass

@@ -4,9 +4,6 @@ footer[role="contentinfo"]
     padding-bottom: $spacing3
     padding-top: $spacing3
     margin-top: $spacing4
-    address
-        font-size: px2rem(14)
-        line-height: px2rem(26)
     .logo
         img
             height: $footer-logo-height
@@ -14,64 +11,32 @@ footer[role="contentinfo"]
             width: auto
             @include media-breakpoint-up(md)
                 height: $footer-logo-height-md
-    .content
-        @include grid(3, md)
-        margin-bottom: $spacing1
-        @include media-breakpoint-up(md)
-            margin-bottom: $spacing2
-        > div
-            &:first-of-type
-                @include media-breakpoint-down(md)
-                    margin-bottom: $spacing1
-
-    .complementary
-        @include media-breakpoint-up(md)
-            align-items: center
-            display: flex
-            [class^="nav-"]
-                margin-top: 0
-                display: block
-                li
-                    display: inline-block
-                    a
-                        display: block
-            [class^="nav-"] + [class^="nav-"]
-                margin-left: auto
-                margin-right: -$spacing0
-    .credit
-        small, a
-            font-size: $meta-size
-        a
-            padding: 0
-
-    // TODO : add padding on every link in typography ?
-    [class^="nav-"]
-        margin-left: half(-$spacing0)
-        a
-            padding: half($spacing0)
-    // END TODO
-
-
     ul
         @include list-reset
+        li
+            + li
+                margin-top: $spacing0
+            a:not(:hover)
+                text-decoration-color: transparent
+    .footer
+        &-site
+            @include small
+        &-social, &-legals, &-credit
+            @include meta
+        &-credit
+            display: block
+            margin-top: $spacing0
 
-    .nav-level-1
-        align-items: flex-start
-        flex-direction: column
-        a,
-        span
-            color: $footer-color
-            display: inline-block
-            font-size: px2rem(14)
-            line-height: 1.4
-
+    @include media-breakpoint-down(md)
+        .container
+            > * + *
+                margin-top: $spacing3
     @include media-breakpoint-up(md)
-        .nav-legal,
-        .nav-social
-            flex-direction: row
-        // .nav-legal
-        //     li:not(:first-child)
-        //         margin-left: -$spacing0
-        // .nav-social
-        //     li:not(:last-child)
-        //         margin-right: -$spacing0
+        .container
+            @include grid(2, md, $spacing4)
+        .footer
+            &-site, &-social
+                text-align: right
+            &-social
+                order: 4
+                align-self: end

assets/sass/_theme/design-system/hero.sass

@@ -44,7 +44,7 @@
                 margin-bottom: calc(#{-$spacing5} + #{$spacing2})
                 margin-top: $spacing1
     @include media-breakpoint-up(md)
-        $negative-margin-bottom: px2rem(200)
+        $negative-margin-bottom: px2rem(150)
         .content
             h1
                 width: col(9)

assets/sass/_theme/design-system/layout.sass

@@ -31,7 +31,7 @@ body
 
 main
     &:not(.page-with-blocks)
-        padding-bottom: $spacing3
+        padding-bottom: $spacing-section-y
     // Create padding-top for fixed header under md
     @include media-breakpoint-down(md)
         padding-top: var(--header-height)
@@ -46,9 +46,9 @@ ul
     padding-left: px2rem(15)
 
 .document-content, .blocks
-    margin-top: $spacing2
+    margin-top: $spacing-section-y
     > * + *
-        margin-top: $spacing3
+        margin-top: $spacing-section-y
     // > *
     //     margin-top: $spacing3
     //     padding-bottom: $spacing3

layouts/partials/footer/credit.html

-<small>{{ safeHTML (i18n "commons.credit") }}</small>
+<small class="footer-credit">{{ safeHTML (i18n "commons.credit") }}</small>

layouts/partials/footer/footer-simple.html

-<div class="content">
-  <div>
-    {{ partial "footer/logo.html" }}
-  </div>
-  <div>
-    {{ partial "footer/site.html" }}
-  </div>
-  <div>
-    {{ if site.Data.menus.primary }}
-      <nav role="navigation" aria-label="{{ i18n "commons.menu.main" }}">
-        {{ partial "commons/menu.html"
-              (dict
-                "items"       site.Data.menus.primary
-                "level"       1
-                "stop"        1
-              )}}
-      </nav>
-    {{ end }}
-  </div>
+<div class="footer-logo">
+  {{ partial "footer/logo.html" }}
+</div>
+<div class="footer-site">
+  {{ partial "footer/site.html" }}
+</div>
+<div class="footer-social">
+  {{ partial "footer/social.html" }}
+</div>
+<div class="footer-legals">
+  {{ partial "footer/legals.html" }}
 </div>
-
-{{ partial "footer/complementary.html" }}

layouts/partials/footer/legals.html

+<div class="footer-legal">
+  {{ if site.Data.menus.legal }}
+    {{ partial "commons/menu.html"
+      (dict
+        "items"       site.Data.menus.legal
+        "level"       1
+        "class"       "nav-legal"
+      )}}
+  {{ end }}
+  {{ partial "footer/credit.html" }}
+</div>
\ No newline at end of file

layouts/partials/footer/social.html

+<div class="footer-social">
+  {{ if site.Data.menus.social }}
+    {{ partial "commons/menu.html"
+      (dict
+        "items"       site.Data.menus.social
+        "level"       1
+        "class"       "nav-social"
+      )}}
+  {{ end }}
+</div>