edb/neuf-www
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add some messy footer content

Browse Source
This commit is contained in:
elisejakob
2024-05-10 13:25:47 +02:00
parent e1a4f3233e
commit e772441558
2 changed files with 79 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
web/src/components/layout/Footer.tsx
View File

@ -12,7 +12,73 @@ export const Footer = () => {
return ( return (
<footer className={styles.footer}> <footer className={styles.footer}>
<p>Footer med kontaktinfo og sånt</p> <div className={styles.contact}>
<ul className={styles.contactList}>
<li className={styles.contactItem}>
<h2>Følg oss</h2>
<ul>
<li>
<a href="#" target="_blank">
Instagram
</a>
</li>
<li>
<a href="#" target="_blank">
Facebook
</a>
</li>
<li>
<a href="#" target="_blank">
Twitter
</a>
</li>
<li>
<a href="#" target="_blank">
Flickr
</a>
</li>
</ul>
</li>
<li className={styles.contactItem}>
<h2>Kontakt oss</h2>
<p>
Generell kontaktinfo
<br />
Billetter
<br />
Hittegods
<br />
Telefon/mail?
<br />
Lenke til kontakt/ansatte?
</p>
</li>
<li className={styles.contactItem}>
<h2>Besøk oss</h2>
<p>
Det Norske Studentersamfund
<br />
Slemdalsveien 15
<br />
0369 Oslo
<br />
<a href="#" target="_blank">
Vis i Google Maps
</a>
</p>
</li>
<li className={styles.contactItem}>
<h2>Åpningstider</h2>
<p>
Glassbaren
<br />
Andre lokaler?
<br />
Generelle åpningstider?
</p>
</li>
</ul>
</div>
<button onClick={scrollToTop}>Til toppen</button> <button onClick={scrollToTop}>Til toppen</button>
</footer> </footer>
); );

15
web/src/components/layout/footer.module.scss
View File

@ -4,8 +4,17 @@
align-items: flex-end; align-items: flex-end;
padding: var(--spacing-sitepadding); padding: var(--spacing-sitepadding);
background: #ccc; background: #ccc;
}
a { .contactList {
text-decoration: none; width: 100%;
} display: grid;
grid-template-columns: repeat(12, 1fr);
column-gap: var(--spacing-gap-column);
row-gap: var(--spacing-gap-column);
}
.contactItem {
list-style: none;
grid-column: span 3;
} }