Update Delegation action modal

api3dao · Dec 2, 2024 · 7f423d8 · 7f423d8
1 parent 35e5365
commit 7f423d8
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 4 deletions.
diff --git a/src/pages/proposals/forms/choose-delegate-action/choose-delegate-action.module.scss b/src/pages/proposals/forms/choose-delegate-action/choose-delegate-action.module.scss
@@ -1,7 +1,24 @@
 @import '../../../../styles/variables.module.scss';
 
 .actions {
-  & > * {
-    margin: 0 $space-sm;
+  display: flex;
+  flex-direction: column-reverse;
+  gap: 24px;
+  margin-top: -8px;
+
+  &,
+  > button {
+    width: 100%;
+  }
+
+  @media (min-width: $sm) {
+    flex-direction: row;
+    justify-content: center;
+    gap: 32px;
+    margin-top: 24px;
+
+    > button {
+      width: auto;
+    }
   }
 }
diff --git a/src/pages/proposals/forms/choose-delegate-action/choose-delegate-action.tsx b/src/pages/proposals/forms/choose-delegate-action/choose-delegate-action.tsx
@@ -18,11 +18,17 @@ const ChooseDelegateAction = (props: Props) => {
 
       <ModalFooter>
         <div className={styles.actions}>
-          <Button type="secondary" onClick={onUpdateDelegation} disabled={!canUpdateDelegation}>
+          <Button
+            type="secondary-neutral"
+            size="sm"
+            sm={{ size: 'lg' }}
+            onClick={onUpdateDelegation}
+            disabled={!canUpdateDelegation}
+          >
             Update delegation
           </Button>
 
-          <Button type="secondary" onClick={onUndelegate} disabled={!canUndelegate}>
+          <Button type="primary" size="sm" sm={{ size: 'lg' }} onClick={onUndelegate} disabled={!canUndelegate}>
             Undelegate
           </Button>
         </div>