diff --git a/packages/core/src/features/catalog/__snapshots__/entity-running.test.tsx.snap b/packages/core/src/features/catalog/__snapshots__/entity-running.test.tsx.snap index 2d5653372c..8586d4538c 100644 --- a/packages/core/src/features/catalog/__snapshots__/entity-running.test.tsx.snap +++ b/packages/core/src/features/catalog/__snapshots__/entity-running.test.tsx.snap @@ -490,10 +490,10 @@ exports[`entity running technical tests when navigated to catalog renders 1`] = style="position: relative; height: 420000px; width: 100%; overflow: auto; will-change: transform; direction: ltr;" >
{ {...getCategoryColumns({ activeCategory })} onDetails={this.props.onCatalogEntityListClick} renderItemMenu={this.renderItemMenu} + tableProps={{ + customRowHeights: () => 36, // Entity avatar size + padding + }} data-testid={`catalog-list-for-${activeCategory?.metadata.name ?? "browse-all"}`} /> ); diff --git a/packages/core/src/renderer/components/+network-ingresses/ingresses.scss b/packages/core/src/renderer/components/+network-ingresses/ingresses.scss index 4c6d5a75c1..f0b754d03d 100644 --- a/packages/core/src/renderer/components/+network-ingresses/ingresses.scss +++ b/packages/core/src/renderer/components/+network-ingresses/ingresses.scss @@ -12,7 +12,7 @@ &.rules { flex-grow: 3.0; overflow-x: scroll; - text-overflow: unset; + flex-wrap: wrap; &::-webkit-scrollbar { display: none; @@ -20,7 +20,6 @@ .ingressRule { overflow: hidden; - text-overflow: ellipsis; } .ingressRule + .ingressRule { diff --git a/packages/core/src/renderer/components/+workloads-pods/pods.tsx b/packages/core/src/renderer/components/+workloads-pods/pods.tsx index 849a101ae1..1132c00a0c 100644 --- a/packages/core/src/renderer/components/+workloads-pods/pods.tsx +++ b/packages/core/src/renderer/components/+workloads-pods/pods.tsx @@ -29,6 +29,7 @@ import nodeApiInjectable from "../../../common/k8s-api/endpoints/node.api.inject import eventStoreInjectable from "../+events/store.injectable"; import podStoreInjectable from "./store.injectable"; import { NamespaceSelectBadge } from "../+namespaces/namespace-select-badge"; +import { Tooltip } from "../tooltip"; enum columnId { name = "name", @@ -163,13 +164,14 @@ class NonInjectedPods extends React.Component { { title: "Status", className: "status", sortBy: columnId.status, id: columnId.status }, ]} renderTableContents={pod => [ - , + <> + + {pod.getName()} + + + {pod.getName()} + + , , and there is not enough space to show all the content &.sorting.nowrap { display: flex; align-items: center; + } - > * { - flex-shrink: 0; - } + .sortIcon { + transition: 150ms opacity; + opacity: 0; + position: absolute; + right: 0; + background: var(--tableHeaderBackground); - > .content { - flex-shrink: 1; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - - > .sortIcon { - margin: 0; + &.enabled { + opacity: 1; } } - .Table.sortable > .TableHead & { - user-select: none; - white-space: nowrap; + &:hover .sortIcon { + opacity: 1; + } - &.sorting { - cursor: pointer; - } - - .sortIcon { - transition: 350ms opacity; - opacity: .3; - - &.enabled { - opacity: 1; - } - } + &.sorting { + cursor: pointer; } a { diff --git a/packages/core/src/renderer/components/table/table-head.scss b/packages/core/src/renderer/components/table/table-head.scss index ca51e39d63..c58600b038 100644 --- a/packages/core/src/renderer/components/table/table-head.scss +++ b/packages/core/src/renderer/components/table/table-head.scss @@ -9,6 +9,8 @@ color: var(--tableHeaderColor); display: flex; flex-shrink: 0; + user-select: none; + white-space: nowrap; &.topLine { border-top: 1px solid var(--borderFaintColor);