refactor: .png 로고 사용하도록 변경한다 (#477)

blacktokkies · Oct 3, 2023 · 6da013d · 6da013d
1 parent 0e82846
commit 6da013d
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 28 deletions.
diff --git a/src/components/home/HomeHeader.tsx b/src/components/home/HomeHeader.tsx
@@ -4,7 +4,6 @@ import { Link } from 'react-router-dom';
 
 import { AccountActionMenu } from '@/components/home/AccountActionMenu';
 import { OpenActionMenuArea } from '@/components/system/OpenActionMenuArea';
-import { Logo } from '@/components/vectors/Logo';
 
 /* eslint-disable import/no-absolute-path */
 import Icons from '/icons.svg?url';
@@ -14,9 +13,7 @@ export function HomeHeader(): JSX.Element {
     <header className="bg-white shadow-md">
       <div className="container flex justify-between items-center max-w-7xl px-5 h-16">
         <Link to="/home" className="rounded-full">
-          <div role="img" aria-label="toquiz 로고">
-            <Logo className="h-11 w-11" />
-          </div>
+          <img src="/Logo.png" className="h-11 w-11" alt="toquiz 로고" />
         </Link>
         <OpenActionMenuArea
           aria-label="내 계정 액션 메뉴"

diff --git a/src/components/home/PanelGrid.tsx b/src/components/home/PanelGrid.tsx
@@ -10,7 +10,6 @@ import { PanelActionMenu } from '@/components/home/PanelActionMenu';
 import { PanelItem } from '@/components/home/PanelItem';
 import { UpdatePanelModal } from '@/components/home/UpdatePanelModal';
 import { ModalController } from '@/components/system/ModalController';
-import { Logo } from '@/components/vectors/Logo';
 import { useOverlay } from '@/hooks/useOverlay';
 
 import { DeletePanelModal } from './DeletePanelModal';
@@ -76,7 +75,7 @@ export function PanelGrid({ panelPages }: Props): JSX.Element {
       <div className="w-full h-full flex flex-col justify-center items-center">
         <div className="flex items-center gap-1 font-bold">
           <div className="text-lg">아직 작성한 패널이 없습니다</div>
-          <Logo role="img" aria-label="로고" width="36" height="36" />
+          <img src="/Logo.png" className="h-9 w-9" alt="toquiz 로고" />
         </div>
         <div className="text-grey-dark">
           새로운 패널을 만들어 질문을 받아보세요!

diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx
@@ -3,8 +3,6 @@ import React from 'react';
 import { clsx } from 'clsx';
 import { Link } from 'react-router-dom';
 
-import { Logo } from '@/components/vectors/Logo';
-
 export const Index = (): JSX.Element => (
   <main className="flex flex-col h-full overflow-auto bg-off-white">
     <header className="border-b border-grey-light">
@@ -40,9 +38,11 @@ export const Index = (): JSX.Element => (
         'sm:justify-center sm:py-10',
       )}
     >
-      <div role="img" aria-label="toquiz 로고">
-        <Logo className="h-28 w-h-28 sm:h-40 sm:w-40" />
-      </div>
+      <img
+        src="/Logo.png"
+        className="h-28 w-h-28 sm:h-40 sm:w-40"
+        alt="toquiz 로고"
+      />
       <div className="flex flex-col justify-start gap-3">
         <div>
           <p className="text-5xl font-bold sm:text-7xl">익명으로 질문을</p>

diff --git a/src/pages/Panel.tsx b/src/pages/Panel.tsx
@@ -24,7 +24,6 @@ import { CreateQuestionModal } from '@/components/panel/CreateQuestionModal';
 import { InfiniteQuestionList } from '@/components/panel/InfiniteQuestionList';
 import { PanelHeader } from '@/components/panel/PanelHeader';
 import { ModalController } from '@/components/system/ModalController';
-import { Logo } from '@/components/vectors/Logo';
 import { useSocketClient } from '@/contexts/SocketClientContext';
 import { activeInfoDetailQuery } from '@/hooks/queries/active-info';
 import { panelDetailQuery } from '@/hooks/queries/panel';
@@ -206,9 +205,11 @@ export function PanelErrorBoundary(): JSX.Element {
               </div>
             </div>
             <Link to="/home" className="underline font-semibold">
-              <div role="img" aria-label="toquiz 로고">
-                <Logo className="h-20 w-20 md:h-40 md:w-40" />
-              </div>
+              <img
+                src="/Logo.png"
+                className="h-20 w-20 md:h-40 md:w-40"
+                alt="toquiz 로고"
+              />
             </Link>
           </div>
         </div>
@@ -266,9 +267,11 @@ export function PanelErrorBoundary(): JSX.Element {
           </div>
         </div>
         <Link to="/" className="underline font-semibold">
-          <div role="img" aria-label="toquiz 로고">
-            <Logo className="h-20 w-20 md:h-40 md:w-40" />
-          </div>
+          <img
+            src="/Logo.png"
+            className="h-20 w-20 md:h-40 md:w-40"
+            alt="toquiz 로고"
+          />
         </Link>
       </div>
     </main>

diff --git a/src/pages/Root.tsx b/src/pages/Root.tsx
@@ -11,7 +11,6 @@ import {
   Link,
 } from 'react-router-dom';
 
-import { Logo } from '@/components/vectors/Logo';
 import { OverlayProvider } from '@/contexts/OverlayContext';
 import { tryRefreshToken } from '@/lib/routeGuard';
 
@@ -42,9 +41,11 @@ export function Root(): JSX.Element {
               'flex flex-col items-center gap-4',
             )}
           >
-            <div role="img" aria-label="toquiz 로고">
-              <Logo className="h-24 w-24 animate-bounce" />
-            </div>
+            <img
+              src="/Logo.png"
+              className="h-24 w-24 animate-bounce"
+              alt="toquiz 로고"
+            />
             <div className="flex items-center gap-3">
               <div className="animate-pulse rounded-full bg-primary h-3 w-3" />
               <div className="animate-pulse rounded-full bg-primary h-3 w-3" />
@@ -113,9 +114,11 @@ export const RootErrorBoundary = (): JSX.Element => {
               </div>
             </div>
             <Link to="/" className="underline font-semibold">
-              <div role="img" aria-label="toquiz 로고">
-                <Logo className="h-20 w-20 md:h-40 md:w-40" />
-              </div>
+              <img
+                src="/Logo.png"
+                className="h-20 w-20 md:h-40 md:w-40"
+                alt="toquiz 로고"
+              />
             </Link>
           </div>
         </main>
@@ -173,9 +176,11 @@ export const RootErrorBoundary = (): JSX.Element => {
           </div>
         </div>
         <Link to="/" className="underline font-semibold">
-          <div role="img" aria-label="toquiz 로고">
-            <Logo className="h-20 w-20 md:h-40 md:w-40" />
-          </div>
+          <img
+            src="/Logo.png"
+            className="h-20 w-20 md:h-40 md:w-40"
+            alt="toquiz 로고"
+          />
         </Link>
       </div>
     </main>