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

Add drawer card action segment and remove fixed height for VSF card

Browse Source
This commit is contained in:
Mathias Gläser
2026-05-21 11:44:46 +02:00
parent d650caf79c
commit fbc4291da4
2 changed files with 12 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
patterns/vsf-card-listen-seite.html
+6 -3
View File
@@ -683,11 +683,11 @@
</div> </div>
</div> </div>
<article class="sg-card sg-object-card sg-vsf-drawer-object-card" data-pattern="object-card" aria-label="Objekt Card Western Digital Corporation"> <article class="sg-card sg-object-card sg-vsf-drawer-object-card" data-component="card" data-pattern="card" aria-label="Card Western Digital Corporation">
<header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header" data-pattern-part="object-card-header"> <header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header" data-pattern-part="card-header">
<h2 class="sg-heading-h2 sg-vsf-drawer-object-card__heading">Western Digital Corporation</h2> <h2 class="sg-heading-h2 sg-vsf-drawer-object-card__heading">Western Digital Corporation</h2>
</header> </header>
<div class="sg-card-segment sg-card-segment--body sg-object-card__content" data-pattern-part="object-card-content"> <div class="sg-card-segment sg-card-segment--body sg-object-card__content" data-pattern-part="card-body">
<div class="sg-text-layout-pattern__sample sg-text-layout-pattern__two-column" data-pattern-part="text-block-two-column"> <div class="sg-text-layout-pattern__sample sg-text-layout-pattern__two-column" data-pattern-part="text-block-two-column">
<p class="sg-body sg-text-layout-pattern__column"> <p class="sg-body sg-text-layout-pattern__column">
Ticker: WDC<br> Ticker: WDC<br>
@@ -701,6 +701,9 @@
</p> </p>
</div> </div>
</div> </div>
<footer class="sg-card-segment sg-card-segment--body sg-object-card__actions-segment" data-pattern-part="card-actions">
<button class="sg-interaction-element sg-button" type="button">Geschäftsmodell</button>
</footer>
</article> </article>
<div class="sg-navigation-card-layout"> <div class="sg-navigation-card-layout">
styleguide.css
+6
View File
@@ -2094,6 +2094,7 @@ section + section {
min-width: 0; min-width: 0;
max-width: none; max-width: none;
flex: 0 0 100%; flex: 0 0 100%;
height: auto;
} }
.sg-vsf-drawer-object-card .sg-card-segment--body.sg-object-card__content { .sg-vsf-drawer-object-card .sg-card-segment--body.sg-object-card__content {
@@ -2109,6 +2110,11 @@ section + section {
gap: var(--layout-vsf-drawer-object-card-column-gap); gap: var(--layout-vsf-drawer-object-card-column-gap);
} }
.sg-vsf-drawer-object-card .sg-card-segment--body.sg-object-card__actions-segment {
display: flex;
justify-content: flex-start;
}
.sg-vsf-drawer-object-card__heading { .sg-vsf-drawer-object-card__heading {
color: var(--text-vsf-drawer-object-card-heading); color: var(--text-vsf-drawer-object-card-heading);
margin: 0; margin: 0;