Sync styleguide 2026.05.18.1

This commit is contained in:
2026-06-24 12:11:55 +02:00
parent 7391685617
commit 311ff21a34
9 changed files with 151 additions and 59 deletions
+22 -8
View File
@@ -193,6 +193,7 @@
--surface-navigation-card-body: var(--color-white);
--surface-content-block-card-title: var(--color-light-grey);
--surface-content-block-card-content: var(--color-white);
--radius-picture-full-width: var(--radius-card);
--layout-content-cards-group-gap: var(--spacing-small);
--surface-card-list-drawer: var(--color-background-purple);
--text-content-block-card-title: var(--color-font-dark);
@@ -3643,20 +3644,21 @@ main {
/* Patterns: Text Layouts */
/* ========================================================= */
.sg-page-text-layouts {
background: var(--surface-form-preview);
}
.sg-page-text-layouts .sg-main-heading,
.sg-page-text-layouts .sg-preview-label {
color: inherit;
}
.sg-text-layout-pattern {
display: flex;
flex-direction: column;
gap: var(--spacing-small);
}
.sg-text-layout-pattern__preview-surface {
width: 100%;
box-sizing: border-box;
padding: var(--spacing-large);
border-radius: var(--radius-card);
background: var(--surface-text-layout-preview);
}
.sg-text-layout-pattern__sample {
margin: 0;
}
@@ -3681,6 +3683,11 @@ main {
column-gap: var(--layout-text-layout-column-gap);
}
.sg-text-layout-pattern__two-column--stacked-mobile {
width: 100%;
min-width: 0;
}
.sg-text-layout-pattern__three-column-distributed {
width: 100%;
min-width: 0;
@@ -3714,9 +3721,15 @@ main {
.sg-text-layout-pattern__sample--sixty-width,
.sg-text-layout-pattern__sample--two-column,
.sg-text-layout-pattern__two-column,
.sg-text-layout-pattern__two-column--stacked-mobile,
.sg-text-layout-pattern__three-column-distributed {
width: 100%;
}
.sg-text-layout-pattern__two-column--stacked-mobile {
grid-template-columns: 1fr;
row-gap: var(--layout-text-layout-column-gap);
}
}
/* ========================================================= */
@@ -4609,6 +4622,7 @@ main {
width: 100%;
max-width: 100%;
height: auto;
border-radius: var(--radius-picture-full-width);
}
.sg-page-public-page-components .sg-preview-area {
+2 -2
View File
@@ -1,7 +1,7 @@
{
"styleguideVersion": "2026.05.18.1",
"styleguideCommit": "c3c939f",
"syncedAtUtc": "2026-06-24T09:40:00Z",
"styleguideCommit": "733c9c0",
"syncedAtUtc": "2026-06-24T10:11:55Z",
"sourceRepo": "/Users/mathias/Documents/Dokumente Chouchou/Codebases/Styleguide",
"mirroredDocsPath": "docs/styleguide"
}
+22 -8
View File
@@ -193,6 +193,7 @@
--surface-navigation-card-body: var(--color-white);
--surface-content-block-card-title: var(--color-light-grey);
--surface-content-block-card-content: var(--color-white);
--radius-picture-full-width: var(--radius-card);
--layout-content-cards-group-gap: var(--spacing-small);
--surface-card-list-drawer: var(--color-background-purple);
--text-content-block-card-title: var(--color-font-dark);
@@ -3643,20 +3644,21 @@ main {
/* Patterns: Text Layouts */
/* ========================================================= */
.sg-page-text-layouts {
background: var(--surface-form-preview);
}
.sg-page-text-layouts .sg-main-heading,
.sg-page-text-layouts .sg-preview-label {
color: inherit;
}
.sg-text-layout-pattern {
display: flex;
flex-direction: column;
gap: var(--spacing-small);
}
.sg-text-layout-pattern__preview-surface {
width: 100%;
box-sizing: border-box;
padding: var(--spacing-large);
border-radius: var(--radius-card);
background: var(--surface-text-layout-preview);
}
.sg-text-layout-pattern__sample {
margin: 0;
}
@@ -3681,6 +3683,11 @@ main {
column-gap: var(--layout-text-layout-column-gap);
}
.sg-text-layout-pattern__two-column--stacked-mobile {
width: 100%;
min-width: 0;
}
.sg-text-layout-pattern__three-column-distributed {
width: 100%;
min-width: 0;
@@ -3714,9 +3721,15 @@ main {
.sg-text-layout-pattern__sample--sixty-width,
.sg-text-layout-pattern__sample--two-column,
.sg-text-layout-pattern__two-column,
.sg-text-layout-pattern__two-column--stacked-mobile,
.sg-text-layout-pattern__three-column-distributed {
width: 100%;
}
.sg-text-layout-pattern__two-column--stacked-mobile {
grid-template-columns: 1fr;
row-gap: var(--layout-text-layout-column-gap);
}
}
/* ========================================================= */
@@ -4609,6 +4622,7 @@ main {
width: 100%;
max-width: 100%;
height: auto;
border-radius: var(--radius-picture-full-width);
}
.sg-page-public-page-components .sg-preview-area {