feat(button): button 컴포넌트 구성

Refs:[#7]
chhw130 · Dec 10, 2023 · 52fb170 · 52fb170
1 parent d37ff6a
commit 52fb170
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 419 deletions.
diff --git a/component/button/MainButton.tsx b/component/button/MainButton.tsx
@@ -0,0 +1,12 @@
+import { Button, ButtonProps } from "@chakra-ui/react";
+import React from "react";
+
+const MainButton = ({ children, w, h }: ButtonProps) => {
+  return (
+    <Button bgColor={"#000000"} textColor={"white"} w={w} h={h}>
+      {children}
+    </Button>
+  );
+};
+
+export default MainButton;
diff --git a/component/form/SignUpForm.tsx b/component/form/SignUpForm.tsx
@@ -29,8 +29,6 @@ const SignUpForm = () => {
 
   const router = useRouter();
 
-  //   const { signUpHandler, isLoading } = useSignUp(token);
-
   /**회원가입 form 제출시 */
   const onSubmit = async (data: any) => {
     const year = Number(data.birth?.slice(0, 4));
@@ -46,8 +44,6 @@ const SignUpForm = () => {
       phone: data.phone_number,
       pick: Number(data.pick),
     };
-
-    // await signUpHandler(signUpInform);
   };
 
   return (

diff --git a/src/app/globals.css b/src/app/globals.css
@@ -1,105 +1,9 @@
-:root {
-  --max-width: 1100px;
-  --border-radius: 12px;
-  --font-mono: ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono',
-    'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro',
-    'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace;
-
-  --foreground-rgb: 0, 0, 0;
-  --background-start-rgb: 214, 219, 220;
-  --background-end-rgb: 255, 255, 255;
-
-  --primary-glow: conic-gradient(
-    from 180deg at 50% 50%,
-    #16abff33 0deg,
-    #0885ff33 55deg,
-    #54d6ff33 120deg,
-    #0071ff33 160deg,
-    transparent 360deg
-  );
-  --secondary-glow: radial-gradient(
-    rgba(255, 255, 255, 1),
-    rgba(255, 255, 255, 0)
-  );
-
-  --tile-start-rgb: 239, 245, 249;
-  --tile-end-rgb: 228, 232, 233;
-  --tile-border: conic-gradient(
-    #00000080,
-    #00000040,
-    #00000030,
-    #00000020,
-    #00000010,
-    #00000010,
-    #00000080
-  );
-
-  --callout-rgb: 238, 240, 241;
-  --callout-border-rgb: 172, 175, 176;
-  --card-rgb: 180, 185, 188;
-  --card-border-rgb: 131, 134, 135;
-}
-
-@media (prefers-color-scheme: dark) {
-  :root {
-    --foreground-rgb: 255, 255, 255;
-    --background-start-rgb: 0, 0, 0;
-    --background-end-rgb: 0, 0, 0;
-
-    --primary-glow: radial-gradient(rgba(1, 65, 255, 0.4), rgba(1, 65, 255, 0));
-    --secondary-glow: linear-gradient(
-      to bottom right,
-      rgba(1, 65, 255, 0),
-      rgba(1, 65, 255, 0),
-      rgba(1, 65, 255, 0.3)
-    );
-
-    --tile-start-rgb: 2, 13, 46;
-    --tile-end-rgb: 2, 5, 19;
-    --tile-border: conic-gradient(
-      #ffffff80,
-      #ffffff40,
-      #ffffff30,
-      #ffffff20,
-      #ffffff10,
-      #ffffff10,
-      #ffffff80
-    );
-
-    --callout-rgb: 20, 20, 20;
-    --callout-border-rgb: 108, 108, 108;
-    --card-rgb: 100, 100, 100;
-    --card-border-rgb: 200, 200, 200;
-  }
-}
-
-* {
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-}
-
 html,
 body {
   max-width: 100vw;
   overflow-x: hidden;
 }
 
-body {
-  color: rgb(var(--foreground-rgb));
-  background: linear-gradient(
-      to bottom,
-      transparent,
-      rgb(var(--background-end-rgb))
-    )
-    rgb(var(--background-start-rgb));
-}
-
-a {
-  color: inherit;
-  text-decoration: none;
-}
-
 @media (prefers-color-scheme: dark) {
   html {
     color-scheme: dark;

diff --git a/src/app/page.module.css b/src/app/page.module.css