Skip to content

Commit fabee23

Browse files
authored
feat(ui5-toolbar): align theming tokens with Horizon spec (#13425)
Update theming tokens to align with the latest Horizon design specification: - border-bottom: updated to use --sapGroup_TitleBorderWidth and --sapGroup_TitleBorderColor - background-color: updated to use --sapToolbar_Background - height: updated to use --sapElement_LineHeight (cozy) and --sapElement_Compact_LineHeight (compact)
1 parent c714873 commit fabee23

2 files changed

Lines changed: 4 additions & 4 deletions

File tree

packages/main/src/themes/Toolbar.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@
55
align-items: center;
66
justify-content: flex-end;
77
box-sizing: border-box;
8-
border-bottom: 0.0625rem solid var(--sapGroup_ContentBorderColor);
8+
border-bottom: var(--sapGroup_TitleBorderWidth) solid var(--sapGroup_TitleBorderColor);
99
padding: 0 var(--_ui5-toolbar-padding-left) 0 var(--_ui5-toolbar-padding-right);
10-
background-color: var(--sapList_HeaderBackground);
10+
background-color: var(--sapToolbar_Background);
1111
}
1212

1313
:host([align-content="Start"]) {

packages/main/src/themes/base/sizes-parameters.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,7 @@
149149

150150
/* Toolbar */
151151
--_ui5-toolbar-separator-height: 2rem;
152-
--_ui5-toolbar-height: 2.75rem;
152+
--_ui5-toolbar-height: var(--sapElement_LineHeight);
153153
--_ui5_toolbar_overflow_padding: 0.25rem 0.5rem;
154154

155155
/* DynamicPageTitle */
@@ -370,7 +370,7 @@
370370

371371
/* Toolbar */
372372
--_ui5-toolbar-separator-height: 1.5rem;
373-
--_ui5-toolbar-height: 2rem;
373+
--_ui5-toolbar-height: var(--sapElement_Compact_LineHeight);
374374
--_ui5_toolbar_overflow_padding: 0.1875rem 0.375rem;
375375

376376
/* DynamicPageTitle */

0 commit comments

Comments
 (0)