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

Move drawer controls from options row into single gray card segment

Browse Source
This commit is contained in:
Mathias Gläser
2026-05-21 17:20:17 +02:00
parent 5f00eb01f0
commit 49f283aba8
2 changed files with 16 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
patterns/vsf-card-listen-fundamentalanalyse-drawer.html
+4 -6
View File
@@ -57,17 +57,15 @@
<button id="vsf-business-model-toggle" class="sg-interaction-element sg-button" type="button" aria-controls="vsf-business-model-text" aria-expanded="false">Geschäftsmodell anzeigen</button>
</footer>
</article>
<div class="sg-options-row" aria-label="Fundamentalanalyse Optionen" data-pattern="options-row">
<div class="sg-options-row__left" data-pattern-part="options-row-primary-actions">
<button class="sg-mode-toggle" type="button" data-active="relative" aria-label="Modus Schieber global: relativ aktiv" data-component="mode-toggle" data-component-context="options-row">
<article class="sg-card sg-card--content-card sg-vsf-drawer-controls-card" data-component="content-card" aria-label="Fundamentalanalyse Steuerung">
<div class="sg-card-segment sg-card-segment--body sg-card-segment--gray sg-vsf-drawer-controls-row" data-component-part="card-body">
<button class="sg-mode-toggle" type="button" data-active="relative" aria-label="Modus Schieber global: relativ aktiv" data-component="mode-toggle" data-component-context="drawer-controls">
<span class="sg-mode-toggle__label" data-component-part="toggle-label">absolut</span>
<span class="sg-mode-toggle__switch" aria-hidden="true" data-component-part="toggle-track">
<span class="sg-mode-toggle__handle" data-component-part="toggle-handle"></span>
</span>
<span class="sg-mode-toggle__label" data-component-part="toggle-label">relativ</span>
</button>
</div>
<div class="sg-options-row__right" data-pattern-part="options-row-secondary-actions">
<div class="sg-sandwich-menu-wrap" data-open="false" data-component="sandwich-menu" data-component-size="small">
<button class="sg-interaction-element sg-sandwich-button sg-sandwich-button--small" type="button" aria-expanded="false" aria-label="Objekt-Menü öffnen" data-component-part="sandwich-trigger">
<span class="sg-sandwich-button__icon" aria-hidden="true">
@@ -83,7 +81,7 @@
</div>
</div>
</div>
</div>
</article>
<div class="sg-transparent-card sg-vsf-fundamental-analysis-intro" data-component="transparent-card">
<h2 class="sg-heading-h2 sg-vsf-fundamental-analysis-heading">Fundamentalanalyse vom 12.5.2026</h2>
<p class="sg-body sg-text-layout-pattern__sample sg-text-layout-pattern__sample--full-width" data-pattern-part="text-block-full-width">
styleguide.css
+12
View File
@@ -2139,6 +2139,18 @@ section + section {
color: var(--text-portal-header-tab);
}
.sg-vsf-drawer-controls-card {
--surface-card-body: var(--surface-card-segment-neutral);
}
.sg-card-segment.sg-vsf-drawer-controls-row {
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: var(--spacing-small);
flex-wrap: nowrap;
}
.sg-vsf-drawer-object-card__heading {
color: var(--text-vsf-drawer-object-card-heading);
margin: 0;