53 lines
1.9 KiB
HTML
53 lines
1.9 KiB
HTML
<!doctype html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Styleguide – Cards Public Page</title>
|
||
<link rel="stylesheet" href="../styleguide.css">
|
||
</head>
|
||
<body class="sg-page-cards-public-page">
|
||
|
||
<h1 class="sg-main-heading">Components – Cards Public Page</h1>
|
||
|
||
<main aria-label="Cards Public Page">
|
||
|
||
<section id="component-content-wrapper-card">
|
||
<p class="sg-preview-label">Component: Content Wrapper Card</p>
|
||
|
||
<div class="sg-transparent-card" data-component="transparent-card">
|
||
<p class="sg-body">
|
||
Content Wrapper Card als Transparent Card ohne horizontale Außenabstände und mit vertikalem Abstand gemäss spacing-large.
|
||
</p>
|
||
|
||
<section id="component-cta-right">
|
||
<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">
|
||
<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-copy">
|
||
<p class="sg-body">
|
||
Ein Satz Text als CTA-Hinweis.
|
||
</p>
|
||
</div>
|
||
|
||
<div class="sg-cards-public-page__cta-right-buttons" data-component="link-buttons">
|
||
<div class="sg-component-row">
|
||
<button class="sg-interaction-element sg-button sg-button--active" type="button" data-component="button" data-component-state="active">
|
||
Link-Button
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</article>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
</body>
|
||
</html>
|