From cca4792c5adfd44340238122f7fe4e6010a96676 Mon Sep 17 00:00:00 2001
From: Tianchu Zhao <evantczhao@gmail.com>
Date: Fri, 8 Oct 2021 07:02:42 +1100
Subject: [PATCH] fix(ui): fixed width button (#6883)

Signed-off-by: Tianchu Zhao <evantczhao@gmail.com>
---
 ui/src/app/shared/components/graph/graph-panel.tsx        | 8 ++++----
 .../workflow-dag/workflow-dag-render-options-panel.tsx    | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/ui/src/app/shared/components/graph/graph-panel.tsx b/ui/src/app/shared/components/graph/graph-panel.tsx
index e9b07a3cc28b..8840527ea6f4 100644
--- a/ui/src/app/shared/components/graph/graph-panel.tsx
+++ b/ui/src/app/shared/components/graph/graph-panel.tsx
@@ -134,16 +134,16 @@ export const GraphPanel = (props: Props) => {
                         ]}
                     />
                     <a onClick={() => setHorizontal(s => !s)} title='Horizontal/vertical layout'>
-                        <i className={`fa ${horizontal ? 'fa-long-arrow-alt-right' : 'fa-long-arrow-alt-down'}`} />
+                        <i className={`fa ${horizontal ? 'fa-long-arrow-alt-right' : 'fa-long-arrow-alt-down'} fa-fw`} />
                     </a>
                     <a onClick={() => setNodeSize(s => s * 1.2)} title='Zoom in'>
-                        <i className='fa fa-search-plus' />
+                        <i className='fa fa-search-plus fa-fw' />
                     </a>
                     <a onClick={() => setNodeSize(s => s / 1.2)} title='Zoom out'>
-                        <i className='fa fa-search-minus' />
+                        <i className='fa fa-search-minus fa-fw' />
                     </a>
                     <a onClick={() => setFast(s => !s)} title='Use faster, but less pretty renderer' className={fast ? 'active' : ''}>
-                        <i className='fa fa-bolt' />
+                        <i className='fa fa-bolt fa-fw' />
                     </a>
                     {props.options}
                     <div className='node-search-bar'>
diff --git a/ui/src/app/workflows/components/workflow-dag/workflow-dag-render-options-panel.tsx b/ui/src/app/workflows/components/workflow-dag/workflow-dag-render-options-panel.tsx
index e9efee3166e3..09e3f0bf3378 100644
--- a/ui/src/app/workflows/components/workflow-dag/workflow-dag-render-options-panel.tsx
+++ b/ui/src/app/workflows/components/workflow-dag/workflow-dag-render-options-panel.tsx
@@ -17,7 +17,7 @@ export class WorkflowDagRenderOptionsPanel extends React.Component<WorkflowDagRe
                         })
                     }
                     title='Collapse all nodes'>
-                    <i className='fa fa-compress' data-fa-transform='rotate-45' />
+                    <i className='fa fa-compress fa-fw' data-fa-transform='rotate-45' />
                 </a>
                 <a
                     onClick={() =>
@@ -27,7 +27,7 @@ export class WorkflowDagRenderOptionsPanel extends React.Component<WorkflowDagRe
                         })
                     }
                     title='Expand all nodes'>
-                    <i className='fa fa-expand' data-fa-transform='rotate-45' />
+                    <i className='fa fa-expand fa-fw' data-fa-transform='rotate-45' />
                 </a>
             </>
         );