Refactor(header): align text with content

src/components/organisms/Footer.tsx

@@ -1,11 +1,21 @@
 import { Col, Flex, Layout, Row, Typography } from "antd";
+import { css } from "@emotion/react";
 
 import { SNSHomepage, SNSInstagram, SNSLinkedin, SNSYoutube } from "@/assets";
 
 const { Title, Paragraph, Text } = Typography;
 const { Footer } = Layout;
 
-const FooterTitle = () => <Title level={5}>사단법인 뉴웨이즈(NEWWAYS)</Title>;
+const FooterTitle = () => (
+  <Title
+    level={5}
+    css={css`
+      margin: 0;
+    `}
+  >
+    사단법인 뉴웨이즈(NEWWAYS)
+  </Title>
+);
 
 const FooterDescription = () => (
   <Flex vertical align="start" gap={0}>
@@ -54,7 +64,12 @@ const FooterLinks = () => (
 );
 
 const NewwaysFooter = () => (
-  <Footer style={{ textAlign: "start" }}>
+  <Footer
+    css={css`
+      text-align: start;
+      padding: 28px 0 60px 0;
+    `}
+  >
     <Row justify="center">
       <Col span={16}>
         <Flex vertical align="start" gap="large">

src/components/organisms/Header.tsx

@@ -5,7 +5,11 @@ import { NewWaysLogo } from "@/assets";
 const { Header } = Layout;
 
 const NewwaysHeader = () => (
-  <Header>
+  <Header
+    css={css`
+      padding: 0;
+    `}
+  >
     <Row
       justify="center"
       align="stretch"

src/components/pages/index.ts

@@ -1,2 +1,2 @@
 // page 컴포넌트를 모아놓은 파일
-export { default as Test } from "./Test";
+export { default as LocalCouncilReport } from "./LocalCouncilReport";

src/components/templates/Layout.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { Layout, ConfigProvider, theme } from "antd";
+import { Col, ConfigProvider, Layout, Row, theme } from "antd";
 import { Header, Footer } from "@/components/organisms";
 
 const { Content } = Layout;
@@ -17,11 +17,13 @@ const NewwaysLayout = ({ children }: Props) => {
     <ConfigProvider
       theme={{
         token: {
+          // 기본 폰트는 Pretendard로 설정합니다.
           fontFamily:
             "Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'",
         },
         components: {
           Layout: {
+            // Header, Content, Footer의 배경색을 설정합니다.
             headerBg: "#F0F0F0",
             bodyBg: "#00E9A1",
             footerBg: "#F0F0F0",
@@ -31,14 +33,18 @@ const NewwaysLayout = ({ children }: Props) => {
     >
       <Layout className="layout">
         <Header />
-        <Content style={{ padding: "0 50px" }}>
-          <div
-            className="site-layout-content"
-            style={{ background: colorBgContainer }}
-          >
-            {children}
-          </div>
-        </Content>
+        <Row justify="center">
+          <Col span={16}>
+            <Content style={{ padding: "0" }}>
+              <div
+                className="site-layout-content"
+                style={{ background: colorBgContainer }}
+              >
+                {children}
+              </div>
+            </Content>
+          </Col>
+        </Row>
         <Footer />
       </Layout>
     </ConfigProvider>

src/router.tsx

@@ -3,10 +3,12 @@ import {
   createRoutesFromElements,
   Route,
 } from "react-router-dom";
-import { Test } from "@/components/pages";
+import { LocalCouncilReport } from "@/components/pages";
 
 const router = createBrowserRouter(
-  createRoutesFromElements([<Route path="/" element={<Test />} />]),
+  createRoutesFromElements([
+    <Route path="/" element={<LocalCouncilReport />} />,
+  ]),
 );
 
 export default router;