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

Add multisegment card component example

Browse Source
This commit is contained in:
Mathias Gläser
2026-05-18 19:40:04 +02:00
parent ecc982a2b3
commit e70ac7dbe8
2 changed files with 39 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/cards.html
+31
View File
@@ -117,6 +117,37 @@
</div>
</section>
<!-- Component: Multisegment Card -->
<section id="component-multisegment-card">
<p class="sg-preview-label">Component: Multisegment Card</p>
<div class="sg-preview-area">
<article class="sg-card" data-component="multisegment-card">
<div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header">
<div class="sg-strong">Multisegment Card</div>
</div>
<div class="sg-card-segment sg-card-segment--gray" data-component-part="card-segment">
<p class="sg-body">Erstes graues Segment mit Textinhalt.</p>
</div>
<div class="sg-card-segment sg-card-segment--gray" data-component-part="card-segment">
<p class="sg-body">Zweites graues Segment mit Textinhalt.</p>
</div>
<div class="sg-card-segment sg-card-segment--white" data-component-part="card-segment">
<p class="sg-body">Erstes weißes Segment.</p>
</div>
<div class="sg-card-segment sg-card-segment--white" data-component-part="card-segment">
<p class="sg-body">Zweites weißes Segment.</p>
</div>
</article>
</div>
</section>
<!-- Component: Transparent Card -->
<section id="component-transparent-card">
<p class="sg-preview-label">Component: Transparent Card</p>