@berlitz/footer

Footer component for the Max Design System

Usage no npm install needed!

<script type="module">
  import berlitzFooter from 'https://cdn.skypack.dev/@berlitz/footer';
</script>

README

Footer npm version

Berlitz Footer Component has several sections available. The first column consist of the Berlitz Logo, Social Icons, a Contact Link and an optional node called columnOneLogo intended for a certification logo. The Second Column is an optional Newsletter Signup form component. After this you have the option for footer navigation links will display a group of links and a title per column.

Installation

yarn add @berlitz/footer

Props

Argument Type Required Default Example
logo node ✅
phone node ❌
socialLinks array ✅
columnOneLinks array ❌
columnOneTitle string ✅
columnTwoLinks array ❌
columnTwoTitle string ❌
columnThreeLinks array ❌
columnThreeTitle string ❌
columnFourLinks array ❌
columnFourTitle string ❌
newsletterComponent node ❌
languageLinks array ❌
activeLanguage string ❌ "EN"
columnOneLogo node ❌

Usage

import Footer from '@berlitz/footer'
const MyApp = () => (
  <Section>
    <Grid>
      <Footer
        logo={logo}
        socialLinks={socialLink}
        phone={phone}
        columnOneTitle={columnOneTitle}
        columnOneLinks={columnOneLinks}
        columnTwoTitle={columnTwoTitle}
        columnTwoLinks={columnTwoLinks}
        columnThreeTitle={columnThreeTitle}
        columnThreeLinks={columnThreeLinks}
        columnFourTitle={columnFourTitle}
        columnFourLinks={columnFourLinks}
        columnOneLogo={columnOneLogo}
      />
    </Grid>
  </Section>
)

When to use this component

  • Any Page/Layout that requires a Footer