refactor(patterns): align CTA tokens with cascade
This commit is contained in:
1 parent
c925736376
commit
ed1c4501ac
2 files changed
+7
-16
No files matched your search
@@ -24,7 +24,7 @@
|
||||
<tr><td>layout-public-page-pattern-call-to-action-box-width</td><td>calc(var(--dimension-public-content-width) * 0.5)</td><td>Breite der dunklen Public Call to Action Box im Public-Page-Pattern-Kontext.</td></tr>
|
||||
<tr><td>surface-public-page-pattern-call-to-action-box-light</td><td>color-light-grey</td><td>Hintergrundfläche der Variante <code>Pattern: Public Call to Action Box light</code>.</td></tr>
|
||||
<tr><td>surface-public-page-pattern-call-to-action-full-width-title</td><td>surface-portal-header</td><td>Hintergrundfläche des blauen Titelsegments im Pattern <code>call to action full witdh</code>.</td></tr>
|
||||
<tr><td>text-public-page-pattern-call-to-action-full-width-title</td><td>color-font-light</td><td>Weiße Textfarbe der Titel- und Meldungssegmente im Pattern <code>call to action full witdh</code>.</td></tr>
|
||||
<tr><td>text-public-page-pattern-call-to-action-full-width-title</td><td>text-portal-header-brand</td><td>Weiße Textfarbe der Titel- und Meldungssegmente im Pattern <code>call to action full witdh</code>.</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
@@ -16,36 +16,27 @@
|
||||
|
||||
.sg-public-page-pattern-call-to-action-box--light {
|
||||
background: var(--surface-public-page-pattern-call-to-action-box-light);
|
||||
color: var(--color-font-dark);
|
||||
color: var(--text-content-block-card-content);
|
||||
}
|
||||
|
||||
.sg-public-page-pattern-call-to-action-box--light
|
||||
> .sg-card-segment--body {
|
||||
background: var(--surface-public-page-pattern-call-to-action-box-light);
|
||||
color: var(--color-font-dark);
|
||||
color: var(--text-content-block-card-content);
|
||||
}
|
||||
|
||||
.sg-public-page-pattern-call-to-action-box--light .sg-bullet-list {
|
||||
color: var(--color-font-dark);
|
||||
color: var(--text-content-block-card-content);
|
||||
}
|
||||
|
||||
.sg-public-page-pattern-call-to-action-box--full-width {
|
||||
--surface-public-page-pattern-call-to-action-full-width-title: var(--surface-portal-header);
|
||||
--text-public-page-pattern-call-to-action-full-width-title: var(--color-font-light);
|
||||
--text-public-page-pattern-call-to-action-full-width-title: var(--text-portal-header-brand);
|
||||
--surface-card-header-primary: var(--surface-public-page-pattern-call-to-action-full-width-title);
|
||||
--text-card-header: var(--text-public-page-pattern-call-to-action-full-width-title);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sg-public-page-pattern-call-to-action-box--full-width
|
||||
> .sg-card-segment--signal-yellow {
|
||||
color: var(--text-public-page-pattern-call-to-action-full-width-title);
|
||||
}
|
||||
|
||||
.sg-public-page-pattern-call-to-action-box--full-width
|
||||
> .sg-card-segment--darkblue {
|
||||
background: var(--surface-public-page-pattern-call-to-action-full-width-title);
|
||||
color: var(--text-public-page-pattern-call-to-action-full-width-title);
|
||||
}
|
||||
|
||||
.sg-public-page-pattern-call-to-action-box__action {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user