diff --git a/app/(home)/layout.js b/app/(home)/layout.js
index 51b304b96..9f37458db 100644
--- a/app/(home)/layout.js
+++ b/app/(home)/layout.js
@@ -1,4 +1,4 @@
-import { HomeNav } from '/components/home';
+import { HomeNav, HomeFooter } from '/components/home';
import styles from './styles.module.scss';
@@ -10,7 +10,12 @@ export default function HomeLayout({ children }) {
- {children}
+
+ {children}
+
+
>
);
}
diff --git a/app/(home)/styles.module.scss b/app/(home)/styles.module.scss
index ad95522f8..6326b3347 100644
--- a/app/(home)/styles.module.scss
+++ b/app/(home)/styles.module.scss
@@ -1,4 +1,3 @@
.main {
padding: 0 60px;
- padding-bottom: 364px;
}
diff --git a/components/home/index.js b/components/home/index.js
index a5cad7c39..efe34ee77 100644
--- a/components/home/index.js
+++ b/components/home/index.js
@@ -107,3 +107,26 @@ export const HomeNav = () => (
);
+
+//TODO: finish styling, populate links from footerMenu, add rest of footer
+export async function HomeFooter() {
+ const footerMenu = await getMenu('footer');
+
+ return (
+
+
+ For additional creative resources, visit the following:
+
+ Moodboard, Soundtrack, Twitter, Instagram.
+
+
+ To discuss creative opportunities and potential
+
+ collaborations, visit Aug.Services for more information.
+
+
+
+
+
+ );
+}
diff --git a/components/home/styles.module.scss b/components/home/styles.module.scss
index bef4daaa5..a46cf9eba 100644
--- a/components/home/styles.module.scss
+++ b/components/home/styles.module.scss
@@ -1,5 +1,11 @@
@use 'styles/_typography';
+@mixin home-grid {
+ display: grid;
+ grid-template-columns: repeat(24, 1fr);
+ column-gap: 10px;
+}
+
.homeNav {
padding: 51px 115px 22px 115px;
@@ -31,10 +37,10 @@
}
.homeProductsList {
- display: grid;
- grid-template-columns: repeat(24, 1fr);
- column-gap: 10px;
+ @include home-grid;
+
row-gap: 20px;
+ padding-bottom: 364px;
> {
li {
@@ -67,3 +73,17 @@
@include typography.subheader;
}
}
+
+.homeFooter {
+ @include home-grid;
+
+ > p {
+ @include typography.body;
+
+ grid-column-end: span 10;
+ }
+
+ > *:last-child {
+ grid-column-end: span 4;
+ }
+}
diff --git a/components/price/styles.module.scss b/components/price/styles.module.scss
new file mode 100644
index 000000000..e2170f724
--- /dev/null
+++ b/components/price/styles.module.scss
@@ -0,0 +1,12 @@
+@use 'styles/_typography';
+
+.priceRanges {
+ @include typography.header;
+
+ display: flex;
+ gap: 10px;
+
+ .originalPrice {
+ text-decoration-line: line-through;
+ }
+}