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

Align semantic token component docs with styleguide CSS

Browse Source
This commit is contained in:
Mathias Gläser
2026-05-19 08:34:46 +02:00
parent 7d0cb335c1
commit 6b98073dd4
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
semantic-tokens-components.html
+4 -4
View File
@@ -21,7 +21,7 @@
<tr><td>surface-card-body</td><td>color-light-grey</td><td>Fläche im Body-Segment der Card.</td></tr> <tr><td>surface-card-body</td><td>color-light-grey</td><td>Fläche im Body-Segment der Card.</td></tr>
<tr><td>surface-card-header-primary</td><td>color-darkblue</td><td>Primärer Header-Hintergrund.</td></tr> <tr><td>surface-card-header-primary</td><td>color-darkblue</td><td>Primärer Header-Hintergrund.</td></tr>
<tr><td>surface-card-header-alternative</td><td>color-darkgreen</td><td>Alternativer Header-Hintergrund.</td></tr> <tr><td>surface-card-header-alternative</td><td>color-darkgreen</td><td>Alternativer Header-Hintergrund.</td></tr>
<tr><td>surface-card-header-alternative2</td><td>color-darkbrown</td><td>Zweite alternative Header-Fläche (im CSS derzeit als surface-card-header-muted geführt).</td></tr> <tr><td>surface-card-header-muted</td><td>color-darkbrown</td><td>Zweite alternative Header-Fläche.</td></tr>
<tr><td>divider-card-segment</td><td>color-white</td><td>Trenner zwischen Segmenten.</td></tr> <tr><td>divider-card-segment</td><td>color-white</td><td>Trenner zwischen Segmenten.</td></tr>
<tr><td>text-card-header</td><td>color-font-light</td><td>Header-Textfarbe.</td></tr> <tr><td>text-card-header</td><td>color-font-light</td><td>Header-Textfarbe.</td></tr>
<tr><td>text-card-body</td><td>color-font-dark</td><td>Standard-Textfarbe im Body.</td></tr> <tr><td>text-card-body</td><td>color-font-dark</td><td>Standard-Textfarbe im Body.</td></tr>
@@ -41,7 +41,7 @@
<thead><tr><th>Semantischer Token</th><th>Verwendeter Foundation-Token</th><th>Beschreibung Verwendungszweck in der Komponente</th></tr></thead> <thead><tr><th>Semantischer Token</th><th>Verwendeter Foundation-Token</th><th>Beschreibung Verwendungszweck in der Komponente</th></tr></thead>
<tbody> <tbody>
<tr><td>surface-card-transparent</td><td>color-transparent</td><td>Transparente Fläche der Text-Group-Box ohne Card-Segmente.</td></tr> <tr><td>surface-card-transparent</td><td>color-transparent</td><td>Transparente Fläche der Text-Group-Box ohne Card-Segmente.</td></tr>
<tr><td>text-group-box</td><td>color-font-light</td><td>Textfarbe der Text-Group-Box (im CSS derzeit als text-card-transparent geführt).</td></tr> <tr><td>text-card-transparent</td><td>color-font-light</td><td>Textfarbe der Text-Group-Box.</td></tr>
</tbody> </tbody>
</table> </table>
</section> </section>
@@ -185,12 +185,12 @@
<h3 class="sg-sub-heading sg-section-h3">Portal Header</h3> <h3 class="sg-sub-heading sg-section-h3">Portal Header</h3>
<table class="sg-foundation-table sg-table-label"><thead><tr><th>Semantischer Token</th><th>Verwendeter Foundation-Token</th><th>Beschreibung Verwendungszweck in der Komponente</th></tr></thead><tbody> <table class="sg-foundation-table sg-table-label"><thead><tr><th>Semantischer Token</th><th>Verwendeter Foundation-Token</th><th>Beschreibung Verwendungszweck in der Komponente</th></tr></thead><tbody>
<tr><td>surface-portal-header</td><td>color-darkblue</td><td>Header-Grundfläche.</td></tr> <tr><td>surface-portal-header</td><td>color-darkblue</td><td>Header-Grundfläche.</td></tr>
<tr><td>surface-portal-header-tab</td><td>color-darkblue</td><td>Fläche nicht aktiver Header-Tabs.</td></tr> <tr><td>surface-portal-header-tab</td><td>color-midblue</td><td>Fläche nicht aktiver Header-Tabs.</td></tr>
<tr><td>surface-portal-header-tab-active</td><td>color-light-grey</td><td>Fläche aktiver Header-Tabs.</td></tr> <tr><td>surface-portal-header-tab-active</td><td>color-light-grey</td><td>Fläche aktiver Header-Tabs.</td></tr>
<tr><td>surface-portal-header-menu-panel</td><td>surface-menu-panel-portal</td><td>Alias auf Portal-Menü-Panel-Fläche aus Interactive Elements.</td></tr> <tr><td>surface-portal-header-menu-panel</td><td>surface-menu-panel-portal</td><td>Alias auf Portal-Menü-Panel-Fläche aus Interactive Elements.</td></tr>
<tr><td>surface-portal-header-menu-trigger</td><td>surface-control-default</td><td>Alias auf Standard-Control-Fläche aus Interactive Elements.</td></tr> <tr><td>surface-portal-header-menu-trigger</td><td>surface-control-default</td><td>Alias auf Standard-Control-Fläche aus Interactive Elements.</td></tr>
<tr><td>text-portal-header-brand</td><td>color-font-light</td><td>Textfarbe der Brand.</td></tr> <tr><td>text-portal-header-brand</td><td>color-font-light</td><td>Textfarbe der Brand.</td></tr>
<tr><td>font-size-portal-header-brand</td><td>calc(font-size-brand * 1.1)</td><td>Schriftgröße der Brand im Portal Header (10% größer als Standard-Brand).</td></tr> <tr><td>font-size-portal-header-brand</td><td>calc(var(--font-size-brand) * 1.1)</td><td>Schriftgröße der Brand im Portal Header (10% größer als Standard-Brand).</td></tr>
<tr><td>text-portal-header-tab</td><td>color-font-light</td><td>Textfarbe nicht aktiver Header-Tabs.</td></tr> <tr><td>text-portal-header-tab</td><td>color-font-light</td><td>Textfarbe nicht aktiver Header-Tabs.</td></tr>
<tr><td>text-portal-header-tab-active</td><td>color-font-dark</td><td>Textfarbe aktiver Header-Tabs.</td></tr> <tr><td>text-portal-header-tab-active</td><td>color-font-dark</td><td>Textfarbe aktiver Header-Tabs.</td></tr>
<tr><td>text-portal-header-menu-link</td><td>text-menu-link-portal</td><td>Alias auf Portal-Menü-Link-Textfarbe.</td></tr> <tr><td>text-portal-header-menu-link</td><td>text-menu-link-portal</td><td>Alias auf Portal-Menü-Link-Textfarbe.</td></tr>