diff options
Diffstat (limited to 'src/components/FooterNav')
| -rw-r--r-- | src/components/FooterNav/FooterNav.module.scss | 17 | ||||
| -rw-r--r-- | src/components/FooterNav/FooterNav.tsx | 25 |
2 files changed, 42 insertions, 0 deletions
diff --git a/src/components/FooterNav/FooterNav.module.scss b/src/components/FooterNav/FooterNav.module.scss new file mode 100644 index 0000000..af72df0 --- /dev/null +++ b/src/components/FooterNav/FooterNav.module.scss @@ -0,0 +1,17 @@ +@use "@styles/abstracts/placeholders"; + +.wrapper { + font-size: var(--font-size-sm); +} + +.list { + @extend %flex-list; + gap: var(--spacing-xs); +} + +.item { + &::before { + content: "\2022"; + margin-right: var(--spacing-xs); + } +} diff --git a/src/components/FooterNav/FooterNav.tsx b/src/components/FooterNav/FooterNav.tsx new file mode 100644 index 0000000..7266e7e --- /dev/null +++ b/src/components/FooterNav/FooterNav.tsx @@ -0,0 +1,25 @@ +import Link from 'next/link'; +import styles from './FooterNav.module.scss'; +import { footerNav } from '@config/nav'; + +const FooterNav = () => { + const navItems = footerNav.map((item) => { + return ( + <li key={item.id} className={styles.item}> + <Link href={item.slug}> + <a className={styles.link}>{item.name}</a> + </Link> + </li> + ); + }); + + return ( + <div className={styles.wrapper}> + <nav className={styles.nav}> + <ul className={styles.list}>{navItems}</ul> + </nav> + </div> + ); +}; + +export default FooterNav; |
