VizLegendTable: fixes column spacing to span to the right side (#35045) (#35167)

* VizLegendTable: fixes column spacing to span to the right side

* reverted text alignment to right

* implemented a more readable solution for tabble legend spacing

(cherry picked from commit 4d574bb8aa)

Co-authored-by: Uchechukwu Obasi <obasiuche62@gmail.com>

packages/grafana-ui/src/components/VizLegend/VizLegendTable.tsx

@@ -98,6 +98,9 @@ const getStyles = (theme: GrafanaTheme) => ({
   table: css`
     width: 100%;
     margin-left: ${theme.spacing.sm};
+    th:first-child {
+      width: 100%;
+    }
   `,
   header: css`
     color: ${theme.colors.textBlue};
@@ -105,6 +108,7 @@ const getStyles = (theme: GrafanaTheme) => ({
     border-bottom: 1px solid ${theme.colors.border1};
     padding: ${theme.spacing.xxs} ${theme.spacing.sm};
     text-align: right;
+    white-space: nowrap;
   `,
   headerSortable: css`
     cursor: pointer;