diff --git a/src/components/ui/Button.module.scss b/src/components/ui/Button.module.scss
index a0ef1e0..b87661f 100644
--- a/src/components/ui/Button.module.scss
+++ b/src/components/ui/Button.module.scss
@@ -1,5 +1,5 @@
 @reference '../../index.scss';
 
 .button {
-  @apply rounded-2xl border-2 py-3 font-semibold text-white transition-colors hover:cursor-pointer;
+  @apply rounded-2xl border-2 px-4 py-3 font-semibold text-white transition-colors hover:cursor-pointer;
 }
diff --git a/src/components/ui/Button.tsx b/src/components/ui/Button.tsx
index 9663921..19c6e23 100644
--- a/src/components/ui/Button.tsx
+++ b/src/components/ui/Button.tsx
@@ -13,10 +13,10 @@ const button = tv({
 
 interface ButtonProps {
   color?: "primary" | "secondary";
-  onClick: () => void;
+  onClick?: () => void;
 }
 
-const Button: FunctionComponent<ButtonProps> = ({ children, onClick, color = "primary" }) => {
+const Button: FunctionComponent<ButtonProps> = ({ children, onClick = () => {}, color = "primary" }) => {
   return (
     <button type="button" class={button({ color: color })} onClick={onClick}>
       {children}