@sbb-esta/lyne-elements-dev 5.13.1-dev.1793881345 → 5.13.1-dev.1793963532

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/lean-off-brand-theme.css +55 -20
  2. package/lean-safety-theme.css +55 -20
  3. package/lean-theme.css +55 -20
  4. package/off-brand-theme.css +55 -20
  5. package/package.json +2 -2
  6. package/safety-theme.css +55 -20
  7. package/standard-theme.css +55 -20
  8. package/table/_table.global.scss +74 -25
package/lean-off-brand-theme.css CHANGED
@@ -1937,11 +1937,26 @@ summary {
1937
1937
  --sbb-table-sticky-shadow-width: 3rem;
1938
1938
  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
1939
1939
  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
1940
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
1941
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
1942
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
1943
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
1944
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
1940
+ --sbb-table-data-cell-font-size-xs: var(--sbb-text-font-size-xs);
1941
+ --sbb-table-data-cell-font-size-s: var(--sbb-text-font-size-xs);
1942
+ --sbb-table-data-cell-font-size-m: var(--sbb-text-font-size-s);
1943
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
1944
+ --sbb-table-header-padding-block-xs: 0;
1945
+ --sbb-table-header-padding-block-s: var(--sbb-spacing-fixed-1x);
1946
+ --sbb-table-header-padding-block-m: var(--sbb-spacing-fixed-3x);
1947
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
1948
+ --sbb-table-header-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1949
+ --sbb-table-header-padding-inline-s: var(--sbb-spacing-fixed-2x);
1950
+ --sbb-table-header-padding-inline-m: var(--sbb-spacing-fixed-4x);
1951
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
1952
+ --sbb-table-cell-padding-block-xs: 0;
1953
+ --sbb-table-cell-padding-block-s: var(--sbb-spacing-fixed-1x);
1954
+ --sbb-table-cell-padding-block-m: var(--sbb-spacing-responsive-xxxs);
1955
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
1956
+ --sbb-table-cell-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1957
+ --sbb-table-cell-padding-inline-s: var(--sbb-spacing-fixed-2x);
1958
+ --sbb-table-cell-padding-inline-m: var(--sbb-spacing-fixed-4x);
1959
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
1945
1960
  --sbb-table-sort-header-animation-easing: cubic-bezier(0.4, 0, 0.2, 1);
1946
1961
  --sbb-table-sort-header-color: var(--sbb-color-2);
1947
1962
  --sbb-table-sort-header-hover-color: var(--sbb-color-primary125);
@@ -1949,6 +1964,14 @@ summary {
1949
1964
  var(--sbb-color-primary125),
1950
1965
  var(--sbb-color-primary85)
1951
1966
  );
1967
+ --sbb-table-body-row-height-xs: 1.375rem;
1968
+ --sbb-table-body-row-height-s: 1.875rem;
1969
+ --sbb-table-body-row-height-m: 3.09375rem;
1970
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
1971
+ --sbb-table-header-row-height-xs: 1.375rem;
1972
+ --sbb-table-header-row-height-s: 1.875rem;
1973
+ --sbb-table-header-row-height-m: 2.875rem;
1974
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
1952
1975
  --sbb-tab-group-content-gap-size-s: var(--sbb-spacing-responsive-xs);
1953
1976
  --sbb-tab-group-content-gap-size-l: var(--sbb-spacing-responsive-s);
1954
1977
  --sbb-tab-group-content-gap-size-xl: var(--sbb-spacing-responsive-m);
@@ -3467,6 +3490,12 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3467
3490
  table-layout: auto;
3468
3491
  text-align: left;
3469
3492
  }
3493
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) thead tr {
3494
+ height: var(--sbb-table-header-row-height);
3495
+ }
3496
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) tbody tr {
3497
+ height: var(--sbb-table-body-row-height);
3498
+ }
3470
3499
  :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
3471
3500
  font-size: var(--sbb-table-header-cell-font-size);
3472
3501
  letter-spacing: var(--sbb-letter-spacing-text);
@@ -3514,27 +3543,33 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3514
3543
  }
3515
3544
 
3516
3545
  .sbb-table-xs {
3517
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3518
- --sbb-table-header-padding-block: 0;
3519
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
3520
- --sbb-table-cell-padding-block: 0;
3521
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
3546
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-xs);
3547
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-xs);
3548
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-xs);
3549
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-xs);
3550
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-xs);
3551
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-xs);
3552
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-xs);
3522
3553
  }
3523
3554
 
3524
3555
  .sbb-table-s {
3525
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3526
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
3527
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
3528
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
3529
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
3556
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
3557
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
3558
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
3559
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
3560
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
3561
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
3562
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
3530
3563
  }
3531
3564
 
3532
3565
  .sbb-table-m {
3533
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
3534
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
3535
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
3536
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
3537
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
3566
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
3567
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
3568
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
3569
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
3570
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
3571
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
3572
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
3538
3573
  }
3539
3574
 
3540
3575
  sbb-table-wrapper[negative] .sbb-table,
package/lean-safety-theme.css CHANGED
@@ -1957,11 +1957,26 @@ summary {
1957
1957
  --sbb-table-sticky-shadow-width: 3rem;
1958
1958
  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
1959
1959
  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
1960
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
1961
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
1962
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
1963
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
1964
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
1960
+ --sbb-table-data-cell-font-size-xs: var(--sbb-text-font-size-xs);
1961
+ --sbb-table-data-cell-font-size-s: var(--sbb-text-font-size-xs);
1962
+ --sbb-table-data-cell-font-size-m: var(--sbb-text-font-size-s);
1963
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
1964
+ --sbb-table-header-padding-block-xs: 0;
1965
+ --sbb-table-header-padding-block-s: var(--sbb-spacing-fixed-1x);
1966
+ --sbb-table-header-padding-block-m: var(--sbb-spacing-fixed-3x);
1967
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
1968
+ --sbb-table-header-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1969
+ --sbb-table-header-padding-inline-s: var(--sbb-spacing-fixed-2x);
1970
+ --sbb-table-header-padding-inline-m: var(--sbb-spacing-fixed-4x);
1971
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
1972
+ --sbb-table-cell-padding-block-xs: 0;
1973
+ --sbb-table-cell-padding-block-s: var(--sbb-spacing-fixed-1x);
1974
+ --sbb-table-cell-padding-block-m: var(--sbb-spacing-responsive-xxxs);
1975
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
1976
+ --sbb-table-cell-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1977
+ --sbb-table-cell-padding-inline-s: var(--sbb-spacing-fixed-2x);
1978
+ --sbb-table-cell-padding-inline-m: var(--sbb-spacing-fixed-4x);
1979
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
1965
1980
  --sbb-table-sort-header-animation-easing: cubic-bezier(0.4, 0, 0.2, 1);
1966
1981
  --sbb-table-sort-header-color: var(--sbb-color-2);
1967
1982
  --sbb-table-sort-header-hover-color: var(--sbb-color-primary125);
@@ -1969,6 +1984,14 @@ summary {
1969
1984
  var(--sbb-color-primary125),
1970
1985
  var(--sbb-color-primary85)
1971
1986
  );
1987
+ --sbb-table-body-row-height-xs: 1.375rem;
1988
+ --sbb-table-body-row-height-s: 1.875rem;
1989
+ --sbb-table-body-row-height-m: 3.09375rem;
1990
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
1991
+ --sbb-table-header-row-height-xs: 1.375rem;
1992
+ --sbb-table-header-row-height-s: 1.875rem;
1993
+ --sbb-table-header-row-height-m: 2.875rem;
1994
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
1972
1995
  --sbb-tab-group-content-gap-size-s: var(--sbb-spacing-responsive-xs);
1973
1996
  --sbb-tab-group-content-gap-size-l: var(--sbb-spacing-responsive-s);
1974
1997
  --sbb-tab-group-content-gap-size-xl: var(--sbb-spacing-responsive-m);
@@ -3487,6 +3510,12 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3487
3510
  table-layout: auto;
3488
3511
  text-align: left;
3489
3512
  }
3513
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) thead tr {
3514
+ height: var(--sbb-table-header-row-height);
3515
+ }
3516
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) tbody tr {
3517
+ height: var(--sbb-table-body-row-height);
3518
+ }
3490
3519
  :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
3491
3520
  font-size: var(--sbb-table-header-cell-font-size);
3492
3521
  letter-spacing: var(--sbb-letter-spacing-text);
@@ -3534,27 +3563,33 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3534
3563
  }
3535
3564
 
3536
3565
  .sbb-table-xs {
3537
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3538
- --sbb-table-header-padding-block: 0;
3539
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
3540
- --sbb-table-cell-padding-block: 0;
3541
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
3566
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-xs);
3567
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-xs);
3568
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-xs);
3569
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-xs);
3570
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-xs);
3571
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-xs);
3572
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-xs);
3542
3573
  }
3543
3574
 
3544
3575
  .sbb-table-s {
3545
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3546
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
3547
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
3548
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
3549
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
3576
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
3577
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
3578
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
3579
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
3580
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
3581
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
3582
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
3550
3583
  }
3551
3584
 
3552
3585
  .sbb-table-m {
3553
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
3554
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
3555
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
3556
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
3557
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
3586
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
3587
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
3588
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
3589
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
3590
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
3591
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
3592
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
3558
3593
  }
3559
3594
 
3560
3595
  sbb-table-wrapper[negative] .sbb-table,
package/lean-theme.css CHANGED
@@ -1957,11 +1957,26 @@ summary {
1957
1957
  --sbb-table-sticky-shadow-width: 3rem;
1958
1958
  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
1959
1959
  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
1960
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
1961
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
1962
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
1963
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
1964
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
1960
+ --sbb-table-data-cell-font-size-xs: var(--sbb-text-font-size-xs);
1961
+ --sbb-table-data-cell-font-size-s: var(--sbb-text-font-size-xs);
1962
+ --sbb-table-data-cell-font-size-m: var(--sbb-text-font-size-s);
1963
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
1964
+ --sbb-table-header-padding-block-xs: 0;
1965
+ --sbb-table-header-padding-block-s: var(--sbb-spacing-fixed-1x);
1966
+ --sbb-table-header-padding-block-m: var(--sbb-spacing-fixed-3x);
1967
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
1968
+ --sbb-table-header-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1969
+ --sbb-table-header-padding-inline-s: var(--sbb-spacing-fixed-2x);
1970
+ --sbb-table-header-padding-inline-m: var(--sbb-spacing-fixed-4x);
1971
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
1972
+ --sbb-table-cell-padding-block-xs: 0;
1973
+ --sbb-table-cell-padding-block-s: var(--sbb-spacing-fixed-1x);
1974
+ --sbb-table-cell-padding-block-m: var(--sbb-spacing-responsive-xxxs);
1975
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
1976
+ --sbb-table-cell-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1977
+ --sbb-table-cell-padding-inline-s: var(--sbb-spacing-fixed-2x);
1978
+ --sbb-table-cell-padding-inline-m: var(--sbb-spacing-fixed-4x);
1979
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
1965
1980
  --sbb-table-sort-header-animation-easing: cubic-bezier(0.4, 0, 0.2, 1);
1966
1981
  --sbb-table-sort-header-color: var(--sbb-color-2);
1967
1982
  --sbb-table-sort-header-hover-color: var(--sbb-color-primary125);
@@ -1969,6 +1984,14 @@ summary {
1969
1984
  var(--sbb-color-primary125),
1970
1985
  var(--sbb-color-primary85)
1971
1986
  );
1987
+ --sbb-table-body-row-height-xs: 1.375rem;
1988
+ --sbb-table-body-row-height-s: 1.875rem;
1989
+ --sbb-table-body-row-height-m: 3.09375rem;
1990
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
1991
+ --sbb-table-header-row-height-xs: 1.375rem;
1992
+ --sbb-table-header-row-height-s: 1.875rem;
1993
+ --sbb-table-header-row-height-m: 2.875rem;
1994
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
1972
1995
  --sbb-tab-group-content-gap-size-s: var(--sbb-spacing-responsive-xs);
1973
1996
  --sbb-tab-group-content-gap-size-l: var(--sbb-spacing-responsive-s);
1974
1997
  --sbb-tab-group-content-gap-size-xl: var(--sbb-spacing-responsive-m);
@@ -3487,6 +3510,12 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3487
3510
  table-layout: auto;
3488
3511
  text-align: left;
3489
3512
  }
3513
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) thead tr {
3514
+ height: var(--sbb-table-header-row-height);
3515
+ }
3516
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) tbody tr {
3517
+ height: var(--sbb-table-body-row-height);
3518
+ }
3490
3519
  :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
3491
3520
  font-size: var(--sbb-table-header-cell-font-size);
3492
3521
  letter-spacing: var(--sbb-letter-spacing-text);
@@ -3534,27 +3563,33 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3534
3563
  }
3535
3564
 
3536
3565
  .sbb-table-xs {
3537
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3538
- --sbb-table-header-padding-block: 0;
3539
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
3540
- --sbb-table-cell-padding-block: 0;
3541
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
3566
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-xs);
3567
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-xs);
3568
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-xs);
3569
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-xs);
3570
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-xs);
3571
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-xs);
3572
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-xs);
3542
3573
  }
3543
3574
 
3544
3575
  .sbb-table-s {
3545
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3546
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
3547
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
3548
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
3549
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
3576
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
3577
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
3578
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
3579
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
3580
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
3581
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
3582
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
3550
3583
  }
3551
3584
 
3552
3585
  .sbb-table-m {
3553
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
3554
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
3555
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
3556
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
3557
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
3586
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
3587
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
3588
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
3589
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
3590
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
3591
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
3592
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
3558
3593
  }
3559
3594
 
3560
3595
  sbb-table-wrapper[negative] .sbb-table,
package/off-brand-theme.css CHANGED
@@ -1937,11 +1937,26 @@ summary {
1937
1937
  --sbb-table-sticky-shadow-width: 3rem;
1938
1938
  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
1939
1939
  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
1940
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
1941
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
1942
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
1943
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
1944
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
1940
+ --sbb-table-data-cell-font-size-xs: var(--sbb-text-font-size-xs);
1941
+ --sbb-table-data-cell-font-size-s: var(--sbb-text-font-size-xs);
1942
+ --sbb-table-data-cell-font-size-m: var(--sbb-text-font-size-s);
1943
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
1944
+ --sbb-table-header-padding-block-xs: 0;
1945
+ --sbb-table-header-padding-block-s: var(--sbb-spacing-fixed-1x);
1946
+ --sbb-table-header-padding-block-m: var(--sbb-spacing-fixed-3x);
1947
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
1948
+ --sbb-table-header-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1949
+ --sbb-table-header-padding-inline-s: var(--sbb-spacing-fixed-2x);
1950
+ --sbb-table-header-padding-inline-m: var(--sbb-spacing-fixed-4x);
1951
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
1952
+ --sbb-table-cell-padding-block-xs: 0;
1953
+ --sbb-table-cell-padding-block-s: var(--sbb-spacing-fixed-1x);
1954
+ --sbb-table-cell-padding-block-m: var(--sbb-spacing-responsive-xxxs);
1955
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
1956
+ --sbb-table-cell-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1957
+ --sbb-table-cell-padding-inline-s: var(--sbb-spacing-fixed-2x);
1958
+ --sbb-table-cell-padding-inline-m: var(--sbb-spacing-fixed-4x);
1959
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
1945
1960
  --sbb-table-sort-header-animation-easing: cubic-bezier(0.4, 0, 0.2, 1);
1946
1961
  --sbb-table-sort-header-color: var(--sbb-color-2);
1947
1962
  --sbb-table-sort-header-hover-color: var(--sbb-color-primary125);
@@ -1949,6 +1964,14 @@ summary {
1949
1964
  var(--sbb-color-primary125),
1950
1965
  var(--sbb-color-primary85)
1951
1966
  );
1967
+ --sbb-table-body-row-height-xs: 1.375rem;
1968
+ --sbb-table-body-row-height-s: 1.875rem;
1969
+ --sbb-table-body-row-height-m: 3.09375rem;
1970
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
1971
+ --sbb-table-header-row-height-xs: 1.375rem;
1972
+ --sbb-table-header-row-height-s: 1.875rem;
1973
+ --sbb-table-header-row-height-m: 2.875rem;
1974
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
1952
1975
  --sbb-tab-group-content-gap-size-s: var(--sbb-spacing-responsive-xs);
1953
1976
  --sbb-tab-group-content-gap-size-l: var(--sbb-spacing-responsive-s);
1954
1977
  --sbb-tab-group-content-gap-size-xl: var(--sbb-spacing-responsive-m);
@@ -3467,6 +3490,12 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3467
3490
  table-layout: auto;
3468
3491
  text-align: left;
3469
3492
  }
3493
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) thead tr {
3494
+ height: var(--sbb-table-header-row-height);
3495
+ }
3496
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) tbody tr {
3497
+ height: var(--sbb-table-body-row-height);
3498
+ }
3470
3499
  :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
3471
3500
  font-size: var(--sbb-table-header-cell-font-size);
3472
3501
  letter-spacing: var(--sbb-letter-spacing-text);
@@ -3514,27 +3543,33 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3514
3543
  }
3515
3544
 
3516
3545
  .sbb-table-xs {
3517
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3518
- --sbb-table-header-padding-block: 0;
3519
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
3520
- --sbb-table-cell-padding-block: 0;
3521
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
3546
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-xs);
3547
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-xs);
3548
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-xs);
3549
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-xs);
3550
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-xs);
3551
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-xs);
3552
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-xs);
3522
3553
  }
3523
3554
 
3524
3555
  .sbb-table-s {
3525
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3526
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
3527
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
3528
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
3529
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
3556
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
3557
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
3558
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
3559
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
3560
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
3561
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
3562
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
3530
3563
  }
3531
3564
 
3532
3565
  .sbb-table-m {
3533
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
3534
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
3535
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
3536
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
3537
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
3566
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
3567
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
3568
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
3569
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
3570
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
3571
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
3572
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
3538
3573
  }
3539
3574
 
3540
3575
  sbb-table-wrapper[negative] .sbb-table,
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@sbb-esta/lyne-elements-dev",
3
- "version": "5.13.1-dev.1793881345",
3
+ "version": "5.13.1-dev.1793963532",
4
4
  "description": "Lyne Design System",
5
5
  "keywords": [
6
6
  "design system",
7
7
  "web components",
8
8
  "lit",
9
- "https://github.com/sbb-design-systems/lyne-components/commit/4440f91f90335e1220faa94d8fb63d3613e9c157"
9
+ "https://github.com/sbb-design-systems/lyne-components/commit/3f42ae528cb65dd753cb7b7662ec2e15e21411a7"
10
10
  ],
11
11
  "type": "module",
12
12
  "exports": {
package/safety-theme.css CHANGED
@@ -1957,11 +1957,26 @@ summary {
1957
1957
  --sbb-table-sticky-shadow-width: 3rem;
1958
1958
  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
1959
1959
  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
1960
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
1961
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
1962
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
1963
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
1964
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
1960
+ --sbb-table-data-cell-font-size-xs: var(--sbb-text-font-size-xs);
1961
+ --sbb-table-data-cell-font-size-s: var(--sbb-text-font-size-xs);
1962
+ --sbb-table-data-cell-font-size-m: var(--sbb-text-font-size-s);
1963
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
1964
+ --sbb-table-header-padding-block-xs: 0;
1965
+ --sbb-table-header-padding-block-s: var(--sbb-spacing-fixed-1x);
1966
+ --sbb-table-header-padding-block-m: var(--sbb-spacing-fixed-3x);
1967
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
1968
+ --sbb-table-header-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1969
+ --sbb-table-header-padding-inline-s: var(--sbb-spacing-fixed-2x);
1970
+ --sbb-table-header-padding-inline-m: var(--sbb-spacing-fixed-4x);
1971
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
1972
+ --sbb-table-cell-padding-block-xs: 0;
1973
+ --sbb-table-cell-padding-block-s: var(--sbb-spacing-fixed-1x);
1974
+ --sbb-table-cell-padding-block-m: var(--sbb-spacing-responsive-xxxs);
1975
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
1976
+ --sbb-table-cell-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1977
+ --sbb-table-cell-padding-inline-s: var(--sbb-spacing-fixed-2x);
1978
+ --sbb-table-cell-padding-inline-m: var(--sbb-spacing-fixed-4x);
1979
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
1965
1980
  --sbb-table-sort-header-animation-easing: cubic-bezier(0.4, 0, 0.2, 1);
1966
1981
  --sbb-table-sort-header-color: var(--sbb-color-2);
1967
1982
  --sbb-table-sort-header-hover-color: var(--sbb-color-primary125);
@@ -1969,6 +1984,14 @@ summary {
1969
1984
  var(--sbb-color-primary125),
1970
1985
  var(--sbb-color-primary85)
1971
1986
  );
1987
+ --sbb-table-body-row-height-xs: 1.375rem;
1988
+ --sbb-table-body-row-height-s: 1.875rem;
1989
+ --sbb-table-body-row-height-m: 3.09375rem;
1990
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
1991
+ --sbb-table-header-row-height-xs: 1.375rem;
1992
+ --sbb-table-header-row-height-s: 1.875rem;
1993
+ --sbb-table-header-row-height-m: 2.875rem;
1994
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
1972
1995
  --sbb-tab-group-content-gap-size-s: var(--sbb-spacing-responsive-xs);
1973
1996
  --sbb-tab-group-content-gap-size-l: var(--sbb-spacing-responsive-s);
1974
1997
  --sbb-tab-group-content-gap-size-xl: var(--sbb-spacing-responsive-m);
@@ -3487,6 +3510,12 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3487
3510
  table-layout: auto;
3488
3511
  text-align: left;
3489
3512
  }
3513
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) thead tr {
3514
+ height: var(--sbb-table-header-row-height);
3515
+ }
3516
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) tbody tr {
3517
+ height: var(--sbb-table-body-row-height);
3518
+ }
3490
3519
  :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
3491
3520
  font-size: var(--sbb-table-header-cell-font-size);
3492
3521
  letter-spacing: var(--sbb-letter-spacing-text);
@@ -3534,27 +3563,33 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3534
3563
  }
3535
3564
 
3536
3565
  .sbb-table-xs {
3537
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3538
- --sbb-table-header-padding-block: 0;
3539
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
3540
- --sbb-table-cell-padding-block: 0;
3541
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
3566
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-xs);
3567
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-xs);
3568
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-xs);
3569
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-xs);
3570
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-xs);
3571
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-xs);
3572
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-xs);
3542
3573
  }
3543
3574
 
3544
3575
  .sbb-table-s {
3545
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3546
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
3547
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
3548
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
3549
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
3576
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
3577
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
3578
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
3579
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
3580
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
3581
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
3582
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
3550
3583
  }
3551
3584
 
3552
3585
  .sbb-table-m {
3553
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
3554
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
3555
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
3556
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
3557
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
3586
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
3587
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
3588
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
3589
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
3590
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
3591
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
3592
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
3558
3593
  }
3559
3594
 
3560
3595
  sbb-table-wrapper[negative] .sbb-table,
package/standard-theme.css CHANGED
@@ -1957,11 +1957,26 @@ summary {
1957
1957
  --sbb-table-sticky-shadow-width: 3rem;
1958
1958
  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
1959
1959
  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
1960
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
1961
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
1962
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
1963
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
1964
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
1960
+ --sbb-table-data-cell-font-size-xs: var(--sbb-text-font-size-xs);
1961
+ --sbb-table-data-cell-font-size-s: var(--sbb-text-font-size-xs);
1962
+ --sbb-table-data-cell-font-size-m: var(--sbb-text-font-size-s);
1963
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
1964
+ --sbb-table-header-padding-block-xs: 0;
1965
+ --sbb-table-header-padding-block-s: var(--sbb-spacing-fixed-1x);
1966
+ --sbb-table-header-padding-block-m: var(--sbb-spacing-fixed-3x);
1967
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
1968
+ --sbb-table-header-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1969
+ --sbb-table-header-padding-inline-s: var(--sbb-spacing-fixed-2x);
1970
+ --sbb-table-header-padding-inline-m: var(--sbb-spacing-fixed-4x);
1971
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
1972
+ --sbb-table-cell-padding-block-xs: 0;
1973
+ --sbb-table-cell-padding-block-s: var(--sbb-spacing-fixed-1x);
1974
+ --sbb-table-cell-padding-block-m: var(--sbb-spacing-responsive-xxxs);
1975
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
1976
+ --sbb-table-cell-padding-inline-xs: var(--sbb-spacing-fixed-1x);
1977
+ --sbb-table-cell-padding-inline-s: var(--sbb-spacing-fixed-2x);
1978
+ --sbb-table-cell-padding-inline-m: var(--sbb-spacing-fixed-4x);
1979
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
1965
1980
  --sbb-table-sort-header-animation-easing: cubic-bezier(0.4, 0, 0.2, 1);
1966
1981
  --sbb-table-sort-header-color: var(--sbb-color-2);
1967
1982
  --sbb-table-sort-header-hover-color: var(--sbb-color-primary125);
@@ -1969,6 +1984,14 @@ summary {
1969
1984
  var(--sbb-color-primary125),
1970
1985
  var(--sbb-color-primary85)
1971
1986
  );
1987
+ --sbb-table-body-row-height-xs: 1.375rem;
1988
+ --sbb-table-body-row-height-s: 1.875rem;
1989
+ --sbb-table-body-row-height-m: 3.09375rem;
1990
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
1991
+ --sbb-table-header-row-height-xs: 1.375rem;
1992
+ --sbb-table-header-row-height-s: 1.875rem;
1993
+ --sbb-table-header-row-height-m: 2.875rem;
1994
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
1972
1995
  --sbb-tab-group-content-gap-size-s: var(--sbb-spacing-responsive-xs);
1973
1996
  --sbb-tab-group-content-gap-size-l: var(--sbb-spacing-responsive-s);
1974
1997
  --sbb-tab-group-content-gap-size-xl: var(--sbb-spacing-responsive-m);
@@ -3487,6 +3510,12 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3487
3510
  table-layout: auto;
3488
3511
  text-align: left;
3489
3512
  }
3513
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) thead tr {
3514
+ height: var(--sbb-table-header-row-height);
3515
+ }
3516
+ :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) tbody tr {
3517
+ height: var(--sbb-table-body-row-height);
3518
+ }
3490
3519
  :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
3491
3520
  font-size: var(--sbb-table-header-cell-font-size);
3492
3521
  letter-spacing: var(--sbb-letter-spacing-text);
@@ -3534,27 +3563,33 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
3534
3563
  }
3535
3564
 
3536
3565
  .sbb-table-xs {
3537
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3538
- --sbb-table-header-padding-block: 0;
3539
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
3540
- --sbb-table-cell-padding-block: 0;
3541
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
3566
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-xs);
3567
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-xs);
3568
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-xs);
3569
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-xs);
3570
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-xs);
3571
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-xs);
3572
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-xs);
3542
3573
  }
3543
3574
 
3544
3575
  .sbb-table-s {
3545
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
3546
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
3547
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
3548
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
3549
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
3576
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
3577
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
3578
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
3579
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
3580
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
3581
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
3582
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
3550
3583
  }
3551
3584
 
3552
3585
  .sbb-table-m {
3553
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
3554
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
3555
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
3556
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
3557
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
3586
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
3587
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
3588
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
3589
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
3590
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
3591
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
3592
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
3558
3593
  }
3559
3594
 
3560
3595
  sbb-table-wrapper[negative] .sbb-table,
package/table/_table.global.scss CHANGED
@@ -21,38 +21,53 @@ $theme: 'standard' !default;
21
21
  --sbb-table-sticky-shadow-width: 3rem;
22
22
  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
23
23
  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
24
+ --sbb-table-data-cell-font-size-xs: var(--sbb-text-font-size-xs);
25
+ --sbb-table-data-cell-font-size-s: var(--sbb-text-font-size-xs);
26
+ --sbb-table-data-cell-font-size-m: var(--sbb-text-font-size-s);
24
27
  --sbb-table-data-cell-font-size: #{sbb.theme-pattern-select(
25
28
  (
26
- 'standard': var(--sbb-text-font-size-s),
27
- 'lean': var(--sbb-text-font-size-xs),
29
+ 'standard': var(--sbb-table-data-cell-font-size-m),
30
+ 'lean': var(--sbb-table-data-cell-font-size-s),
28
31
  ),
29
32
  $theme
30
33
  )};
34
+ --sbb-table-header-padding-block-xs: 0;
35
+ --sbb-table-header-padding-block-s: var(--sbb-spacing-fixed-1x);
36
+ --sbb-table-header-padding-block-m: var(--sbb-spacing-fixed-3x);
31
37
  --sbb-table-header-padding-block: #{sbb.theme-pattern-select(
32
38
  (
33
- 'standard': var(--sbb-spacing-fixed-3x),
34
- 'lean': var(--sbb-spacing-fixed-1x),
39
+ 'standard': var(--sbb-table-header-padding-block-m),
40
+ 'lean': var(--sbb-table-header-padding-block-s),
35
41
  ),
36
42
  $theme
37
43
  )};
44
+ --sbb-table-header-padding-inline-xs: var(--sbb-spacing-fixed-1x);
45
+ --sbb-table-header-padding-inline-s: var(--sbb-spacing-fixed-2x);
46
+ --sbb-table-header-padding-inline-m: var(--sbb-spacing-fixed-4x);
38
47
  --sbb-table-header-padding-inline: #{sbb.theme-pattern-select(
39
48
  (
40
- 'standard': var(--sbb-spacing-fixed-4x),
41
- 'lean': var(--sbb-spacing-fixed-2x),
49
+ 'standard': var(--sbb-table-header-padding-inline-m),
50
+ 'lean': var(--sbb-table-header-padding-inline-s),
42
51
  ),
43
52
  $theme
44
53
  )};
54
+ --sbb-table-cell-padding-block-xs: 0;
55
+ --sbb-table-cell-padding-block-s: var(--sbb-spacing-fixed-1x);
56
+ --sbb-table-cell-padding-block-m: var(--sbb-spacing-responsive-xxxs);
45
57
  --sbb-table-cell-padding-block: #{sbb.theme-pattern-select(
46
58
  (
47
- 'standard': var(--sbb-spacing-responsive-xxxs),
48
- 'lean': var(--sbb-spacing-fixed-1x),
59
+ 'standard': var(--sbb-table-cell-padding-block-m),
60
+ 'lean': var(--sbb-table-cell-padding-block-s),
49
61
  ),
50
62
  $theme
51
63
  )};
64
+ --sbb-table-cell-padding-inline-xs: var(--sbb-spacing-fixed-1x);
65
+ --sbb-table-cell-padding-inline-s: var(--sbb-spacing-fixed-2x);
66
+ --sbb-table-cell-padding-inline-m: var(--sbb-spacing-fixed-4x);
52
67
  --sbb-table-cell-padding-inline: #{sbb.theme-pattern-select(
53
68
  (
54
- 'standard': var(--sbb-spacing-fixed-4x),
55
- 'lean': var(--sbb-spacing-fixed-2x),
69
+ 'standard': var(--sbb-table-cell-padding-inline-m),
70
+ 'lean': var(--sbb-table-cell-padding-inline-s),
56
71
  ),
57
72
  $theme
58
73
  )};
@@ -62,6 +77,26 @@ $theme: 'standard' !default;
62
77
  var(--sbb-color-primary125),
63
78
  var(--sbb-color-primary85)
64
79
  );
80
+ --sbb-table-body-row-height-xs: #{sbb.px-to-rem-build(22)};
81
+ --sbb-table-body-row-height-s: #{sbb.px-to-rem-build(30)};
82
+ --sbb-table-body-row-height-m: #{sbb.px-to-rem-build(49.5)};
83
+ --sbb-table-body-row-height: #{sbb.theme-pattern-select(
84
+ (
85
+ 'standard': var(--sbb-table-body-row-height-m),
86
+ 'lean': var(--sbb-table-body-row-height-s),
87
+ ),
88
+ $theme
89
+ )};
90
+ --sbb-table-header-row-height-xs: #{sbb.px-to-rem-build(22)};
91
+ --sbb-table-header-row-height-s: #{sbb.px-to-rem-build(30)};
92
+ --sbb-table-header-row-height-m: #{sbb.px-to-rem-build(46)};
93
+ --sbb-table-header-row-height: #{sbb.theme-pattern-select(
94
+ (
95
+ 'standard': var(--sbb-table-header-row-height-m),
96
+ 'lean': var(--sbb-table-header-row-height-s),
97
+ ),
98
+ $theme
99
+ )};
65
100
  }
66
101
 
67
102
  @mixin rules {
@@ -85,6 +120,14 @@ $theme: 'standard' !default;
85
120
  table-layout: auto;
86
121
  text-align: left;
87
122
 
123
+ thead tr {
124
+ height: var(--sbb-table-header-row-height);
125
+ }
126
+
127
+ tbody tr {
128
+ height: var(--sbb-table-body-row-height);
129
+ }
130
+
88
131
  th {
89
132
  font-size: var(--sbb-table-header-cell-font-size);
90
133
  letter-spacing: var(--sbb-letter-spacing-text);
@@ -149,27 +192,33 @@ $theme: 'standard' !default;
149
192
  }
150
193
 
151
194
  .sbb-table-xs {
152
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
153
- --sbb-table-header-padding-block: 0;
154
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
155
- --sbb-table-cell-padding-block: 0;
156
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
195
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-xs);
196
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-xs);
197
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-xs);
198
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-xs);
199
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-xs);
200
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-xs);
201
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-xs);
157
202
  }
158
203
 
159
204
  .sbb-table-s {
160
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
161
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
162
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
163
- --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
164
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
205
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-s);
206
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-s);
207
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-s);
208
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-s);
209
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-s);
210
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-s);
211
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-s);
165
212
  }
166
213
 
167
214
  .sbb-table-m {
168
- --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
169
- --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
170
- --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
171
- --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
172
- --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
215
+ --sbb-table-data-cell-font-size: var(--sbb-table-data-cell-font-size-m);
216
+ --sbb-table-header-padding-block: var(--sbb-table-header-padding-block-m);
217
+ --sbb-table-header-padding-inline: var(--sbb-table-header-padding-inline-m);
218
+ --sbb-table-cell-padding-block: var(--sbb-table-cell-padding-block-m);
219
+ --sbb-table-cell-padding-inline: var(--sbb-table-cell-padding-inline-m);
220
+ --sbb-table-header-row-height: var(--sbb-table-header-row-height-m);
221
+ --sbb-table-body-row-height: var(--sbb-table-body-row-height-m);
173
222
  }
174
223
 
175
224
  sbb-table-wrapper[negative] .sbb-table,