FußzeileUnterer Bereich mit Links oder Infos.

Footer
import Footer, {  FooterColumn, FooterTitle, FooterLink} from '@/components/Footer';
export function Example() {  return (    <Footer>      <FooterColumn>        <FooterTitle>Lorem</FooterTitle>        <FooterLink href="/ipsum">Ipsum</FooterLink>        <FooterLink href="/dolor">Dolor</FooterLink>      </FooterColumn>      <FooterColumn>        <FooterTitle>Sit Amet</FooterTitle>        <FooterLink href="/consectetur">Consectetur</FooterLink>        <FooterLink href="/adipiscing">Adipiscing</FooterLink>      </FooterColumn>    </Footer>  );}

Footer ($cols)
import Footer, { FooterColumn, FooterTitle } from '@/components/Footer';
export function Example() {  return (    <Footer $cols={6}>      <FooterColumn>        <FooterTitle>Lorem</FooterTitle>      </FooterColumn>      <FooterColumn>        <FooterTitle>Ipsum</FooterTitle>      </FooterColumn>      <FooterColumn>        <FooterTitle>Dolor</FooterTitle>      </FooterColumn>      <FooterColumn>        <FooterTitle>Sit</FooterTitle>      </FooterColumn>      <FooterColumn>        <FooterTitle>Amet</FooterTitle>      </FooterColumn>      <FooterColumn>        <FooterTitle>Consectetur</FooterTitle>      </FooterColumn>    </Footer>  );}

Footer (with FooterBar)
import Footer, {  FooterColumn, FooterTitle, FooterLink,  FooterBar, FooterBarRight} from '@/components/Footer';
export function Example() {  return (    <Footer>      <FooterColumn>        <FooterTitle>Lorem</FooterTitle>        <FooterLink href="/ipsum">Ipsum</FooterLink>        <FooterLink href="/dolor">Dolor</FooterLink>      </FooterColumn>      <FooterColumn>        <FooterTitle>Sit Amet</FooterTitle>        <FooterLink href="/consectetur">Consectetur</FooterLink>        <FooterLink href="/adipiscing">Adipiscing</FooterLink>      </FooterColumn>            <FooterBar>        © 2024 Lorem Ipsum. All rights reserved.        <FooterBarRight>          <FooterLink href="/privacy">Privacy</FooterLink>          <FooterLink href="/terms">Terms</FooterLink>        </FooterBarRight>      </FooterBar>    </Footer>  );}

FooterColumn ($firstOnMobile)
import Footer, {  FooterColumn, FooterTitle, FooterLink} from '@/components/Footer';
export function Example() {  return (    <Footer>      <FooterColumn>        <FooterTitle>Lorem</FooterTitle>        <FooterLink href="/ipsum">Ipsum</FooterLink>      </FooterColumn>      <FooterColumn $firstOnMobile>        <FooterTitle>Important</FooterTitle>        <FooterLink href="/contact">Contact</FooterLink>      </FooterColumn>      <FooterColumn>        <FooterTitle>Dolor</FooterTitle>        <FooterLink href="/sit">Sit</FooterLink>      </FooterColumn>    </Footer>  );}