You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Hydro/packages/ui-default/components/footer/footer.page.styl

95 lines
1.7 KiB
Stylus

$footer-extra-link-gap = 20px
.footer
background: $footer-bg-color
color: $text-1-color
h1
font-size: rem($font-size-title)
+mobile()
padding: rem($grid-padding)
cursor: pointer
font-size: rem($font-size-secondary)
.footer__category
padding-top: rem(30px)
padding-bottom: rem(50px)
+mobile()
padding-top: rem($grid-padding)
padding-bottom: rem($grid-padding)
border-bottom: 1px solid darken($footer-bg-color, 5%)
&.expandable
padding: 0
.expand-icon
display: none
+mobile()
display: inline-block
&.expanded .expand-icon
transform: rotate(180deg)
.footer__category__list
margin-top: rem(10px)
margin-bottom: rem(10px)
font-size: rem($font-size-small)
line-height: 2
+mobile()
margin-top: 0
padding-left: rem($grid-padding)
padding-right: rem($grid-padding)
.footer__category__expander
+mobile()
display: none
+above(rupture.mobile-cutoff)
display: block !important
.footer__extra-left
float: left
.footer__extra-right
float: right
.footer__extra-link
padding: rem(20px 0)
font-size: rem($font-size-small)
.footer__extra-link-item
float: left
line-height: 2
.footer__extra-left .footer__extra-link-item
margin-right: rem($footer-extra-link-gap)
.footer__extra-right .footer__extra-link-item
margin-left: rem($footer-extra-link-gap)
.layout--immersive
.footer
background: none
color: #FFF
a, a:visited, a:active
color: #FFF
a:hover
color: #FFF
+mobile()
.footer__extra-left, .footer__extra-right
float: none
display: block
.footer__extra-link-item
float: none
display: inline-block
margin-left: 0
margin-right: $footer-extra-link-gap