refactor: buttons styling in plugins drawer

kubeshop · Jan 25, 2022 · 86b47ea · 86b47ea
1 parent 8e1819b
commit 86b47ea
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 7 deletions.
diff --git a/src/components/organisms/PluginManagerDrawer/PluginManagerDrawer.styled.tsx b/src/components/organisms/PluginManagerDrawer/PluginManagerDrawer.styled.tsx
@@ -14,5 +14,5 @@ export const ButtonsContainer = styled.div`
   padding: 16px;
   margin-top: 8px;
   display: flex;
-  justify-content: space-between;
+  justify-content: flex-end;
 `;
diff --git a/src/components/organisms/PluginManagerDrawer/PluginManagerDrawer.tsx b/src/components/organisms/PluginManagerDrawer/PluginManagerDrawer.tsx
@@ -57,21 +57,27 @@ function PluginManagerDrawer() {
     >
       <PluginInstallModal isVisible={isInstallModalVisible} onClose={onCloseInstallPlugin} />
       <S.ButtonsContainer>
-        <Button onClick={onClickInstallPlugin} type="primary" ghost size="small" icon={<PlusOutlined />}>
-          Install plugin
-        </Button>
         <Tooltip title={PluginManagerDrawerReloadTooltip} placement="bottom">
           <Button
             disabled={sortedPluginEntries.length === 0}
             onClick={onClickReload}
-            type="primary"
-            ghost
+            type="link"
             size="small"
             icon={<ReloadOutlined />}
           >
-            Update plugins
+            Update
           </Button>
         </Tooltip>
+        <Button
+          onClick={onClickInstallPlugin}
+          type="primary"
+          ghost
+          size="small"
+          icon={<PlusOutlined />}
+          style={{marginLeft: 8}}
+        >
+          Install
+        </Button>
       </S.ButtonsContainer>
       <S.Container>
         {sortedPluginEntries.length === 0 ? (