diff --git a/ui/src/components/UI/StatusBar.tsx b/ui/src/components/UI/StatusBar.tsx index 4c1fa5fd2..092f565c4 100644 --- a/ui/src/components/UI/StatusBar.tsx +++ b/ui/src/components/UI/StatusBar.tsx @@ -19,7 +19,10 @@ export const StatusBar = () => { return
setExpandedBar(true)} onMouseLeave={() => setExpandedBar(false)}>
{tappingStatus.some(pod => !pod.isTapped) && warning} - {`Tapping ${amountOfUntappedPods > 0 ? amountOfTappedPods + " / " + amountOfPods : amountOfPods} ${pluralize('pod', amountOfPods)} in ${pluralize('namespace', uniqueNamespaces.length)} ${uniqueNamespaces.join(", ")}`}
+ + {`Tapping ${amountOfUntappedPods > 0 ? amountOfTappedPods + " / " + amountOfPods : amountOfPods} ${pluralize('pod', amountOfPods)} in ${pluralize('namespace', uniqueNamespaces.length)} ${uniqueNamespaces.join(", ")}`} + +
{expandedBar &&
diff --git a/ui/src/components/UI/style/StatusBar.sass b/ui/src/components/UI/style/StatusBar.sass index 043a8b2e7..1c4965c47 100644 --- a/ui/src/components/UI/style/StatusBar.sass +++ b/ui/src/components/UI/style/StatusBar.sass @@ -17,12 +17,19 @@ width: auto max-height: 32px overflow: hidden + max-width: clamp(150px,50%,600px) .podsCount display: flex justify-content: center font-weight: 600 + .pods-count-text + width: 100% + max-width: 100% + white-space: nowrap + overflow: hidden + text-overflow: ellipsis img margin-right: 10px height: 22px