@sap-theming/theming-base-content

Bug Fixes

• @font-face src: URLs in compiled css_variables.css are now structurally exposed for post-processing by the engine's fUrlMap URL rewriter, so that cross-origin font requests on CF use the unauthenticated route instead of the authenticated themeroot.

Features

• Shell Hero Banner parameters are available in Detailed Theming for Horizon and Quartz themes, so users can customize the homepage banner without Expert Theming

Bug Fixes

• sapLink_Hover_TextDecoration is now underline in high-contrast themes of the Horizon and Quartz families, so that hovered links retain an accessibility affordance
• SAP-icons v6.02 with increased arrowhead size for back-to-top, download and upload and the width of expand increased to match the width of collapse
• CSS custom properties for image and asset parameters (e.g. sapBackgroundImage) are defined with @property to resolve URLs relative to the right path

Bug Fixes

• sapShell_HeroBanner_BackgroundImage no longer uses 4- and 8-digit hex color values (e.g. #0000, #00000073), which were silently broken when compiled with less-openui5; the values are now expressed as transparent and rgba() equivalents

Deprecations

The internal parameter sapAt, that was accidentially exposed as a CSS custom property with 11.34.0, is no longer a CSS custom property; if you need the literal "@" as a value in CSS, use that directly

Features

• Parameters of the sapShell_HeroBanner namespace, that allow to create Hero Banners in the Shell; sapShell_HeroBanner_TextColor is intended as the text color that should be layered on top of sapShell_HeroBanner_BackgroundImage on top of sapShell_HeroBanner_Background
• sapGroup_ContentAlternatingBackground for the content of alternating ("contrasting") groups
• Right-to-left SAP-icons SVGs in sync with SAP-icons iconfont metadata

Bug Fixes

• sapContent_ImagePlaceholderForegroundColor has a 4.5:1 contrast against sapContent_ImagePlaceholderBackground in Morning Horizon

Features

SAP-icons as SVGs: in addition to the woff2/woff/ttf versions of the v4 and v5 SAP-icons in Base/baseLib/baseTheme/fonts (v4) and Base/baseLib/sap_horizon/fonts (v5), the SAP-icons now also exist as SVGs in the new library Base/icons (with only the themes of the Horizon and Quartz families). Themes in this new library have one CSS file: svg.css, that contains CSS custom properties with URLs to the individual icons, with the icon name prefixed with sapIcons_ (e.g. the URL for sap-icon://washing-machine is var(--sapIcons_washing-machine)). UI technologies using those icons are expected to resolve the URLs when applying SVGs, either as mask-image or with a fetch() to inline them into the document (for fetch(), be prepared for theme repositories that do not respond with the right Access-Control-Allow-Origin header); see the following example:

 const [themeId, themeRoot = 'https://cdn.jsdelivr.net/npm/@sap-theming/theming-base-content/content'] =
 	decodeURIComponent((new URLSearchParams(location.search || '')).get('sap-theme') || 'sap_horizon').split('@');

 const baseLib = document.createElement('link');
 baseLib.setAttribute('rel', 'stylesheet');
 baseLib.setAttribute('rel', `${themeRoot.replace(/\/$/, '')}/Base/baseLib/${themeId}/css_variables.css`);
 document.head.appendChild(baseLib);

 const sapIcons = document.createElement('link');
 sapIcons.setAttribute('rel', 'stylesheet');
 sapIcons.setAttribute('rel', `${themeRoot.replace(/\/$/, '')}/Base/icons/${themeId}/svg.css`);
 document.head.appendChild(sapIcons);

 const iconProperty = '--sapIcons_attachment-zip-file';

 // mask-image approach
 const iconDiv = document.createElement('div');
 iconDiv.style.width = 'var(--sapContent_IconHeight)';
 iconDiv.style.height = 'var(--sapContent_IconHeight)';
 iconDiv.style.backgroundColor = 'var(--sapContent_IconColor)';
 iconDiv.style.maskImage = `var(${iconProperty})`;
 iconDiv.style.maskSize = 'contain';
 document.body.appendChild(iconDiv);

 // fetch approach
 const iconUrl = getComputedStyle(document.documentElement).getPropertyValue(iconProperty);
 const iconRequest = await fetch(iconUrl);
 const iconText = await await iconRequest.text();
 const iconSvg = new DOMParser().parseFromString(iconText, 'image/svg+xml').documentElement;
 document.body.appendChild(iconSvg);

Bug Fixes

sapButton_Selected_TokenBorderWidth is a delta to sapButton_BorderWidth in all themes, i.e. it is changed to 0.0625 * @sapContent_GridSize in Morning and Evening Horizon (https://github.wdf.sap.corp/themedesigner/theming-content/pull/1189)

Deprecations

• sapButton_Emphasized_FontWeight is protected and deprecated; use font-family: var(--sapButton_Emphasized_FontFamily); font-weight: normal; instead
• sapHighlightTextColor is protected and deprecated; themes of the Horizon- and Quartz family do not use this parameter

Features

• BusinessSuiteInAppSymbols v2.091/v1.091 with new icon e13d (icon-zoom-to-fit)

Bug Fixes

• sapShell_BackgroundGradient, although it is deprecated, is made available as CSS custom property after it had accidentally been removed with 11.3.0
• Only parameters of type fontFamilies are tagged as "Font", so that the "Typography" filter in the theme designer does not show "false positives"
• sapContent_…_HeaderShadow parameters are no longer tagged as "Dimension"
• Descriptions of the sapTile_… parameters are improved

Deprecations

• sapShell_BackgroundPatternColor is protected and deprecated; themes of the Horizon- and Quartz family do not have a background pattern

Bug Fixes

• sapHoverColor and some parameters of the sapChart namespace are made available for theming in themes of the Horizon and Quartz families, so that they no longer conceal the connection between other themable parameters

Bug Fixes

• Tagged the Icon parameters so you can filter it in the UIThemeDesigner via the tag 'Icon'
• sapContent_IconHeight is no longer available for theming (i.e. "protected") in all themes
• Colors in high-contrast themes of older theme families are consistent with their counterpart of the Horizon theme family
• Remove sapShellColor from the mobile guides because of design changes in SAP Mobile Start

Features

• Semantic parameters for International Business Communication Standards (IBCS) charts: sapChart_IBCS_Actual for values of the actual period, sapChart_IBCS_Previous for values of the previous period, sapChart_IBCS_Good and sapChart_IBCS_Bad for good and bad values

Bug Fixes

• SAP-icons v5.13 with an updated e1bb (sap-logo-shape) that maintains the distinctive, sharp-cornered design of the SAP logo
• sapButton_Emphasized_Background is slightly darker in Quartz Dark, to achieve a 4.5:1 contrast against sapButton_Emphasized_TextColor
• sapTile_SeparatorColor is transparent in themes of the Horizon theme family, to be consistent with the Tiles and Cards specification
• sapShell_InteractiveBackground is mapped to sapField_Background in sap_hcb, to be consistent with all other high-contrast themes
• the sapIndicationColor_ parameters of sap_hcb have values that are consistent with all other high-contrast themes

Bug Fixes

• sapChart_Sequence_2_Minus4 is slightly darker than sapChart_Sequence_2_Minus3 in Morning Horizon, to make them distinguishable
• sapChart_Sequence_11_Minus5 is darkened in Morning Horizon, to improve contrast

Features

• SAP-icons v5.12 and v4.24 with new icons e2aa (smart-watch) and e2ab (vr-glasses)

Bug Fixes

• sapShell_BorderColor is distinguishable from sapShellColor, it is slightly darker in Morning Horizon and slightly lighter in Evening Horizon
• Descriptions of font-family parameters are improved, to reflect that these parameters accept a prioritized list of font family names
• sapContent_Lite_Shadow is none in low-contrast themes
• The different sapContent_…_HeaderShadow parameters use the values for low-contrast dark themes in sap_belize_plus
• sapChart_Sequence_6_Plus1 is slightly lighter in Quartz and legacy themes, to match the specification
• sapButton_ReadOnly_TokenBackground is sapButton_TokenBackground in Quartz Dark, to match the specification
• The color expressions of the shades of sapChart_Sequence_1 in Morning Horizon are simplified, leading to slightly more saturated colors
• sapChart_Sequence_1_BorderColor is mapped to a darker shade of sapChart_Sequence_1 in Morning Horizon, to increase contrast against sapChart_Sequence_1_TextColor

Deprecations

sapContent_Margin_Tiny, sapContent_Margin_Small, sapContent_Margin_Medium and sapContent_Margin_Large are deprecated and should no longer be used. For a responsive margin, use sapContent_Margin_S, …_M, …_L and …_XL instead. For fixed-width margins use sapContent_Space_Tiny, …_Small, …_Medium and …_Large instead.

Features

• BusinessSuiteInAppSymbols v2.090/v1.090 with new icons e13a (icon-all-spaces-pin), e13b (icon-handling-units) and e13c (icon-packing-work-center)
• Parameters for a responsive margin sapContent_Margin_S, …_M, …_L and …_XL that should've been introduced with 11.22.0 but were accidentally introduced as sapContent_Margin_Tiny, …_Small, …_Medium and …_Large

Bug Fixes

• sapSlider_Selected_Dimension has the correct values instead of sapDefault_Dimension in all themes
• sapChart_LineColor_2 had the specified value for dark themes in light themes and the other way around, this has been flipped back so that it is darken(@sapChart_LineColor_1, 32) in light themes (Quartz Light and older) and lighten(@sapChart_LineColor_1, 35) in dark themes (Quartz Dark and older)

Bug Fixes

• Revert removal of /*!SAP_POSTPROCESS_REDUCE…*/ (from v11.29.0)
• Fix default fallback strategy of SAP base themes
• css_variables.css contains @font-face definitions for SAP-icons-TNT and SAP-icons-Business-Suite

Features

• css_variables.css contains @font-face definitions

Bug Fixes

• sapContent_Space_Tiny is .5rem

Features

• SAP-icons-TNT v3.7 and v2.12 with new icons 0xe113 (ai-feature-estimator), 0xe114 (service-estimator), 0xe115 (add-project) and 0xe116 (add-issue)
• Parameters of the "Focus" category are tagged as "Focus"
• Parameters of the "ObjectHeader" category are tagged as "ObjectHeader"
• Parameters of the "Busy" category are tagged as "Busy"

Bug Fixes

• Read only and editable fields are easier to distinguish in Quartz Light and Dark, with a slightly darker sapField_ReadOnly_Background, a dashed sapField_ReadOnly_BorderStyle/sapField_Selector_ReadOnly_BorderStyle and sapField_Focus_BorderColor mapped to sapContent_FocusColor
• Links and text are easier to distinguish in Quartz and Horizon, with text colors being slightly darker in light themes and slightly lighter in dark themes and link colors being slightly darker in dark themes
• Reverts the dashed sapField_ReadOnly_BorderStyle/sapField_Selector_ReadOnly_BorderStyle from 11.28.0 as this may be incompatible

Features

• New parameter sapFavicon that provides a shell-independent favicon to be used by all applications, mapped to sapShell_Favicon for compatibility

Bug Fixes

• sapContent_Lite_Shadow is none in dark themes

Features

• SAP-icons v5.11/v4.23 with the new icons e2a8 (verified) and e2a9 (walk-me)

Features

• BusinessSuiteInAppSymbols v2.089 (Horizon) and v1.089 (non-Horizon) with new icons e18b (icon-configurable-product), e18c (icon-entry-configurable-product)
• Parameters for the "neutral" state of tabs, e.g. sapTab_Neutral_TextColor
• Release "b" versions of indication colors, e.g. sapIndicationColor_1b, for theming in Horizon and Quartz
• Calculate "b" version text colors of indication colors, e.g. sapIndicationColor_1b_TextColor, from their "b" version indication colors

Features

After Batch 1 (11.19.0) and Batch 2 (11.22.0), this release completes the addition of new parameters to reduce the need for theme-specific ("delta") CSS, with the final Batch 3 of new parameters:

• Border-width of message strips (sapMessage_BorderWidth) and background-color of hovered buttons in message strips (sapMessage_Button_Hover_Background)
• A whole new namespace sapTab, that describes tabs in e.g. an IconTabBar with standard text-, foreground-, icon- and background-color, selected state and positive/critical/negative semantic states, e.g. sapTab_Negative_Selected_IconColor
• Text and background colors for the "b" versions of indication colors, e.g. sapIndicationColor_1b_TextColor

Bug Fixes

• sapGroup_BorderCornerRadius is .75rem in Morning and Evening Horizon, to match the target design for the border-radius of Groups
• sapChart_OrderedColor_1 is #168eff, a little bit brighter and bluer, to make it easier to distinguish from sapBrandColor; the contrast() statements of the sapChart_Sequence_1_…TextColor parameters are adjusted accordingly

Features

• New parameter sapSapThemeId makes the id of the SAP-provided theme that is used (or that the custom theme is based on) available at runtime
• BusinessSuiteInAppSymbols v2.088 (Horizon) and v1.088 (non-Horizon) with new icons e189 (icon-staging) and e18a (icon-dangerous-goods)

Bug Fixes

• Semantic parameters are consistently tagged with "Semantic", the tag "SemanticColor" is removed
• Prohibit spacing parameters introduced with 11.22.0 from theming
• Fix mistake for parameter assignment sapField_Selector_Hover_InvalidBackground

Features

• All kinds of Checkbox and Radio Button Hover Backgrounds, i.e. sapField_Selector_Hover*Background
• Many new spacing parameters for the sapContent and sapShell namespaces, together with defined S, M, L and XL viewport width breakpoints in the new sapBreakpoint namespace
  • (S|M|L|XL) parameters are to be used when the respective sapBreakpoint is met
  • (Tiny|Small|Medium|Large) parameters can be used regardless of viewport sizes
  • sapBreakpoint_(S|M|L|XL)_Min describe the minimum viewport width for the t-shirt size
  • sapContent_Space_(S|M|L|XL) and sapShell_Space_(S|M|L|XL) describe the horizontal padding of applications and shells depending on the viewport size
  • sapContent_Space_(Tiny|Small|Medium|Large) are viewport-width-independent sizes used for generic margin- and padding utilities (e.g. .sapUiTinyMarginBegin)
  • sapContent_Margin_(S|M|L|XL) are a special four-sided viewport-width-dependent parameter for margins
  • sapContent_Gap_(S|M|L|XL), sapShell_Gap_(S|M|L|XL) and sapShell_GroupGap_(S|M|L|XL) describe the gap between elements in applications and shells
  • sapContent_Padding_(S|M|L|XL) are the outermost horizontal paddings of applications
• Component Border widths sapGroup_TitleBorderWidth, sapList_TableFixedColumnBorderWidth and sapList_TableFixedRowBorderWidth
• Card and Tile hover background sapTile_Hover_ContentBackground and sapTile_Active_ContentBackground
• 3 new Avatar parameters sapAvatar_Lite_BorderColor, sapAvatar_Lite_Background and sapAvatar_Hover_BorderColor
• The new sapBlockLayer_Opacity allows to change the opacity of a Block Layer Background which is e.g. in the back of a dialog
• New semantic header shadows (Success, Warning, Error, Information)
• Token parameter for border corner radius sapButton_TokenBorderCornerRadius, border width sapButton_Selected_TokenBorderWidth and background sapButton_ReadOnly_TokenBackground
• The border corner radius inside a group of buttons are now available sapButton_Segment_BorderCornerRadius
• Border color sapField_Picker_BorderColor and border width sapField_Picker_BorderWidth of content pickers are no available for custom theming
• SAP internal parameters sapCss_SAP-icons-TNT and sapCss_SAP-icons-Business-Suite are now available. That allow to switch on the generation of @font-face definitions for those icon-fonts
• SAP-icons v5.10 and v4.22 with new icon xe2a7 (unsynchronize)
• BusinessSuiteInAppSymbols v2.087 (Horizon) and v1.087 (non-Horizon) with new icon e188 (icon-map-navigation)
• Tag sapContent_Illustrative_Color* parameters with "Illustrative"
• Tag sapIndicationColor* parameters with "Indication" and delete tag "SemanticColor"
• Release sapIndicationColor* parameters 9 and 10 for theming

Features

• BusinessSuiteInAppSymbols v2.086 (Horizon) and v1.086 (non-Horizon) with new icons e186 (icon-back-to-search), e187 (icon-business-objects-folder), e076 (icon-truck-driver-2) and e099 (icon-add-component)

This version includes "Batch 1" of a larger theming rework done by SAP Design, reflected in multiple new features and bug fixes.

Features

• A new sapShell_SubBrand_TextColor allows to theme the "sub-brand" next to the company logo in the Shell.
• Badges are more accessible with the new sapContent_BadgeBorderColor.
• Button font-families are available as sapButton_FontFamily and sapButton_Emphasized_FontFamily.
• The border-width of emphasized Buttons is available as sapButton_Emphasized_BorderWidth.
• Checkboxes and Radio-Buttons ("Selectors") are still part the sapField namespace, but have their own "sub-namespace" as sapField_Selector_ with a collection of all imagineable border-styles, e.g. sapField_Selector_BorderStyle, sapField_Selector_ReadOnly_BorderStyle or sapField_Selector_InvalidBorderStyle.
• There are hover backgrounds for avatars, i.e. sapAvatar_1_Hover_Background .. sapAvatar_10_Hover_Background.
• 11 new Illustration colors (sapContent_Illustrative_Color21 .. sapContent_Illustrative_Color31) allow to implement the Illustration Guideline updated by SAP Design.

Bug Fixes

• Illustration colors (sapContent_Illustrative_Color…) have an increased contrast against each other.
• In high-contrast themes, sapContent_BadgeBackground is mapped to sapHC_StandardForeground and sapContent_BadgeTextColor has a contrast statement to select either sapTextColor or sapBaseColor, thus increasing contrast.
• SAP-icons group med is renamed to medical, doc to documents and shop to shopping.
• Groups- and tags-mappings of SAP-icons are aligned with the groups- and tags-mappings of SAPUI5.

Docs

• The theming-base-content repository contains a parameter- and icons-overview at http://sap.github.io/theming-base-content/docs

Only internal changes.

Features

• BusinessSuiteInAppSymbols v2.085 (Horizon) and v1.085 (non-Horizon) with new icon (icon-collaboration-manager)

Bug Fixes

• SAP-icons v5.9(.1) with fixed e000 (accidental-leave)
• SAP-icons-TNT v3.6(.1) and v2.11(.1) with updated metadata of e031 (java) that makes it clear that the icon is the Java logo, not the JavaScript logo
• Groups in the SAP-icons metadata are optimized, e.g. "Places", "places" and "place" have been unified to "place"

Features

• 431 new parameters for the sapChart namespace, that allow extended theming for all kinds of charts. There's now a 12th main chart color (sapChart_OrderedColor_12), as well as 9 shades (3 lighter: _Plus3 … _Plus1, 5 darker: _Minus1 … _Minus5) of each color, all with color (e.g. @sapChart_Sequence_1_Plus3), text color (e.g. @sapChart_Sequence_1_Plus3_TextColor), shadow/halo (e.g. @sapChart_Sequence_1_Plus3_TextShadow) and one border-color per main color (e.g. @sapChart_Sequence_1_BorderColor); also some text (e.g. @sapChart_Data_TextColor), structure (e.g. @sapChart_Background) and interaction (e.g. @sapChart_Data_InteractiveColor) styles

Bug Fixes

• SAP-icons v5.9 and v4.21 with updated shapes of e246 (paste, update only in v5), e24f (resize-corner) and e09c (pause)
• sHelpLinks of themes point to the design documentation of that theme, e.g. to Morning Horizon Colors for Morning Horizon

Bug Fixes

• sapFontHeaderFamily is sapFontFamily in Horizon HCB, which is now consistent across all high-contrast themes (fixes #19)

Features

• Icon metadata for the BusinessSuiteInAppSymbols font in Base/baseLib/baseTheme/fonts/BusinessSuiteInAppSymbols.json

Features

• Theme sets (e.g. sap_horizon_set or sap_fiori_3_set) contain a css_variables.css and an avatar.svg, that reference the themes included in the set

Bug Fixes

• Single-SVG files of SAPGUI-icons and SAPWeb-icons are excluded from the npm package

Features

• The CSS skeleton that creates the :root{…} and the .background-image--…{…} CSS rules in css_variables.css is now exposed as a separate importable file skeleton.less; as importing css_variables.less in consuming frameworks leads to unexpected and erroneous build results, it is highly recommended to import the new skeleton.less instead.
• SAP-icons-TNT v3.6 and v2.11 with new icons e110 (business-application-studio), e111 (clone-from-git) and e112 (business-accelerator).

Bug Fixes

• Quartz Dark considered generally available for UI5 >= 1.71.27, see SAP Note 2982978.
• SAP-icons-TNT v3.6 and v2.11 with fixed horizontal alignment issues in some icons.

Features

• SAP-icons v5.8 and v4.20 with new icon e2a6 (in-progress-2), metadata of e03e (decline) including the tag "decline"
• Themes now include an avatar.svg (e.g. Base/baseLib/sap_horizon/avatar.svg) that gives a glimpse on the most prominent theme colors used in their natural environment

Bug Fixes

• SAP-icons v5.8 with metaphors for e019 (pending) and e111 (eam-work-order) following the metaphor of v4

Bug Fixes

• css_variables.less will no longer overwrite @sapCss_… parameters. We reverted the incompatibility introduced with 11.5.0, css_variables.less again uses /*!SAP_POSTPROCESS_REDUCE_START*/ and /*!SAP_POSTPROCESS_REDUCE_END*/, i.e. it is no longer necessary to re-overwrite the @sapCss… parameters after importing css_variables.less.

Bug Fixes

• Design Tokens for shadows without a blur (like @sapContent_HeaderShadow: inset 0 -0.125rem @sapObjectHeader_BorderColor) are exported correctly

Features

• 18 new parameters in the new sapAssistant_… namespace that describe the SAP cross technology digital assistant, currently named Joule
• New parameter sapShell_Assistant_ForegroundColor that describes the foreground color of the SAP assistant within the shell bar

Features

• Font 72 v1.40 with added support for Bulgarian characters. Bulgarian Cyrillic alternates are accessible through the OpenType feature LOCL > Bulgarian

Features

• SAP-icons-TNT v3.5 and v2.10 with new icons e10e (fiori-application) and e10f (build-code)

Bug Fixes

• A light blue sapButton_Selected_Background and a darker blue sapButton_Selecter_Hover_Background in Morning Horizon make unselected Toggle Buttons distinguishable from regular Buttons
• The handle icons of positive (sapButton_Handle_Positive_TextColor) and negative (sapButton_Handle_Negative_TextColor) Switches have an increased contrast by defaulting to sapTextColor in high-contrast themes
• The value and "maximum" dot of Progress elements (sapProgress_Value_Background) have an increased contrast against the bar color in Morning and Evening Horizon
• Morning Horizon is the fallback theme for the Base framework
• The labels of high-contrast themes now adhere to SAPs naming guideline of using "SAP" only in front of branded terms, with an exception for the beginnings of theme labels, i.e. they are now labeled "SAP High Contrast Black (Horizon)" instead of "SAP High Contrast Black (SAP Horizon)" and similar
• contrast() statements of sapIndicationColor_…_Active_TextColor now reference sapIndicationColor_…_Active_Background as their background in Quartz Light and Dark

Features

• SAP-icons-TNT v3.4 and v2.9 with new icon e10d (bound-validation-rule)

Bug Fixes

• SAP-icons-TNT v3.4 and v2.9 with redesigned icon e07c (network)

Features

• Icon metadata for the SAP-icons-TNT font in Base/baseLib/baseTheme/fonts/SAP-icons-TNT.json
• SAP-icons v5.7 and v4.19 with new icon e2a5 (ai)

Bug Fixes

• SAP-icons v5.7 and v4.19 with updated metaphors for e2a3 (da) and e2a4 (da-2), as well as e01a (pdf-attachment) and e0ce (pdf-reader) without adobe shape

Features

• Icon metadata for the SAP-icons font in Base/baseLib/baseTheme/fonts/SAP-icons.json
• SAP-icons v5.06 and v4.18 with new icons for the Digital Assistant: e2a3 (da) and e2a4 (da-2)
• SAP-icons-TNT v3.3 and v2.8 with new icons for AI: e10b (ai-1) and e10c (ai-2)
• Design Tokens of theming parameters (e.g. sapField_Background, but not _sapField_BackgroundH etc.) now contain the description of the parameter

Bug Fixes

• SAP-icons v5.06 and v4.18 with metaphors in v5 aligned to v4 for e1fd (sort-ascending), e1fc (sort-descending), e080 (database), e0b1 (message-error), e202 (message-information), e203 (message-success) and e201 (message-warning)
• The design-tokens for sapField_…Background, sapField_…HelpBackground and sapField_Hover_…Shadow now have a usable value.

This is the release that brings the updated parameter values for the Horizon theme family that we announced with 11.3.0 (on 2023-04-04). It is synced with the major SAP UI technologies (UI5 WebComponents, SAPUI5, and Unified Rendering) and should not cause breaking changes. Hence, as it fixes design bugs, it is considered a bug fix.

Bug Fixes

• Hundreds of parameters of Morning and Evening Horizon are updated based on one year of customer feedback. See Improvements Coming to the Horizon Visual Theme for SAP Fiori for a detailed explanation. Main changes are:
  • editable Fields are white again, and read-only fields grey (only with @sapField_HorizonNGEnabled: 1, which defaults to 0 for base.less and to 1 for css_variables.less)
  • shadows with a spread are no longer used
  • Hover states are more visible
  • standard Buttons look more enabled now and a light blue (secondary information) Button is introduced

Bug Fixes

• @font-face definitions of "commonly used subset" fonts (e.g. "72", not "72full") no longer contain Combining Characters (like U+30C, the "Combining Caron") in a followup of https://crbug.com/1444391
• A fixed build of BusinessSuiteInAppSymbols v2.084 with updated glyphs of e0e3 (business-partner), e08a (face-astonished), e087 (face-bad) and e086 (face-very-bad)
• Chart colors (sapChart_…) have an increased contrast against sapBackgroundColor in Morning and Evening Horizon
• sapIndicationColor_1 is #fd4444 in Evening Horizon as an accessibility enhancement
• Tags and Types of some parameters are adapted, to improve the parameter visualization in the Theme Designer UI; e.g. actual images like sapCompanyLogo have the type image, the sapShell_Category_…_TextShadow parameters now have the type boxShadow, or the sapField_…BorderStyle parameters have the type borderStyle
• Design Tokens more closely reflect the less version of the theming-base-content, especially where fade(…) and contrast(…) is used in less

Bug Fixes

• sapHC_HighlightBackground has been slightly darkened in Quartz HCB, Belize HCB, and HCB (to the value used in Horizon HCB) to achieve an AAA (7:1) contrast against white

Bug Fixes

• Font URLs always "go out one folder and back in again" (e.g. ./../sap_horizon/fonts instead of ./fonts) so that rewriting font URLs in custom themes always references the SAP theme

Bug Fixes

• SAP-icons v5.05 and v4.17 with e1f0 (slim-arrow-up) pointing up again
• Updated de translation of sapField_InvalidShadow

Features

• SAP-icons-TNT v3.2 (Horizon-family) and v2.7 (non-Horizon) with new icons: e107 (indicator), e108 (indicator-active), e109 (task-optional) and e10A (task-done)

Bug Fixes

• Illustration Colors (sapContent_Illustrative_Color…) are updated in all high-contrast themes to better highlight foreground elements and enhance accessibility
• @font-face definitions of "commonly used subset" fonts (e.g. "72", not "72full") specify their supported unicode-range to deal with https://crbug.com/1444391
• sapButton_BorderColor is slightly darker/lighter in Horizon to increase the visibility of Buttons

Features

• Additional parameters are considered "Badge Parameters" (i.e. they can be used in theme previews in the UI Theme Designer without actually loading the theme): sapContent_Selected_TextColor, sapContent_Shadow0, sapField_Background, sapShell_Background, sapShell_TextColor, sapShell_InteractiveTextColor, sapShell_GroupTitleTextColor, sapShell_Shadow, sapShell_Navigation_Background, sapShell_Navigation_TextColor, sapTile_Background, sapTile_TextColor, and sapTile_TitleTextColor

Bug Fixes

• Translations for de, fr, ja, pt, ru and zh_CH updated

Features

• New shadow parameters for fields: sapField_Shadow, sapField_InvalidShadow, sapField_WarningShadow, sapField_SuccessShadow, sapField_InformationShadow, sapField_Hover_Shadow, sapField_Hover_InvalidShadow, sapField_Hover_WarningShadow, sapField_Hover_SuccessShadow, and sapField_Hover_InformationShadow
• New text-decoration parameters for links: sapLink_TextDecoration, sapLink_Hover_TextDecoration and sapLink_Active_TextDecoration
• New generic hover parameter sapHoverColor
• Completion of the sapIndicationColor set: two new indication colors 9 and 10, and 8 new parameters per indication color: sapIndicationColor_X_Active_BorderColor, sapIndicationColor_X_Active_TextColor, sapIndicationColor_X_Selected_Background, sapIndicationColor_X_Selected_BorderColor, sapIndicationColor_X_Selected_TextColor, sapIndicationColor_Xb (b being a "less prominent" shade of the color), sapIndicationColor_Xb_BorderColor and sapIndicationColor_Xb_Hover_Background
• SAP-icons-TNT v3.1 (Horizon-family) and v2.6 (non-Horizon) with new icons e104 (build-apps), e105 (build-work-zone) and e106 (build-process-automation)

Bug Fixes

• SAPGUI-icons s_cloudd, s_cloudu, s_cloudx and SAPWeb-icons Cloud, CloudDownload and CloudUpload are available in Bluecrystal again
• sapContent_ContrastTextThreshold is adjusted in Evening Horizon, to have all contrast()-Statements resolve to the expected color

This is the first release where we properly exercise SemVer. And as there are new (backwards-compatible) features, the version is 11.2.0 (and not 11.1.50).

Features

• SAP-icons-TNT v3.0 (Horizon-family) and v2.5 (non-Horizon) with dedicated codeline (v3) for the Horizon family
• BusinessSuiteInAppSymbols v2.083 (Horizon-family) and v1.083 (non-Horizon) with new icons e17b (max-container), e17c (max-interval), e17d (min-interval), e17e (cross-order), e17f (empty-order), e180 (cross-sequence), e181 (empty-sequence), e182 (cross-union), e183 (empty-union) and e184 (cross-target)

Bug fixes

• sapButton_Active_Background is lightened to no more than 100% lightness in Morning Horizon

Features

• Parameters used by SAP Mobile Start have the Tag "Mobile" (see Themes for Custom Corporate Branding)
• There is a separate "Mobile" Guide for parameters used by SAP Mobile Start in themes of the Horizon family
• SAPGUI-icons v9.0 with new icon helpf4_s in themes of the Horizon, Quartz, and Belize family, and new icons overflw_l and overflw_r in Bluecrystal
• Parameter type, category, protection and deprecation are expressed as standalone annotations in addition to tags; their tags will no longer be updated (!) but stay for compatibility reasons
• SAP-icons v5.04 and v4.16 with new icons e306 (biometric-thumb), e307 (biometric-face), e308 (select-appointments), e309 (light-mode), e30a (dark-mode) and e30b (select-appointments)
• In the build result, themes are available as a design-token.json in each theme except sap_belize_plus
• BusinessSuiteInAppSymbols v2.082 and v1.082 with new icons e173 (monitor-assembly-sequence), e174 (monitor-just-in-time-calls), e175 (manage-charging-stations), e176 (district-heating), e177 (producer-switch), e178 (consumer-switch), e179 (storage-switch) and e17a (repeatable)

Bug fixes

• SAPGUI-icons v9.0 and SAPWeb-icons v9.0 with lots of design- and color changes to existing icons
• Translations for de, en, en_US_saptrc, fr, ja, pt, ru and zh_CH updated
• SAP-icons v5.04 and v4.16 with updated icons e061 (batch-payments), e065 (favorite), e085 (contacts), e09f (pushpin-on), e0a0 (pushpin-off), e0a1 (unfavorite), e0a7 (share), e0fe (step), e114 (crm-sales), and e115 (widgets)
• sapSlider_Hover_RangeHandleBackground is mapped to sapSlider_Hover_HandleBackground in themes of the Horizon and Quartz families, to be consistent with the interaction states of the normal slider
• sapInformativeTextColor is darkened a tiny bit in Morning Horizon, to improve the accessibility/contrast against the application background
• sapContent_Selected_TextColor, sapContent_Selected_ForegroundColor and sapShell_Navigation_Selected_TextColor are darkened a tiny bit in Morning Horizon, to improve the accessibility/contrast against the application background
• sapContent_Shadow0 is less transparent in Evening Horizon, to improve the visibility on Cards
• sapContent_Illustrative_Color4, …6 and …8 are updated to improve the accessibility/contrast in illustrations
• sapButton_Emphasized_TextColor is lightened in Evening Horizon and Quartz Dark to make it more outstanding
• sapSlider_Active_HandleBorderColor is mapped to sapHighlightColor in Morning and Evening Horizon

Features

• 72Blackfull has its own @font-face definition

Bug fixes

• sapChart_OrderedColor_1, …2, …3, …5, …6, …10, …11, sapChart_Critical and …Good satisfy contrast-ratio accessibility requirements in Horizon, Quartz and Belize
• sapFontBlackFamily references 72Blackfull in its font stack
• sapCriticalTextColor satisfies contrast-ratio accessibility requirements in Quartz Light
• only the combined SVG icon libraries are included in the theming-base-content, not every single SVG icon

Bug fixes

• package.json contains a main instead of exports again (so that direct imports of files are allowed again)

Bug fixes

• package.json contains actual version again (was ${project.version})

Features

• SAP-icons v5.03 and v4.15 with new icons e1b1 (locate-me), e302 (locate-me-2), e303 (map-2), e304

Bug fixes

• SAP-icons v5.03 and v4.15 with updated icons e075 (flight), e007 (travel-expense), e133 (travel-iternary), e03b (doc-attachment), e131 (travel-request) and a lot of pixel alignment fixes

Known Issues

• set version in package.json to ${project.version}
• introduced exports in package.json (with the intent to provide module/commonjs-specific exports) which prohibited directly importing files

Features

• BusinessSuiteInAppSymbols v1.080/v2.080 with icon e172 (cell-lock)

Bug Fixes

• Newly introduced incorrect parameter tag "Shell Category" replaced by existing tag "Shell"
• Translations for de, en, fr, ja, pt, ru and zh_CN updated

Features

• BusinessSuiteInAppSymbols v2.079 (Horizon-family) and v1.079 (non-Horizon) with new icons e169 (move-folder), e16a (remove-folder), e16b (match-case), e16c (match-whole-word), e16d (remove-total), e16e (after-total), e16f (before-total), e170 (workbook-filter) and e171 (icon-update-filter)

Bug Fixes

• Opacity of sapContent_Shadow1..3 increased in Morning Horizon to meet contrast criteria
• Translations for de, en, en_US_saptrc, fr, ja, pt, ru and zh_CN updated

Features

• SAP-icons v5.02 and v4.14 with new icons e29c (slider), e29d (binary), e29e (female), e29f (male), e300 (male and female), and e301 (rotate)
• Full versions of the 72 font in italic, bold italic, condensed, bold condensed and black are exposed as sapFontUrl_72_* parameters
• Improved Quick Theming for Morning and Evening Horizon

Bug Fixes

• SAP-icons v5.02 and v4.14 with updated icons e0e0 (provision) and e26f (away)
• Missing translation keys GUIDE_SECTION_MAINBACKGROUNDS, GUIDE_SECTION_MAINBACKGROUNDS_DESCR, GUIDE_SECTION_MAINFOREGROUNDS, and GUIDE_SECTION_MAINFORGROUNDS_DESCR added to Quartz HC and Horizon HC themes

Features

• BusinessSuiteInAppSymbols v1.078 with new icon e168 (icon-layer)

Bug Fixes

• @font-face definitions reference URL parameters first, use local() only as fallback. With that, we regain control about the font versions used. Set cache-control headers properly to avoid unnecessarily frequent requests.
• sapPageFooter_BorderColor is mapped to sapHC_StandardForeground in Horizon-based High Contrast Black and High Contrast White

Bug Fixes

• sapContent_ContrastFocusColor is #000 in Evening Horizon
• sapContent_BusyColor is mapped to sapHighlightColor in Morning and Evening Horizon
• 72 font no longer contains the kern value for the tabular figure that caused font-variant-numeric: tabular-nums to stop working
• Translations for fr, ja, pt, ru, zh_CN updated

Bug Fixes

• Revert 72 font to pre-11.1.36 for font-variant-numeric: tabular-nums
• Translations for de, en, en_US_saptrc, fr, ja, pt, ru, zh_CN updated
• Theme set sap_fiori_3_set added to delivery packages

Features

• Themes of the Horizon family can be used as the basis for custom themes, most parameters introduced with 11.1.36 can be custom-themed
• Detailed guides for themes of the Horizon family help in creating custom themes
• --sapField_ReadOnly_BackgroundStyle completes the background style parameters for fields and allows for dashed bottom borders in Morning and Evening Horizon
• --sapField_ReadOnly_BorderStyle allows to switch to a dashed four-sided border in Morning and Evening Horizon

Bug Fixes

• Correct traffic light icons for Belize, Quartz and Horizon
• --sapProgress_*BorderColor mapped to --sapProgress_BorderColor in themes older than Horizon
• --sapField_*BorderStyle mapped to none in Morning and Evening Horizon
• Translations for de, en, en_US_saptrc, fr, ja, pt, ru, zh_CN updated
• Border colors of --sapProgress_Value states mapped to respective backgrounds
• --sapShell_Navigation_Selected_TextColor mapped to --sapHighlightColor via contrast statement in Morning and Evening Horizon
• Colors of the --sapLink namespace ensure the necessary contrast in Morning Horizon
• 56 SVG icons for the SAPGUI-icons library in Bluecrystal added that were removed with 11.1.36
• --sapPrimary6 and --sapField_TextColor ensure the necessary contrast in Morning Horizon
• --sapIndicationColor_3* now passes 3:1 contrast in Morning and Evening Horizon
• --sapField_InformationBackgroundStyle now uses less parameter interpolation for the color stops instead of incorrect verbatim literals (@{sapField_InformationBackground} instead of @sapField_InformationBackground) in Morning Horizon

Features

• A lot of new SVG icons for the SAPGUI-Icons and SAPWeb-Icons libraries
• A lot of new protected parameters for all themes, especially to the namespaces --sapAvatar*, --sapButton_Track*, --sapButton_Handle*, --sapField_*BackgroundStyle, --sapField_*BorderStyle, --sapMessage*, --sapProgress* --sapSlider*, --sapObjectHeader* and --sapIndicationColor*
• --sapContent_ForcedColorAdjust to toggle an OS high contrast mode overwrite
• A semi bold font as --sapFontSemiboldFamily and --sapFontSemiboldDuplexFamily
• Theme set sap_horizon_set describes the whole SAP Horizon family
• BusinessSuiteInAppSymbols v1.077 with new icon sap-icon://BusinessSuiteInAppSymbols/icon-unknown-dependency

Bug Fixes

• --sapLegend_NonWorkingBackground ensures the necessary contrast in all HC themes
• --sapContent_HeaderShadow and --sapShell_Shadow solve an issue with their Y-axis
• --sapButton_Attention_Active_BorderColor ensures the necessary contrast in SAP Horizon
• --sapField_BorderWidth, --sapField_ReadOnly_BorderColor and --sapField_SuccessBorderWidth ensure distinguishability of default, read-only and success fields in Horizon and Quartz HC themes
• --sapChart_OrderedColor_7 and --sapChart_OrderedColor_8 now ensure a 4.5:1 contrast in HCB themes

With version 11.1.35 we complete the SAP Horizon theme family:

• the default, "light" theme "Morning Horizon for SAP Fiori" labeled "SAP Horizon (experimental)" with the technical ID sap_horizon,
• the "dark" version "Evening Horizon for SAP Fiori" labeled "SAP Evening Horizon (experimental)" with the technical ID sap_horizon_dark,
• the high-contrast-black version with the technical ID sap_horizon_hcb, and
• the high-contrast-white version with the technical ID sap_horizon_hcw

The SAP Horizon theme family is not released for customers yet and it is not yet possible to created custom themes based on those themes with the SAP UI Theme Designer.

Version 11.1.35 adds values for existing theming parameters. SAP Design plans to introduce new theming parameters for the SAP Horizon theme family. They will be released with version 11.1.36 of the theming-base-content.

Additionally, version 11.1.35 adresses #8 and removes the @font-face definitions in sap_belize_plus/css_variables.css.

version 11.1.34

• SAP themes SAP Quartz High Contrast Black and SAP Quartz High Contrast White are released for theming. You can now create a custom theme based on these themes.
• The full set of the 72 Font Family is now available in theming-base-content and can be used in UI theme designer. See https://experience.sap.com/72/#section6 for information.
• A new parameter sapFontBlackFamily is available.

version 11.1.31

To simplify code and resource maintenance in theming-base-content framework, following fonts were moved to theme-folder baseTheme/fonts with version 11.1.30:

• 72*
• SAP-icons-TNT*
• BusinessSuiteInAppSymbols*
• SAP-icons*

If you consume fonts from theming-base-content, please make sure to use the fonts parameter and not its location.

version 11.1.29

version 11.1.28

version 11.1.27

version 11.1.26

version 11.1.24

version 11.1.23

version 11.1.22

version 11.1.21

version 11.1.20

version 11.1.19

version 11.1.18

version 11.1.17

version 11.1.16

version 11.1.15

version 11.1.14

version 11.1.13

version 11.1.12

version 11.1.11

version 11.1.10

version 11.1.9