diff --git a/semantic-tokens-components.html b/semantic-tokens-components.html index 2c1b843..7f3453b 100644 --- a/semantic-tokens-components.html +++ b/semantic-tokens-components.html @@ -107,10 +107,8 @@ layout-pulldown-padding-inlinecompact-interaction-padding-horizontalInnenabstand links für Pulldown-Trigger und Select-Felder. layout-pulldown-chevron-offsetcompact-interaction-padding-horizontalRechter Innenabstand des Chevron-Icons im Pulldown. layout-pulldown-chevron-reserved-spacespacing-largeReservierte Breite zwischen Pulldown-Text und rechtem Chevron-Bereich. - surface-menu-panel-portalcolor-light-greyFläche des Portal-Sandwich-Menü-Panels (groß). - surface-menu-panel-objectcolor-light-greyFläche des Objekt-Sandwich-Menü-Panels (klein). - text-menu-link-portalcolor-font-darkLinktextfarbe im Portal-Sandwich-Menü. - text-menu-link-objectcolor-font-darkLinktextfarbe im Objekt-Sandwich-Menü. + surface-menu-panel-portalcolor-light-greyFläche des Sandwich-Menü-Panels für große und kleine Variante. + text-menu-link-portalcolor-font-darkLinktextfarbe im Sandwich-Menü für große und kleine Variante.

Toggle / Checkbox / Radio / Help

@@ -129,8 +127,7 @@ text-help-iconcolor-font-darkTextfarbe im Help-Icon. text-help-panelcolor-font-darkTextfarbe im Help-Panel. layout-help-panel-widthcalc(interaction-height * 8)Standardbreite des Help-Panels. - icon-sandwich-line-portalcolor-font-darkLinienfarbe des Portal-Sandwich-Icons (groß). - icon-sandwich-line-objectcolor-font-darkLinienfarbe des Objekt-Sandwich-Icons (klein). + icon-sandwich-line-portalcolor-font-darkLinienfarbe des Sandwich-Icons für große und kleine Variante.

Slider

diff --git a/styleguide.css b/styleguide.css index bbdee4c..9d6addc 100644 --- a/styleguide.css +++ b/styleguide.css @@ -56,7 +56,6 @@ --surface-toggle-track: var(--color-medium-grey); --surface-toggle-handle: var(--color-darkblue); --surface-menu-panel-portal: var(--color-light-grey); - --surface-menu-panel-object: var(--color-light-grey); --surface-help-icon: var(--color-medium-grey); --surface-help-panel: var(--color-light-grey); --surface-pulldown-panel: var(--color-light-grey); @@ -86,13 +85,11 @@ --text-tab-selected: var(--color-font-light); --text-tab-unselected: var(--color-dark-grey); --text-menu-link-portal: var(--color-font-dark); - --text-menu-link-object: var(--color-font-dark); --text-help-icon: var(--color-font-dark); --text-help-panel: var(--color-font-dark); --text-hyperlink: var(--color-font-hyperlink); --icon-pulldown-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M2 2l4 4 4-4' fill='none' stroke='currentColor' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E"); --icon-sandwich-line-portal: var(--color-font-dark); - --icon-sandwich-line-object: var(--color-font-dark); --icon-radio-mark: var(--color-font-dark); /* Semantic component tokens: Charts */ @@ -981,7 +978,7 @@ section + section { .sg-sandwich-menu-wrap[data-component-size="small"] .sg-sandwich-button__line { height: calc(var(--sandwich-line-height) - 1px); - background: var(--icon-sandwich-line-object); + background: var(--icon-sandwich-line-portal); } .sg-sandwich-menu-wrap[data-component-size="small"] .sg-sandwich-button__icon { @@ -1013,7 +1010,7 @@ section + section { } .sg-sandwich-menu-wrap[data-component-size="small"] .sg-sandwich-menu-panel { - background: var(--surface-menu-panel-object); + background: var(--surface-menu-panel-portal); } .sg-sandwich-menu-wrap[data-open="true"] .sg-sandwich-menu-panel { @@ -1030,7 +1027,7 @@ section + section { } .sg-sandwich-menu-wrap[data-component-size="small"] .sg-sandwich-menu-link { - color: var(--text-menu-link-object); + color: var(--text-menu-link-portal); } .sg-sandwich-menu-wrap[data-align="left"] .sg-sandwich-menu-panel {