Add VSF drawer object card with two-column white detail text

This commit is contained in:
2026-05-21 11:35:23 +02:00
parent 6d91fccff1
commit c4e14396fc
3 changed files with 53 additions and 28 deletions
+26
View File
@@ -180,6 +180,11 @@
--text-content-block-card-content: var(--color-font-dark);
--text-card-list-drawer: var(--color-font-dark);
--layout-card-list-drawer-width: var(--dimension-card-list-drawer-width);
--surface-vsf-drawer-object-card-header: var(--color-darkblue);
--surface-vsf-drawer-object-card-body: var(--color-darkblue);
--text-vsf-drawer-object-card-heading: var(--color-font-light);
--text-vsf-drawer-object-card-body: var(--color-font-light);
--layout-vsf-drawer-object-card-column-gap: var(--spacing-large);
/* Typography */
--font-family-base: "Open Sans", sans-serif;
@@ -2080,6 +2085,27 @@ section + section {
width: 100%;
}
.sg-vsf-drawer-object-card {
--surface-card-header-primary: var(--surface-vsf-drawer-object-card-header);
--surface-object-card-lower-segment: var(--surface-vsf-drawer-object-card-body);
--text-card-header: var(--text-vsf-drawer-object-card-heading);
--text-card-body: var(--text-vsf-drawer-object-card-body);
}
.sg-vsf-drawer-object-card .sg-card-segment--body.sg-object-card__content {
color: var(--text-vsf-drawer-object-card-body);
}
.sg-vsf-drawer-object-card__text.sg-text-layout-pattern__sample--two-column {
color: var(--text-vsf-drawer-object-card-body);
column-gap: var(--layout-vsf-drawer-object-card-column-gap);
}
.sg-vsf-drawer-object-card__heading {
color: var(--text-vsf-drawer-object-card-heading);
margin: 0;
}
/* ========================================================= */
/* Patterns: Text Layouts */
/* ========================================================= */