style: button 공통컴포넌트에 quaternaryDisabled 추가

ASAP-as-soon-as-possible · Nov 7, 2023 · b2cf2d2 · b2cf2d2
1 parent 4c509b4
commit b2cf2d2
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/src/components/atomComponents/Button.tsx b/src/components/atomComponents/Button.tsx
@@ -99,6 +99,11 @@ const buttonCSS = {
     background-color: transparent;
     color: ${({ theme }) => theme.colors.grey6};
   `,
+  quaternaryDisabled: css`
+    ${buttonDefaultCSS.basicCss};
+    background: ${({ theme }) => theme.colors.grey7};
+    color: ${({ theme }) => theme.colors.grey2};
+  `,
 };
 
 const ButtonWrapper = styled.button<{ $type: string }>`
@@ -126,6 +131,8 @@ const ButtonWrapper = styled.button<{ $type: string }>`
         return buttonCSS.tertiaryDisabled;
       case 'halfPrimaryDisabled':
         return buttonCSS.halfPrimaryDisabled;
+      case 'quaternaryDisabled':
+        return buttonCSS.quaternaryDisabled;
       default:
         return '';
     }

diff --git a/src/pages/SteppingStone/components/SteppingBtnSection.tsx b/src/pages/SteppingStone/components/SteppingBtnSection.tsx
@@ -40,7 +40,7 @@ function SteppingBtnSection({ steppingType }: SteppingProps) {
                       <Text font={'button2'}>링크 복사하기</Text>
                     </Button>
                   </CopyToClipboard>
-                    <Button typeState={'primaryDisabled'} onClick={()=>setIsModalOpen(false)}>
+                    <Button typeState={'quaternaryDisabled'} onClick={()=>setIsModalOpen(false)}>
                       <Text font={'button2'}>나중에 공유하기</Text>
                     </Button>
                 </BottomSheetModal>