Fix : prettier 적용

.github/ISSUE_TEMPLATE/trouble-shooting.md

@@ -4,13 +4,14 @@ about: 발견한 문제와 문제의 원인, 해결 방안을 제시해주세요
 title: '[Trouble Shooting]'
 labels: fix
 assignees: ''
-
 ---
 
 ## 원인
+
 <!-- 문제의 원인을 정확하게 파악하고 기록하는 것이 중요함 -->
 
 ## 접근 방법
+
  <!-- 해당 방법으로 시도한 이유와 어디서 찾았는지 출처정도를 레퍼런스 달면 좋음 -->
 
 ## 해결 과정
@@ -24,4 +25,4 @@ assignees: ''
 
 ## 결론
 
-<!-- 이 부분은 자유롭게 현 이슈를 마무리하면 된다. -->
+<!-- 이 부분은 자유롭게 현 이슈를 마무리하면 된다. -->

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,17 +1,18 @@
 ## 💡 왜 PR을 올렸나요?
+
 <!-- 예: 이슈대응, 신규피쳐, 리팩토링 ... -->
 
 - 신규 피처
 
 ## 💁 무엇이 어떻게 바뀌나요?
 
-1. 
-2. 
-3. 
+1.
+2.
+3.
 
 ## 📆 작업 예정인 것이 있나요 ?
 
-- 
+-
 
 ## 💬 리뷰어분들께
 

.github/auto_assign.yml

@@ -1,8 +1,8 @@
 addReviewers: true
 addAssignees: true
-reviewers: 
+reviewers:
   - guesung
   - seondal
 skipKeywords:
   - wip
-numberOfReviewers: 0
+numberOfReviewers: 0

.github/workflows/auto-label.yml

@@ -17,4 +17,3 @@ jobs:
         uses: jimschubert/labeler-action@v1
         with:
           GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
-

.prettierrc.js

@@ -4,7 +4,5 @@ module.exports = {
   semi: true,
   printWidth: 100,
   singleQuote: true,
-  "plugins": [
-    "prettier-plugin-tailwindcss"
-  ],
-};
+  plugins: ['prettier-plugin-tailwindcss'],
+};

next.config.js

@@ -1,6 +1,6 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-}
+};
 
-module.exports = nextConfig
+module.exports = nextConfig;

package.json

@@ -6,7 +6,8 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint"
+    "lint": "next lint",
+    "format": "prettier --write --ignore-path .gitignore ."
   },
   "dependencies": {
     "@emotion/css": "^11.11.2",

postcss.config.js

@@ -3,4 +3,4 @@ module.exports = {
     tailwindcss: {},
     autoprefixer: {},
   },
-}
+};

src/app/(Main)/components/MainHeader.tsx

@@ -1,4 +1,5 @@
 import Image from 'next/image';
+
 import Tab from './Tab';
 import { Header } from '@/components/Header';
 

src/app/(Main)/pick/components/PickSection.tsx

@@ -67,4 +67,4 @@ function CountItem({ isSelected, count, onClick }: CountItemProps) {
       <h6 className={isSelected ? 'text-main-violet-dark' : ''}>{count}</h6>
     </div>
   );
-}
+}

src/app/globals.css

@@ -22,4 +22,4 @@ html {
   html {
     font-size: 16px;
   }
-}
+}

src/components/Button/BottomFixedButton.tsx

@@ -1,5 +1,5 @@
-import BottomFixedDiv from '../BottomFixedDiv';
 import Button, { type ButtonProps } from './Button';
+import BottomFixedDiv from '../BottomFixedDiv';
 
 export default function BottomFixedButton({ children, ...props }: ButtonProps) {
   return (

src/components/Button/Button.tsx

@@ -1,4 +1,5 @@
 import { StrictPropsWithChildren } from '@/types';
+
 import type { ButtonHTMLAttributes, HTMLAttributes, PropsWithChildren } from 'react';
 
 export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {

src/components/Modal/ModalWrapper.tsx

@@ -1,10 +1,11 @@
 'use client';
 import { useRef } from 'react';
 
-import type { StrictPropsWithChildren } from '@/types';
-import { AnimatedPortal, Portal } from '../Portal';
+import { AnimatedPortal } from '../Portal';
 import { useOnClickOutside } from '@/hooks/useOnClickOutside';
 
+import type { StrictPropsWithChildren } from '@/types';
+
 interface ModalWrapperProps {
   isOpen: boolean;
   onClose?: () => void;

src/components/Portal/AnimatedPortal.tsx

@@ -1,6 +1,7 @@
 'use client';
 
-import { AnimatePresence, motion, MotionProps } from 'framer-motion';
+import { AnimatePresence, MotionProps, motion } from 'framer-motion';
+
 import { Portal } from '.';
 import { StrictPropsWithChildren } from '@/types';
 

src/components/Portal/Portal.tsx

@@ -1,9 +1,10 @@
 'use client';
 
-import useIsMounted from '@/hooks/useIsMounted';
 import { PropsWithChildren, useEffect, useRef } from 'react';
 import { createPortal } from 'react-dom';
 
+import useIsMounted from '@/hooks/useIsMounted';
+
 export type PortalProps = {
   documentId?: string;
 };

src/constants/color.ts

@@ -1,31 +1,31 @@
 export const COLOR = {
   white: '#FFFFFF',
   gray: {
-    30 : '#F9F9FB',
-    50 : '#F7F7FA',
-    100 :'#F0F0F5',
-    200 : '#E8E8EE',
-    300 :'#E1E1E8',
-    400 :'#CDCED6',
-    500 :'#A9ABB8',
-    600 :'#858899',
-    700 :'#525463',
-    800 :'#3E404C',
-    900 :'#2B2D36',
-    950 :'#252730',
+    30: '#F9F9FB',
+    50: '#F7F7FA',
+    100: '#F0F0F5',
+    200: '#E8E8EE',
+    300: '#E1E1E8',
+    400: '#CDCED6',
+    500: '#A9ABB8',
+    600: '#858899',
+    700: '#525463',
+    800: '#3E404C',
+    900: '#2B2D36',
+    950: '#252730',
   },
   black: '#141218',
   violet: {
-    50 :'#141218',
-    100 :'#E2D9FC',
-    200 :'#C8B8FA',
-    300 :'#B29BF8',
-    400 :'#9C7FF5',
-    500 :'#8662F3',
-    600 :'#744CEB',
-    700 :'#5B2EE0',
-    800 :'#4B25C1',
-    900 :'#412499',
-    950 :'#21005D',
-  }
+    50: '#141218',
+    100: '#E2D9FC',
+    200: '#C8B8FA',
+    300: '#B29BF8',
+    400: '#9C7FF5',
+    500: '#8662F3',
+    600: '#744CEB',
+    700: '#5B2EE0',
+    800: '#4B25C1',
+    900: '#412499',
+    950: '#21005D',
+  },
 } as const;

src/constants/icon.ts

@@ -1,9 +1,9 @@
 export const ICON = {
-    arrow: {
-        back: "/icons/arrow_back.svg"
-    },
-    carat: {
-        up: "/icons/carat_up.svg",
-        down: "/icons/carat_down.svg"
-    }
-} as const
+  arrow: {
+    back: '/icons/arrow_back.svg',
+  },
+  carat: {
+    up: '/icons/carat_up.svg',
+    down: '/icons/carat_down.svg',
+  },
+} as const;

styles/font.css

@@ -1,17 +1,17 @@
 @font-face {
-    font-family: "Pretendard";
-    font-weight: 700;
-    src: url('/fonts/Pretendard-Bold.woff2') format("woff2");
+  font-family: 'Pretendard';
+  font-weight: 700;
+  src: url('/fonts/Pretendard-Bold.woff2') format('woff2');
 }
 
 @font-face {
-    font-family: "Pretendard";
-    font-weight: 500;
-    src: url("/fonts/Pretendard-Medium.woff2") format("woff2");
+  font-family: 'Pretendard';
+  font-weight: 500;
+  src: url('/fonts/Pretendard-Medium.woff2') format('woff2');
 }
 
 @font-face {
-    font-family: "Pretendard";
-    font-weight: 400;
-    src: url("/fonts/Pretendard-Regular.woff2") format("woff2");
-}
+  font-family: 'Pretendard';
+  font-weight: 400;
+  src: url('/fonts/Pretendard-Regular.woff2') format('woff2');
+}

styles/theme/colors.ts

@@ -1,4 +1,4 @@
-import { COLOR } from "../../src/constants/color";
+import { COLOR } from '../../src/constants/color';
 
 export const colors = {
   // bg
@@ -30,4 +30,4 @@ export const colors = {
   'icon-default': COLOR.gray[800],
   'icon-hover': COLOR.gray[600],
   'icon-disabled': COLOR.gray[500],
-} as const;
+} as const;

styles/typography.css

@@ -1,64 +1,64 @@
 h1 {
-    font-weight: 700;
-    font-size: 3rem;
-    line-height: 3.75rem;
-    letter-spacing: -0.4px;
+  font-weight: 700;
+  font-size: 3rem;
+  line-height: 3.75rem;
+  letter-spacing: -0.4px;
 }
 h2 {
-    font-weight: 700;
-    font-size: 2rem;
-    line-height: 3rem;
-    letter-spacing: -0.4px;
+  font-weight: 700;
+  font-size: 2rem;
+  line-height: 3rem;
+  letter-spacing: -0.4px;
 }
 h3 {
-    font-weight: 700;
-    font-size: 1.5rem;
-    line-height: 2.25rem;
-    letter-spacing: -0.3px;
+  font-weight: 700;
+  font-size: 1.5rem;
+  line-height: 2.25rem;
+  letter-spacing: -0.3px;
 }
 h4 {
-    font-weight: 700;
-    font-size: 1.25rem;
-    line-height: 1.875rem;
-    letter-spacing: -0.2px;
+  font-weight: 700;
+  font-size: 1.25rem;
+  line-height: 1.875rem;
+  letter-spacing: -0.2px;
 }
 
 #subtitle-1 {
-    font-weight: 500;
-    font-size: 1rem;
-    line-height: 1.5rem;
-    letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1rem;
+  line-height: 1.5rem;
+  letter-spacing: -0.2px;
 }
 #subtitle-2 {
-    font-weight: 500;
-    font-size: 0.875rem;
-    line-height: 1.375rem;
-    letter-spacing: -0.1px;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.375rem;
+  letter-spacing: -0.1px;
 }
 #subtitle-3 {
-    font-weight: 500;
-    font-size: 0.75rem;
-    line-height: 1.125rem;
-    letter-spacing: -0px;
+  font-weight: 500;
+  font-size: 0.75rem;
+  line-height: 1.125rem;
+  letter-spacing: -0px;
 }
 
 h6 {
-    font-weight: 500;
-    font-size: 0.875rem;
-    line-height: 1.125rem;
-    letter-spacing: 0;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.125rem;
+  letter-spacing: 0;
 }
 
 p {
-    font-weight: 400;
-    font-size: 1rem;
-    line-height: 1.5rem;
-    letter-spacing: -0.1px;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5rem;
+  letter-spacing: -0.1px;
 }
 
 caption {
-    font-weight: 500;
-    font-size: 0.75rem;
-    line-height: 1.125rem;
-    letter-spacing: 0.4px;
-}
+  font-weight: 500;
+  font-size: 0.75rem;
+  line-height: 1.125rem;
+  letter-spacing: 0.4px;
+}