Update Unstake Confirm modal

src/components/modal/modal.module.scss

@@ -194,3 +194,7 @@
     padding: 0;
   }
 }
+
+.noMargin {
+  margin: 0;
+}

src/components/modal/modal.tsx

@@ -117,11 +117,12 @@ export const ModalHeader = ({ children, tooltipText, size }: ModalHeaderProps) =
 
 interface ModalFooterProps extends ModalSize {
   children?: React.ReactNode;
+  noMargin?: boolean;
 }
 
-export const ModalFooter = (props: ModalFooterProps) => {
-  if (!props.children) return null;
-  return <div className={styles.modalFooter}>{props.children}</div>;
+export const ModalFooter = ({ children, noMargin }: ModalFooterProps) => {
+  if (!children) return null;
+  return <div className={classNames(styles.modalFooter, { [styles.noMargin]: noMargin })}> {children}</div>;
 };
 
 export const triggerOnEnter =

src/pages/dashboard/forms/confirm-unstake-form.tsx

@@ -22,13 +22,13 @@ const ConfirmUnstakeForm = (props: Props) => {
     <>
       <ModalHeader>{props.title}</ModalHeader>
 
-      <ModalFooter>
+      <ModalFooter noMargin>
         <div className={styles.tokenAmountFormActions}>
-          <Button type="text" onClick={onClose} className={styles.cancelButton}>
+          <Button type="text-blue" size="sm" sm={{ size: 'lg' }} onClick={onClose} className={styles.cancelButton}>
             Cancel
           </Button>
-          <Button type="secondary" onClick={handleAction}>
-            Initiate Unstaking
+          <Button type="primary" size="sm" sm={{ size: 'lg' }} onClick={handleAction}>
+            Yes, Initiate Unstaking
           </Button>
         </div>
         <UnstakeHelperText type="extended" />

src/pages/dashboard/forms/forms.module.scss

@@ -112,7 +112,3 @@
     }
   }
 }
-
-.cancelButton {
-  margin-right: $space-lg;
-}