diff --git a/assets/scss/_base.scss b/assets/scss/_base.scss index 629de7a690..6e4551a8fb 100644 --- a/assets/scss/_base.scss +++ b/assets/scss/_base.scss @@ -893,6 +893,11 @@ section#cncf { } } +footer.row { + margin-left: initial; + margin-right: initial; +} + /* DOCUMENTATION */ // nav-tabs and tab-content diff --git a/assets/scss/_custom.scss b/assets/scss/_custom.scss index d0e6233131..e5ebb597f8 100644 --- a/assets/scss/_custom.scss +++ b/assets/scss/_custom.scss @@ -328,6 +328,45 @@ footer { color: #e9e9e9; } +// Custom footer sizing +@media (min-width: 800px) and (max-width: 1279px) { + footer { + ul.footer-icons { + min-width: 17.5vw; + display: flex; + flex-wrap: nowrap; + flex-direction: row; + justify-content: space-evenly; + } + .col-sm-2 { + flex: 0 0 22.5%; + max-width: 22.5%; + } + .footer-main.text-center { + flex: 0 0 50%; + max-width: 50%; + } + + } +} + + +@media (max-width: 799px) { + footer ul.footer-icons { + display: flex; + flex-wrap: nowrap; + flex-direction: column; + align-items: flex-start; + row-gap: 0.5em; + } + footer div.order-1 ul.footer-icons { + margin-left: auto; + } + footer div.order-3 ul.footer-icons { + margin-right: auto; + } +} + /* SIDE-DRAWER MENU */ .pi-pushmenu .sled { diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 9aa34cb8ae..8161fad940 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -2,32 +2,26 @@ {{ define "footer-links-block" }} -