style: button margin

TeamRecorDream · May 29, 2024 · 1b88b46 · 1b88b46
1 parent e64f533
commit 1b88b46
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 3 deletions.
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
@@ -3,10 +3,15 @@ import styled from 'styled-components';
 interface ButtonInterface {
   message: string;
   onClick: VoidFunction;
+  className?: string;
 }
 
-const Button = ({ message, onClick }: ButtonInterface) => {
-  return <ButtonWrapper onClick={onClick}>{message}</ButtonWrapper>;
+const Button = ({ message, onClick, className }: ButtonInterface) => {
+  return (
+    <ButtonWrapper onClick={onClick} className={className}>
+      {message}
+    </ButtonWrapper>
+  );
 };
 
 export default Button;
@@ -18,11 +23,16 @@ const ButtonWrapper = styled.div`
 
   width: 26rem;
   height: 5.2rem;
+  margin-top: 7.4rem;
 
   font-size: 1.6rem;
   text-align: center;
   color: ${({ theme }) => theme.colors.white};
 
   border-radius: 1.8rem;
   border: 1px solid ${({ theme }) => theme.colors.white};
+
+  .unregistered {
+    margin-top: 9rem;
+  }
 `;
diff --git a/src/components/DeleteButton.tsx b/src/components/DeleteButton.tsx
@@ -37,6 +37,7 @@ const ButtonWrapper = styled.div`
 
   width: 26rem;
   height: 5.2rem;
+  margin-top: 7.4rem;
 
   font-size: 1.6rem;
   text-align: center;

diff --git a/src/pages/UnregisteredPage.tsx b/src/pages/UnregisteredPage.tsx
@@ -8,7 +8,7 @@ const UnregisteredPage = () => {
   return (
     <UnregisteredPageWrapper>
       <Title>가입된 회원이 아닙니다.</Title>
-      <Button message="확인" onClick={navigateHome} />
+      <Button message="확인" onClick={navigateHome} className="unregistered" />
     </UnregisteredPageWrapper>
   );
 };