diff --git a/src/components/Footer.css b/src/components/Footer.css index 77022ed..9837582 100644 --- a/src/components/Footer.css +++ b/src/components/Footer.css @@ -1,12 +1,32 @@ .footer { - background-color: #333; - text-align: center; - padding: 10px 0; - position: relative; - bottom: 0; /* Stick to the bottom */ - width: 100%; + display: flex; + justify-content: space-evenly; + align-items: center; + background-color: #0b0b0b; + color: white; + padding: 10px 20px; } -.footer p { - color: #d4d1c6; -} \ No newline at end of file +.footer-links { + display: flex; + flex-direction: column; + align-items: center; +} + +.footer-links a { + color: gray; + text-decoration: none; + margin: 5px 0; + user-select: none; + outline: none; +} + +.footer-links a:hover { + text-decoration: none; + opacity: 0.8; +} + +.footer-title { + text-align: center; + flex: 0 0 auto; +} diff --git a/src/components/Footer.js b/src/components/Footer.js index 72ac68f..e5e534f 100644 --- a/src/components/Footer.js +++ b/src/components/Footer.js @@ -4,7 +4,18 @@ import './Footer.css'; const Footer = () => { return ( ); };