diff --git a/packages/console/app/src/component/go-plan-chart.css b/packages/console/app/src/component/go-plan-chart.css index a85d72ccbf7..6215cc80d6e 100644 --- a/packages/console/app/src/component/go-plan-chart.css +++ b/packages/console/app/src/component/go-plan-chart.css @@ -102,7 +102,6 @@ table { width: 100%; min-width: 48rem; - table-layout: fixed; border-spacing: 0; font-size: 0.8125rem; } @@ -254,10 +253,10 @@ } /* Phones stack each model name above its bar so the table fits without horizontal scrolling. */ @media (max-width: 40rem) { - /* Rows share the table's columns through subgrid, so number columns size to their unwrapped headers. */ + /* Rows share the table's columns through subgrid, so number columns size to their headers, which wrap in longer languages. */ table { display: grid; - grid-template-columns: minmax(0, 1fr) auto auto; + grid-template-columns: minmax(min-content, 1fr) auto auto; min-width: 0; } thead, @@ -284,6 +283,7 @@ border: 0; padding-inline: 0.375rem; font-size: 0.75rem; + white-space: normal; } /* The bars are too narrow to label 100 and 1K apart from 10K. */ [data-slot="gridline"], diff --git a/packages/console/app/src/component/go-plan-chart.tsx b/packages/console/app/src/component/go-plan-chart.tsx index 45dd4f786f9..bb961557791 100644 --- a/packages/console/app/src/component/go-plan-chart.tsx +++ b/packages/console/app/src/component/go-plan-chart.tsx @@ -50,7 +50,7 @@ export function GoPlanChart(props: { href: string }) { - +