diff --git a/frontend/src/components/Footer/Footer.jsx b/frontend/src/components/Footer/Footer.jsx new file mode 100644 index 0000000..65f0b6a --- /dev/null +++ b/frontend/src/components/Footer/Footer.jsx @@ -0,0 +1,22 @@ +import { Link } from 'react-router-dom'; +import styles from './Footer.module.css'; + +export default function Footer() { + return ( + + ); +} diff --git a/frontend/src/components/Footer/Footer.module.css b/frontend/src/components/Footer/Footer.module.css new file mode 100644 index 0000000..39c9c4e --- /dev/null +++ b/frontend/src/components/Footer/Footer.module.css @@ -0,0 +1,46 @@ +.footer { + width: 100%; + padding: 40px; + margin-top: 100px; + background-color: var(--background-secondary); + color: var(--text-color-tertiary); + box-sizing: border-box; +} + +.footerContent { + display: flex; + flex-direction: column; + width: 100%; + height: 100%; + max-width: 1320px; + padding: 0 40px; + margin: 0 auto; + font-size: 14px; + line-height: 1.4; + font-weight: 400; +} + +.title { + font-size: 24px; + line-height: 1.2; + font-weight: 700; +} + +.linkList { + display: flex; + align-items: center; + gap: 8px; + padding: 0; + margin: 20px 0 0; + list-style: none; + font-size: 14px; + line-height: 1.4; + font-weight: 400; +} + +.divider { + width: 2px; + height: 12px; + border-radius: 1px; + background-color: var(--text-color-tertiary); +} diff --git a/frontend/src/components/Footer/index.js b/frontend/src/components/Footer/index.js new file mode 100644 index 0000000..da94c29 --- /dev/null +++ b/frontend/src/components/Footer/index.js @@ -0,0 +1 @@ +export { default as Footer } from './Footer'; diff --git a/frontend/src/pages/HomePage/HomePage.jsx b/frontend/src/pages/HomePage/HomePage.jsx index aa58832..6861736 100644 --- a/frontend/src/pages/HomePage/HomePage.jsx +++ b/frontend/src/pages/HomePage/HomePage.jsx @@ -1,3 +1,10 @@ +import { Footer } from '../../components/Footer'; + export default function Home() { - return
Home
; + return ( +
+
asdf
+
+ ); }