Add content basic object card variant

This commit is contained in:
2026-06-18 10:04:11 +02:00
parent bb824cb540
commit 94a1ac9b33
5 changed files with 44 additions and 0 deletions
+14
View File
@@ -104,6 +104,20 @@
</article>
</div>
<h2 class="sg-sub-heading sg-section-h2">Object Card Content Basic</h2>
<p class="sg-preview-label">Pattern: Object Card Content Basic</p>
<p class="sg-body">Hinweis: Diese Variante ist für spezifische Inhalte gedacht, die eine Nutzerinteraktion erfordern, zum Beispiel Zustimmungen oder Freigaben. Im Styleguide wird hier nur das Card-Layout gezeigt.</p>
<article class="sg-card sg-object-card sg-object-card--content-basic sg-object-card-content-basic" data-pattern="object-card-content-basic" aria-label="Objekt Card Content Basic">
<header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header" data-pattern-part="object-card-content-basic-header">
<div class="sg-strong">Zustimmung zu Geschäftsbedingungen</div>
</header>
<div class="sg-card-segment sg-card-segment--body sg-object-card__content" data-pattern-part="object-card-content-basic-content">
<p class="sg-body">Bevor Sie fortfahren, prüfen Sie bitte die Inhalte der Geschäftsbedingungen und bestätigen Sie die Zustimmung im Zielsystem.</p>
<p class="sg-body">Die Karte ist bewusst kompakt gehalten und für lesbare, interaktionspflichtige Inhalte auf Desktop mittig ausgerichtet.</p>
</div>
</article>
<h2 class="sg-sub-heading sg-section-h2">Object Card variable height</h2>
<p class="sg-preview-label">Pattern: Object Card variable height</p>
<p class="sg-body">Hinweis: In dieser Variante ist die komplette Karte in der Höhe flexibel. Die Segmenthöhen ergeben sich direkt aus dem Inhalt, dadurch sind die Karten im Grid bewusst unterschiedlich hoch.</p>