diff --git a/apps/block_scout_web/assets/css/components/_footer.scss b/apps/block_scout_web/assets/css/components/_footer.scss index f18cc229ce..8e4597a297 100644 --- a/apps/block_scout_web/assets/css/components/_footer.scss +++ b/apps/block_scout_web/assets/css/components/_footer.scss @@ -1,13 +1,15 @@ $footer-background-color: $secondary !default; -$footer-padding: 1em !default; +$footer-title-color: #fff !default; $footer-text-color: rgba(#fff, 0.7) !default; +$footer-item-disc-color: $primary !default; .footer { background: $footer-background-color; color: $footer-text-color; font-size: 12px; + line-height: 1.67; margin: 0; - padding: $footer-padding; + padding: 40px 0; position: relative; @media (max-width: $breakpoint-md) { @@ -15,12 +17,20 @@ $footer-text-color: rgba(#fff, 0.7) !default; } } +.footer-logo-row { + margin-bottom: 30px; +} + .footer-logo { height: 2rem; } +.footer-info-text { + margin: 0 0 25px; + padding: 0 20px 0 0; +} + .footer-social-icons { - // float: right; padding-top: 0.5em; } @@ -29,37 +39,45 @@ $footer-text-color: rgba(#fff, 0.7) !default; } .footer-link { - color: inherit; -} + color: $footer-text-color; -.footer-link:hover { - color: white; + &:hover { + color: $footer-text-color; + text-decoration: underline; + } } .footer-list { - padding-top: 1em; + padding-top: 0; h3 { - margin-bottom: 0; - // text-align: center; - } - - hr { - margin-top: 0; - margin-bottom: 1em; - border: 0; - height: 0; - border-top: 1px solid rgba(0, 0, 0, 0.1); - border-bottom: 1px solid rgba(255, 255, 255, 0.3); + color: $footer-title-color; + font-size: 14px; + font-weight: 300; + line-height: 1.4; + margin: 0 0 15px; } ul { list-style-type: none; - padding-left: 0; - margin-left: 0; + margin: 0; + padding: 0; li { - padding-bottom: 0.5em; + align-items: center; + display: flex; + line-height: 2.5; + padding: 0; + + &::before { + background-color: $footer-item-disc-color; + border-radius: 50%; + content: ""; + display: block; + height: 6px; + margin: 0 10px 0 0; + width: 6px; + } } } } diff --git a/apps/block_scout_web/assets/css/theme/_posdao_variables.scss b/apps/block_scout_web/assets/css/theme/_posdao_variables.scss index 19315c701b..231f74b747 100644 --- a/apps/block_scout_web/assets/css/theme/_posdao_variables.scss +++ b/apps/block_scout_web/assets/css/theme/_posdao_variables.scss @@ -9,4 +9,7 @@ $dashboard-banner-gradient-end: #1e4168; $dashboard-line-color-price: $secondary; $dashboard-line-color-market: $primary; -$tile-type-block-border-color: $secondary; \ No newline at end of file +$tile-type-block-border-color: $secondary; + +$footer-background-color: #173250; +$footer-text-color: #909dac; \ No newline at end of file diff --git a/apps/block_scout_web/lib/block_scout_web/templates/layout/_footer.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/layout/_footer.html.eex index 8c9905b65f..88d5016db3 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/layout/_footer.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/layout/_footer.html.eex @@ -1,7 +1,7 @@