Gesamtbewertung
+
surface-card color-light-grey Grundfläche der Card.
surface-card-body color-light-grey Fläche im Body-Segment der Card.
+ surface-card-segment-neutral color-light-grey Neutrale Segmentfläche für gezielte hellgraue Card-Segmente (z. B.
surface-card-header-primary color-darkblue Primärer Header-Hintergrund.
surface-card-header-alternative color-darkgreen Alternativer Header-Hintergrund.
surface-card-header-muted color-darkbrown Zweite alternative Header-Fläche.
diff --git a/styleguide.css b/styleguide.css
index 1d0de78..d9e0d14 100644
--- a/styleguide.css
+++ b/styleguide.css
@@ -26,6 +26,7 @@
/* Semantic component tokens: Cards */
--surface-card: var(--color-light-grey);
--surface-card-body: var(--color-light-grey);
+ --surface-card-segment-neutral: var(--color-light-grey);
--surface-card-group: var(--color-background-purple-light);
--surface-card-transparent: var(--color-transparent);
--surface-card-header-primary: var(--color-darkblue);
@@ -2312,7 +2313,7 @@ section + section {
}
.sg-card-segment--gray {
- background: var(--surface-card-body);
+ background: var(--surface-card-segment-neutral);
}
.sg-card-segment--white {
@@ -2348,10 +2349,6 @@ section + section {
background: var(--surface-object-card-lower-segment);
}
-.sg-card-segment.sg-card-segment--body.sg-vsf-fundamental-score-segment {
- background: var(--surface-content-block-card-title);
-}
-
.sg-card-segment.sg-vsf-drawer-card__actions-segment {
flex-direction: column;
align-items: flex-start;
Score:
diff --git a/semantic-tokens-components.html b/semantic-tokens-components.html index ba94405..32799c2 100644 --- a/semantic-tokens-components.html +++ b/semantic-tokens-components.html @@ -19,6 +19,7 @@sg-card-segment--gray).