diff --git a/components/data-display.html b/components/data-display.html index a534ddf..40e86b3 100644 --- a/components/data-display.html +++ b/components/data-display.html @@ -56,17 +56,14 @@ - - - diff --git a/semantic-tokens-components.html b/semantic-tokens-components.html index b7fa4d9..4d4f0e7 100644 --- a/semantic-tokens-components.html +++ b/semantic-tokens-components.html @@ -196,10 +196,8 @@
PE ? 7.7 11.7
PE Forward ? 8.6 9.7
PEG Forward ? 1.23 1.43
- -
Semantischer TokenVerwendeter Foundation-TokenBeschreibung Verwendungszweck in der Komponente
surface-data-tablecolor-light-greyGesamtfläche der Spaltenliste.
surface-data-table-cellcolor-light-greyFläche von Spaltenzellen.
surface-data-table-help-iconcolor-medium-greyFläche des Help-Icons im Spaltenkontext.
text-data-table-defaultcolor-font-darkStandard-Textfarbe in Spaltenzellen.
text-data-table-warningcolor-signal-yellowWarnwertfarbe in Spaltenzellen.
text-data-table-help-iconcolor-font-darkTextfarbe im Spalten-Help-Icon.
diff --git a/styleguide.css b/styleguide.css index 4d3d398..17791c1 100644 --- a/styleguide.css +++ b/styleguide.css @@ -2482,6 +2482,7 @@ section + section { /* ========================================================= */ .sg-data-table { + --data-table-column-count: 3; width: 100%; border-collapse: collapse; background: var(--surface-data-table); @@ -2490,13 +2491,17 @@ section + section { .sg-data-table th, .sg-data-table td { - width: 33.333%; + width: calc(100% / var(--data-table-column-count)); padding: 0 0 var(--spacing-small) 0; border: var(--border-none); text-align: left; vertical-align: top; } +.sg-data-table[data-component="data-columns"] { + --data-table-column-count: 2; +} + .sg-data-table th { font-family: var(--font-family-base); font-size: var(--font-size-small);