gitea_admin/erp_naurua
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sync styleguide 2026.05.18.1

Browse Source
This commit is contained in:
Mathias Gläser
2026-06-24 10:50:03 +02:00
parent 4c7e0abdb8
commit 6ccfdb0fb5
8 changed files with 76 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/styleguide/components/public-page-components.html
+15
View File
@@ -50,6 +50,21 @@
</article>
</div>
</section>
<section id="component-picture-full-width">
<p class="sg-preview-label">Component: Picture Full Width</p>
<div class="sg-preview-area">
<img
class="sg-picture-full-width"
data-component="picture-full-width"
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjkwMCIgdmlld0JveD0iMCAwIDE2MDAgOTAwIj48cmVjdCB3aWR0aD0iMTYwMCIgaGVpZ2h0PSI5MDAiIGZpbGw9IiMyZjM0NDAiLz48cmVjdCB4PSI2NCIgeT0iNjQiIHdpZHRoPSIxNDcyIiBoZWlnaHQ9Ijc3MiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZjNmNGY2IiBzdHJva2Utd2lkdGg9IjQiIHN0cm9rZS1kYXNoYXJyYXk9IjI0IDE2IiBvcGFjaXR5PSIwLjU1Ii8+PHRleHQgeD0iODAwIiB5PSI0NTAiIGZpbGw9IiNmM2Y0ZjYiIGZvbnQtZmFtaWx5PSJBcmlhbCwgSGVsdmV0aWNhLCBzYW5zLXNlcmlmIiBmb250LXNpemU9IjUyIiB0ZXh0LWFuY2hvcj0ibWlkZGxlIj5QaWN0dXJlIGZ1bGwgd2lkdGg8L3RleHQ+PC9zdmc+"
alt="Platzhalterbild für die Picture Full Width Component"
width="1600"
height="900"
>
</div>
</section>
</div>
</body>
docs/styleguide/patterns/public-page-patterns.html
+23 -8
View File
@@ -58,11 +58,11 @@
<p class="sg-preview-label">pattern: CTA box right</p>
<div class="sg-preview-area">
<div class="sg-content-group-box" data-component="content-group-box">
<article class="sg-card sg-card--content-card sg-card--content-card-dark sg-card--call-to-action-card sg-call-to-action-card--align-right" data-component="call-to-action-card" aria-label="Call to action Card">
<div class="sg-card-segment sg-card-segment--body sg-call-to-action-card__body" data-component-part="card-body">
<p class="sg-body sg-call-to-action-card__text">
<div class="sg-preview-area">
<div class="sg-content-group-box" data-component="content-group-box">
<article class="sg-card sg-card--content-card sg-card--content-card-dark sg-card--call-to-action-card sg-call-to-action-card--align-right" data-component="call-to-action-card" aria-label="Call to action Card">
<div class="sg-card-segment sg-card-segment--body sg-call-to-action-card__body" data-component-part="card-body">
<p class="sg-body sg-call-to-action-card__text">
Jetzt passende Inhalte entdecken und direkt mit dem nächsten Schritt starten.
</p>
@@ -72,10 +72,25 @@
</button>
</div>
</div>
</article>
</div>
</article>
</div>
</section>
</div>
<p class="sg-preview-label">pattern: picture full width</p>
<div class="sg-preview-area">
<div class="sg-content-group-box" data-component="content-group-box">
<img
class="sg-picture-full-width"
data-component="picture-full-width"
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjkwMCIgdmlld0JveD0iMCAwIDE2MDAgOTAwIj48cmVjdCB3aWR0aD0iMTYwMCIgaGVpZ2h0PSI5MDAiIGZpbGw9IiMyZjM0NDAiLz48cmVjdCB4PSI2NCIgeT0iNjQiIHdpZHRoPSIxNDcyIiBoZWlnaHQ9Ijc3MiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZjNmNGY2IiBzdHJva2Utd2lkdGg9IjQiIHN0cm9rZS1kYXNoYXJyYXk9IjI0IDE2IiBvcGFjaXR5PSIwLjU1Ii8+PHRleHQgeD0iODAwIiB5PSI0NTAiIGZpbGw9IiNmM2Y0ZjYiIGZvbnQtZmFtaWx5PSJBcmlhbCwgSGVsdmV0aWNhLCBzYW5zLXNlcmlmIiBmb250LXNpemU9IjUyIiB0ZXh0LWFuY2hvcj0ibWlkZGxlIj5QaWN0dXJlIGZ1bGwgd2lkdGg8L3RleHQ+PC9zdmc+"
alt="Platzhalterbild für die Picture Full Width Component"
width="1600"
height="900"
>
</div>
</div>
</section>
</div>
</body>
docs/styleguide/semantic-tokens-components.html
+3
View File
@@ -119,6 +119,9 @@
<tr><td>layout-call-to-action-card-content-gap</td><td>spacing-large</td><td>Abstand zwischen Text und Button.</td></tr>
</tbody>
</table>
<h3 class="sg-sub-heading sg-section-h3">Picture Full Width</h3>
<p class="sg-table-label">Keine zusätzlichen semantischen Tokens erforderlich. Die Komponente ist strukturell und bezieht sich mit <code>width: 100%</code> auf den umgebenden Container, mit <code>height: auto</code> und <code>display: block</code> für das Bild-Element.</p>
</section>
<section id="semantic-interactive">
docs/styleguide/styles/44-components-public-page-components.css
+11
View File
@@ -67,6 +67,17 @@
justify-content: flex-end;
}
.sg-call-to-action-card--align-right {
margin-left: auto;
}
.sg-picture-full-width {
display: block;
width: 100%;
max-width: 100%;
height: auto;
}
.sg-page-public-page-components .sg-preview-area {
display: flex;
flex-direction: column;
docs/styleguide/styles/45-patterns-public-page-patterns.css
-4
View File
@@ -11,7 +11,3 @@
.sg-page-public-page-patterns .sg-text-block--align-right {
margin-left: auto;
}
.sg-call-to-action-card--align-right {
margin-left: auto;
}
public/assets/styleguide.upstream.css
+11 -4
View File
@@ -4577,6 +4577,17 @@ main {
justify-content: flex-end;
}
.sg-call-to-action-card--align-right {
margin-left: auto;
}
.sg-picture-full-width {
display: block;
width: 100%;
max-width: 100%;
height: auto;
}
.sg-page-public-page-components .sg-preview-area {
display: flex;
flex-direction: column;
@@ -4604,7 +4615,3 @@ main {
margin-left: auto;
}
.sg-call-to-action-card--align-right {
margin-left: auto;
}
public/assets/styleguide.upstream.meta.json
+2 -2
View File
@@ -1,7 +1,7 @@
{
"styleguideVersion": "2026.05.18.1",
"styleguideCommit": "8a3688c",
"syncedAtUtc": "2026-06-24T08:39:48Z",
"styleguideCommit": "749b787",
"syncedAtUtc": "2026-06-24T08:50:03Z",
"sourceRepo": "/Users/mathias/Documents/Dokumente Chouchou/Codebases/Styleguide",
"mirroredDocsPath": "docs/styleguide"
}
public/assets/styles.css
+11 -4
View File
@@ -4577,6 +4577,17 @@ main {
justify-content: flex-end;
}
.sg-call-to-action-card--align-right {
margin-left: auto;
}
.sg-picture-full-width {
display: block;
width: 100%;
max-width: 100%;
height: auto;
}
.sg-page-public-page-components .sg-preview-area {
display: flex;
flex-direction: column;
@@ -4604,7 +4615,3 @@ main {
margin-left: auto;
}
.sg-call-to-action-card--align-right {
margin-left: auto;
}