From aac5dfc63fa38ce1ecdb152be8e127e366619aa8 Mon Sep 17 00:00:00 2001
From: alexisben <alex@noesya.coop>
Date: Fri, 2 Dec 2022 21:21:48 +0100
Subject: [PATCH] footer
---
assets/sass/_theme/_configuration.sass | 1 +
assets/sass/_theme/design-system/footer.sass | 85 ++++++--------------
assets/sass/_theme/design-system/hero.sass | 2 +-
assets/sass/_theme/design-system/layout.sass | 6 +-
layouts/partials/footer/credit.html | 2 +-
layouts/partials/footer/footer-simple.html | 32 +++-----
layouts/partials/footer/legals.html | 11 +++
layouts/partials/footer/social.html | 10 +++
8 files changed, 63 insertions(+), 86 deletions(-)
create mode 100644 layouts/partials/footer/legals.html
create mode 100644 layouts/partials/footer/social.html
diff --git a/assets/sass/_theme/_configuration.sass b/assets/sass/_theme/_configuration.sass
index f71e4b8d..c1e4e8ac 100644
--- a/assets/sass/_theme/_configuration.sass
+++ b/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
diff --git a/assets/sass/_theme/design-system/footer.sass b/assets/sass/_theme/design-system/footer.sass
index f69f464f..4ae1004c 100644
--- a/assets/sass/_theme/design-system/footer.sass
+++ b/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
diff --git a/assets/sass/_theme/design-system/hero.sass b/assets/sass/_theme/design-system/hero.sass
index 695de3c4..6b4b58c2 100644
--- a/assets/sass/_theme/design-system/hero.sass
+++ b/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)
diff --git a/assets/sass/_theme/design-system/layout.sass b/assets/sass/_theme/design-system/layout.sass
index 2e8e7c31..1f49de70 100644
--- a/assets/sass/_theme/design-system/layout.sass
+++ b/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
diff --git a/layouts/partials/footer/credit.html b/layouts/partials/footer/credit.html
index b29f5002..fa0fac56 100644
--- a/layouts/partials/footer/credit.html
+++ b/layouts/partials/footer/credit.html
@@ -1 +1 @@
-<small>{{ safeHTML (i18n "commons.credit") }}</small>
+<small class="footer-credit">{{ safeHTML (i18n "commons.credit") }}</small>
diff --git a/layouts/partials/footer/footer-simple.html b/layouts/partials/footer/footer-simple.html
index 532db572..d772fe82 100644
--- a/layouts/partials/footer/footer-simple.html
+++ b/layouts/partials/footer/footer-simple.html
@@ -1,22 +1,12 @@
-<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" }}
diff --git a/layouts/partials/footer/legals.html b/layouts/partials/footer/legals.html
new file mode 100644
index 00000000..2338c9d8
--- /dev/null
+++ b/layouts/partials/footer/legals.html
@@ -0,0 +1,11 @@
+<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
diff --git a/layouts/partials/footer/social.html b/layouts/partials/footer/social.html
new file mode 100644
index 00000000..a591f5e5
--- /dev/null
+++ b/layouts/partials/footer/social.html
@@ -0,0 +1,10 @@
+<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>
--
GitLab