From 0a7284bb0637d36ccea3e54f4760ecff7b5cfda1 Mon Sep 17 00:00:00 2001 From: six-standard Date: Sun, 12 May 2024 23:19:15 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=ED=91=B8=ED=84=B0=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/LogoText.svg | 3 ++ src/components/common/footer/index.tsx | 49 ++++++++++++++++++++++++-- 2 files changed, 50 insertions(+), 2 deletions(-) create mode 100644 src/assets/LogoText.svg diff --git a/src/assets/LogoText.svg b/src/assets/LogoText.svg new file mode 100644 index 0000000..0a21a15 --- /dev/null +++ b/src/assets/LogoText.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/common/footer/index.tsx b/src/components/common/footer/index.tsx index 1756e34..0550cf8 100644 --- a/src/components/common/footer/index.tsx +++ b/src/components/common/footer/index.tsx @@ -1,13 +1,58 @@ import styled from '@emotion/styled'; +import Logo from '@/assets/LogoText.svg'; export const Footer = () => { - return ; + return ( + + + + + 소개 + + 스퀘어 인프라 + 사용법 소개 + + + + 지원 + + 지원 + + + + + ); }; const Wrapper = styled.div` + display: flex; + align-items: flex-start; + justify-content: space-around; + padding: 60px 0; width: 100%; height: 544px; background-color: #17181a; - position: absolute; z-index: 11; `; + +const RightContainer = styled.div` + display: flex; + gap: 60px; + color: white; +`; + +const InfoContainer = styled.div` + display: flex; + flex-direction: column; + gap: 30px; + & > span { + color: #747476; + font-weight: bold; + } +`; + +const InfoItemContainer = styled.div` + display: flex; + flex-direction: column; + gap: 15px; +`;