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

Remove preview area from public cards page

Browse Source
This commit is contained in:
Mathias Gläser
2026-06-23 17:27:51 +02:00
parent b74c3b9079
commit 6de7cb5807
2 changed files with 24 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/cards-public-page.html
+22 -24
View File
@@ -15,36 +15,34 @@
<section id="component-content-wrapper-card"> <section id="component-content-wrapper-card">
<p class="sg-preview-label">Component: Content Wrapper Card</p> <p class="sg-preview-label">Component: Content Wrapper Card</p>
<div class="sg-preview-area"> <div class="sg-transparent-card" data-component="transparent-card">
<div class="sg-transparent-card" data-component="transparent-card"> <p class="sg-body">
<p class="sg-body"> Content Wrapper Card als Transparent Card ohne horizontale Außenabstände und mit vertikalem Abstand gemäss spacing-large.
Content Wrapper Card als Transparent Card ohne horizontale Außenabstände und mit vertikalem Abstand gemäss spacing-large. </p>
</p>
<section id="component-cta-right"> <section id="component-cta-right">
<p class="sg-preview-label">Component: CTA Right</p> <p class="sg-preview-label">Component: CTA Right</p>
<article class="sg-card sg-card--content-card sg-card--content-card-dark sg-cards-public-page__cta-right-card" data-component="content-card" aria-label="CTA Right"> <article class="sg-card sg-card--content-card sg-card--content-card-dark sg-cards-public-page__cta-right-card" data-component="content-card" aria-label="CTA Right">
<div class="sg-card-segment sg-card-segment--body sg-cards-public-page__cta-right-body"> <div class="sg-card-segment sg-card-segment--body sg-cards-public-page__cta-right-body">
<div class="sg-cards-public-page__cta-right-grid"> <div class="sg-cards-public-page__cta-right-grid">
<div class="sg-cards-public-page__cta-right-copy"> <div class="sg-cards-public-page__cta-right-copy">
<p class="sg-body"> <p class="sg-body">
Ein Satz Text als CTA-Hinweis. Ein Satz Text als CTA-Hinweis.
</p> </p>
</div> </div>
<div class="sg-cards-public-page__cta-right-buttons" data-component="link-buttons"> <div class="sg-cards-public-page__cta-right-buttons" data-component="link-buttons">
<div class="sg-component-row"> <div class="sg-component-row">
<button class="sg-interaction-element sg-button sg-button--active" type="button" data-component="button" data-component-state="active"> <button class="sg-interaction-element sg-button sg-button--active" type="button" data-component="button" data-component-state="active">
Link-Button Link-Button
</button> </button>
</div>
</div> </div>
</div> </div>
</div> </div>
</article> </div>
</section> </article>
</div> </section>
</div> </div>
</section> </section>
styles/40-components-cards.css
+2 -5
View File
@@ -232,14 +232,11 @@
max-width: none; max-width: none;
} }
.sg-page-cards-public-page .sg-preview-area { .sg-page-cards-public-page #component-content-wrapper-card {
display: block;
width: calc(100% + (2 * var(--spacing-small)));
box-sizing: border-box;
margin-inline: calc(-1 * var(--spacing-small)); margin-inline: calc(-1 * var(--spacing-small));
} }
.sg-page-cards-public-page .sg-preview-area > .sg-transparent-card { .sg-page-cards-public-page #component-content-wrapper-card > .sg-transparent-card {
width: 100%; width: 100%;
max-width: none; max-width: none;
margin: var(--spacing-large) 0; margin: var(--spacing-large) 0;