diff --git a/ui/src/shared/components/TimeMachineQueryTab.scss b/ui/src/shared/components/TimeMachineQueryTab.scss index 7d33f0604e..0ddc266793 100644 --- a/ui/src/shared/components/TimeMachineQueryTab.scss +++ b/ui/src/shared/components/TimeMachineQueryTab.scss @@ -4,7 +4,7 @@ background: $g2-kevlar; border-radius: 5px 5px 0 0; display: flex; - justify-content: space-between; + justify-content: flex-start; align-items: center; color: $g10-wolf; font-weight: 700; @@ -29,10 +29,10 @@ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; + flex: 1 1 0; } -.time-machine-query-tab--close { - margin-left: 10px; +.time-machine-query-tab--close, .time-machine-query-tab--hide { margin-bottom: 2px; color: $g7-graphite; @@ -40,3 +40,11 @@ color: $g16-pearl; } } + +.time-machine-query-tab--hide { + margin-right: 8px; +} + +.time-machine-query-tab--close { + margin-left: 8px; +} diff --git a/ui/src/shared/components/TimeMachineQueryTab.tsx b/ui/src/shared/components/TimeMachineQueryTab.tsx index faff771f0c..2cacfbb613 100644 --- a/ui/src/shared/components/TimeMachineQueryTab.tsx +++ b/ui/src/shared/components/TimeMachineQueryTab.tsx @@ -69,6 +69,7 @@ class TimeMachineQueryTab extends PureComponent { className={`time-machine-query-tab ${activeClass}`} onClick={this.handleSetActive} > + {this.showHideButton} { onEdit={this.handleEditName} onCancelEdit={this.handleCancelEditName} /> - {this.showHideButton} {this.removeButton} @@ -151,7 +151,7 @@ class TimeMachineQueryTab extends PureComponent { return (