From ca73e9728fee397f739946768abbb1f1000076a6 Mon Sep 17 00:00:00 2001
From: Cheney Ni <cheneyni@umich.edu>
Date: Fri, 23 Sep 2022 12:15:20 -0400
Subject: [PATCH] fix(ui): add margin to delete role button

---
 src/pages/settings/server/Roles.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/pages/settings/server/Roles.tsx b/src/pages/settings/server/Roles.tsx
index a46c87bd..7527bb51 100644
--- a/src/pages/settings/server/Roles.tsx
+++ b/src/pages/settings/server/Roles.tsx
@@ -70,6 +70,10 @@ export const Roles = observer(({ server }: Props) => {
         }
     `;
 
+    const DeleteRoleButton = styled(Button)`
+        margin: 16px 0;
+    `;
+
     return (
         <PermissionsLayout
             server={server}
@@ -266,12 +270,12 @@ export const Roles = observer(({ server }: Props) => {
                                 <h1>
                                     <Text id="app.settings.categories.danger_zone" />
                                 </h1>
-                                <Button
+                                <DeleteRoleButton
                                     palette="error"
                                     compact
                                     onClick={deleteRole}>
                                     <Text id="app.settings.permissions.delete_role" />
-                                </Button>
+                                </DeleteRoleButton>
                             </>
                         )}
                     </div>