Przeglądaj źródła

Fix replica details name layout for long name

If the replica name is very long (its first instance name), the 'Execute
Now' button would get pushed out of its allocated space.
Sergiu Miclea 7 lat temu
rodzic
commit
df3f4c1189

+ 3 - 0
src/components/organisms/DetailsContentHeader/DetailsContentHeader.jsx

@@ -62,6 +62,8 @@ const Text = styled.div`
 `
 const Status = styled.div`
   flex-grow: 1;
+  text-overflow: ellipsis;
+  overflow: hidden;
 `
 const StatusPills = styled.div`
   display: flex;
@@ -164,6 +166,7 @@ class DetailsContentHeader extends React.Component<Props> {
         hollow={this.props.hollowButton}
         onClick={this.props.onActionButtonClick}
         disabled={this.props.actionButtonDisabled}
+        style={{ marginLeft: '32px' }}
         data-test-id="dcHeader-actionButton"
       >{this.props.buttonLabel}</Button>
     )