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

refactor(patterns): align CTA tokens with cascade

Browse Source
This commit is contained in:
gitea_admin committed 2026-08-31 12:56:42 +02:00
1 parent c925736376
commit ed1c4501ac
2 files changed
+7 -16
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

semantic-tokens-patterns.html
+1 -1
View File
@@ -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>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-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>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> </tbody>
</table> </table>
styles/45-patterns-public-page-patterns.css
+6 -15
View File
@@ -16,36 +16,27 @@
.sg-public-page-pattern-call-to-action-box--light { .sg-public-page-pattern-call-to-action-box--light {
background: var(--surface-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-public-page-pattern-call-to-action-box--light
> .sg-card-segment--body { > .sg-card-segment--body {
background: var(--surface-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-bullet-list { .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 { .sg-public-page-pattern-call-to-action-box--full-width {
--surface-public-page-pattern-call-to-action-full-width-title: var(--surface-portal-header); --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%; 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 { .sg-public-page-pattern-call-to-action-box__action {
display: flex; display: flex;
} }