From e1a7686992ac85ff18eef7a5a8fa2d6d1ca742f0 Mon Sep 17 00:00:00 2001
From: Julien Oculi <xdrz.jot.sr@gmail.com>
Date: Tue, 6 Feb 2024 14:40:58 +0100
Subject: [PATCH] feat(ui): :sparkles: add footer

---
 components/Footer.css          | 29 ++++++++++++
 components/Footer.tsx          | 87 ++++++++++++++++++++++++++++++++++
 src/stylesheets/components.css |  1 +
 3 files changed, 117 insertions(+)
 create mode 100644 components/Footer.css
 create mode 100644 components/Footer.tsx

diff --git a/components/Footer.css b/components/Footer.css
new file mode 100644
index 0000000..c9bb66d
--- /dev/null
+++ b/components/Footer.css
@@ -0,0 +1,29 @@
+footer {
+	height: fit-content;
+	width: 100%;
+	padding: var(--_gap);
+	display: flex;
+	gap: var(--_gap);
+	justify-content: space-around;
+	background-color: var(--_translucent);
+}
+
+.footer__badges {
+	display: grid;
+	grid-template-columns: repeat(3, 1fr);
+	gap: var(--_gap-half);
+	padding-top: var(--_gap);
+}
+
+.footer__badges__item {
+	text-decoration: none;
+	background-color: var(--_translucent);
+	color: var(--_font-color);
+	padding: var(--_gap-half);
+	border-radius: var(--radius-5);
+	text-align: center;
+
+	&:hover {
+		color: var(--_accent-color);
+	}
+}
diff --git a/components/Footer.tsx b/components/Footer.tsx
new file mode 100644
index 0000000..ecb480c
--- /dev/null
+++ b/components/Footer.tsx
@@ -0,0 +1,87 @@
+export function Footer() {
+	return (
+		<footer>
+			<section>
+				<h3>Contact</h3>
+				<p>
+					<a href='tel:+33556847961'>
+						<i class='ri-phone-line'></i> 05 56 84 79 61
+					</a>
+				</p>
+				<p>
+					<a href='mailto:fablab@iut.u-bordeaux.fr'>
+						<i class='ri-mail-line'></i> fablab@iut.u-bordeaux.fr
+					</a>
+				</p>
+			</section>
+			<section>
+				<h3>Nous rencontrer</h3>
+				<p>
+					<a
+						href='https://www.openstreetmap.org/search?whereami=1&query=44.79115%2C-0.60810#map=19/44.79115/-0.60810'
+						target='_blank'
+					>
+						<i class='ri-road-map-line'></i>{' '}
+						IUT de Bordeaux, Bâtiment 10A, 15 rue Naudet, 33170 GRADIGNAN
+					</a>
+				</p>
+				<p>
+					<i class='ri-time-line'></i> Mardi - Vendredi (10h - 18h)
+				</p>
+			</section>
+			<section>
+				<h3>Réseaux</h3>
+				<div class='footer__badges'>
+					<a
+						class='footer__badges__item'
+						href='https://tube.aquilenet.fr/c/cohabit_fablab/videos'
+						target='_blank'
+						title='Peertube'
+					>
+						<i class='ri-play-line'></i>
+					</a>
+					<a
+						class='footer__badges__item'
+						href='https://www.facebook.com/people/Fablab-Cohabit/100069798301175/'
+						target='_blank'
+						title='Facebook'
+					>
+						<i class='ri-facebook-line'></i>
+					</a>
+					<a
+						class='footer__badges__item'
+						href='https://www.instagram.com/fablabcohabit/'
+						target='_blank'
+						title='Instagram'
+					>
+						<i class='ri-instagram-line'></i>
+					</a>
+					<a
+						class='footer__badges__item'
+						href='https://www.linkedin.com/company/fablab-cohabit/about/'
+						target='_blank'
+						title='LinkedIn'
+					>
+						<i class='ri-linkedin-line'></i>
+					</a>
+					<a
+						class='footer__badges__item'
+						href='https://toot.aquilenet.fr/@cohabitfablab'
+						target='_blank'
+						title='Mastodon'
+					>
+						<i class='ri-mastodon-line'></i>
+					</a>
+					<a
+						class='footer__badges__item'
+						href='https://matrix.to/#/!thtlRrlXFrbifqMNCG:matrix.org?via=matrix.org'
+						target='_blank'
+						title='Matrix'
+					>
+						[m]
+					</a>
+				</div>
+			</section>
+		</footer>
+	)
+}
diff --git a/src/stylesheets/components.css b/src/stylesheets/components.css
index 5e080ea..95d6241 100644
--- a/src/stylesheets/components.css
+++ b/src/stylesheets/components.css
@@ -1 +1,2 @@
 @import url('../../components/Header.css');
+@import url('../../components/Footer.css');