@openui5/themelib_sap_horizon 1.117.1 → 1.119.0

package/THIRDPARTY.txt

@@ -401,7 +401,7 @@ License: MIT
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/MIT.txt
 Contained in: src/sap.ui.integration/src/sap/ui/integration/thirdparty/adaptive-expressions.js
 
-Component: Markdown-it, version: 12.2.0
+Component: Markdown-it, version: 12.3.2
 Copyright: 2014 Vitaly Puzrin, Alex Kocharin
 License: MIT
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/MIT.txt
@@ -466,7 +466,7 @@ License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
 Contained in: lib/jsdoc/ui5/plugin.js
 
-Component: SAP Theming Base Content, version: 11.4.2
+Component: SAP Theming Base Content, version: 11.6.8
 Copyright: SAP SE or an SAP affiliate company and Theming Base Content contributors
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/themelib_sap_horizon",
-  "version": "1.117.1",
+  "version": "1.119.0",
   "description": "OpenUI5 Theme Library sap_horizon",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -14,22 +14,22 @@
     "url": "https://github.com/SAP/openui5.git"
   },
   "devDependencies": {
-    "@openui5/sap.f": "1.117.1",
-    "@openui5/sap.m": "1.117.1",
-    "@openui5/sap.tnt": "1.117.1",
-    "@openui5/sap.ui.codeeditor": "1.117.1",
-    "@openui5/sap.ui.commons": "1.117.1",
-    "@openui5/sap.ui.core": "1.117.1",
-    "@openui5/sap.ui.dt": "1.117.1",
-    "@openui5/sap.ui.fl": "1.117.1",
-    "@openui5/sap.ui.mdc": "1.117.1",
-    "@openui5/sap.ui.integration": "1.117.1",
-    "@openui5/sap.ui.layout": "1.117.1",
-    "@openui5/sap.ui.rta": "1.117.1",
-    "@openui5/sap.ui.suite": "1.117.1",
-    "@openui5/sap.ui.table": "1.117.1",
-    "@openui5/sap.ui.unified": "1.117.1",
-    "@openui5/sap.ui.ux3": "1.117.1",
-    "@openui5/sap.uxap": "1.117.1"
+    "@openui5/sap.f": "1.119.0",
+    "@openui5/sap.m": "1.119.0",
+    "@openui5/sap.tnt": "1.119.0",
+    "@openui5/sap.ui.codeeditor": "1.119.0",
+    "@openui5/sap.ui.commons": "1.119.0",
+    "@openui5/sap.ui.core": "1.119.0",
+    "@openui5/sap.ui.dt": "1.119.0",
+    "@openui5/sap.ui.fl": "1.119.0",
+    "@openui5/sap.ui.mdc": "1.119.0",
+    "@openui5/sap.ui.integration": "1.119.0",
+    "@openui5/sap.ui.layout": "1.119.0",
+    "@openui5/sap.ui.rta": "1.119.0",
+    "@openui5/sap.ui.suite": "1.119.0",
+    "@openui5/sap.ui.table": "1.119.0",
+    "@openui5/sap.ui.unified": "1.119.0",
+    "@openui5/sap.ui.ux3": "1.119.0",
+    "@openui5/sap.uxap": "1.119.0"
   }
 }

package/src/sap/f/themes/sap_horizon/AvatarGroup.less

@@ -1,43 +1,99 @@
-/* ============================= */
-/* CSS for control sap.f/AvatarGroup  */
-/* Horizon theme                 */
-/* ============================= */
+/* ===================================== */
+/* CSS for control sap.f/AvatarGroup	 */
+/* Horizon theme            	 		 */
+/* ===================================== */
 
+.applyBorderColorAccent(@counter) when (@counter > 0) {
+	.sapFAvatar.sapFAvatarColorAccent@{counter} {
+		border: 0.0625rem solid~"@{sapUiAccent@{counter}}";
+	}
 
-/* ============================= */
-/* CSS for control sap.f/AvatarGroup  */
-/* Base theme                    */
-/* ============================= */
-
-.sapFAvatarGroup:focus {
-	box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
-	outline: none;
-	border-radius: 0.35rem;
+	.applyBorderColorAccent(@counter - 1);
 }
 
 .sapFAvatarGroup {
 	padding: 0.125rem;
-}
 
-.sapFAvatarGroupIndividual {
+	.sapFAvatar {
+		border: none;
+	}
 
-	.sapFAvatarGroupItem:focus {
+	&:focus {
+		box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
 		outline: none;
-		.sapFAvatar  {
-			outline: none;
-			box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
+		border-radius: 0.35rem;
+	}
+
+	&.sapFAvatarGroupIndividual {
+		.sapFAvatarGroupItem {
+
+			&:hover:not(:active):not(:focus) {
+				.applyBorderColorAccent(10)
+			}
+
+			&:active {
+				.sapFAvatar {
+					background-color: @sapUiButtonActiveBackground;
+
+					.sapFAvatarInitialsHolder {
+						color: @sapUiButtonActiveTextColor;
+					}
+				}
+			}
+
+			&:focus {
+				outline: none;
+
+				.sapFAvatar {
+					outline: none;
+					box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
+				}
+			}
+
 		}
 	}
+
+	&.sapFAvatarGroupGroup {
+		&:hover:not(:active) {
+			.sapFAvatarGroupItem {
+				.applyBorderColorAccent(10);
+			}
+		}
+
+		&:active {
+			.sapFAvatarGroupItem {
+				.sapFAvatar {
+					border: 0.0625rem solid @sapUiButtonActiveBorderColor;
+					background-color: @sapUiButtonActiveBackground;
+
+					.sapFAvatarInitialsHolder {
+						color: @sapUiButtonActiveTextColor;
+					}
+				}
+			}
+
+			.sapFAvatarGroupMoreButton {
+				.sapMBtnInner {
+					background-color: @sapUiButtonActiveBackground;
+					border: 0.0625rem solid @sapUiButtonActiveBorderColor;
+
+					.sapMBtnContent {
+						color: @sapUiButtonActiveTextColor;
+					}
+				}
+			}
+		}
+	}
+}
+
+.sapFAvatarGroupPopover .sapFCard {
+	border-radius: 0;
 }
 
-html.sap-desktop .sapFAvatarGroupMoreButton.sapMBtn:focus > .sapMFocusable:not(.sapMBadgeIndicator):before {
+html.sap-desktop .sapFAvatarGroupMoreButton.sapMBtn:focus>.sapMFocusable:not(.sapMBadgeIndicator):before {
 	border-radius: 50%;
 	left: 0;
 	right: 0;
 	top: 0;
 	bottom: 0;
-}
-
-.sapFAvatarGroupPopover .sapFCard {
-	border-radius: 0;
-}
+}

package/src/sap/f/themes/sap_horizon/DynamicPageTitle.less

@@ -87,7 +87,7 @@
 
 .sapFDynamicPageTitleMain>.sapFDynamicPageTitleMainInner .sapFDynamicPageTitleMainHeading .sapFDynamicPageTitleMainHeadingInner .sapMTitle:not(.sapUICompVarMngmtTitle) {
 	font-size: @sapObjectHeader_Title_FontSize;
-	font-family: @sapFontBlackFamily;
+	font-family: @sapObjectHeader_Title_FontFamily;
 }
 
 
@@ -95,7 +95,7 @@
 
 .sapFDynamicPage-Std-Phone .sapFDynamicPageTitleMain>.sapFDynamicPageTitleMainInner .sapFDynamicPageTitleMainHeading .sapFDynamicPageTitleMainHeadingInner .sapMTitle:not(.sapUICompVarMngmtTitle) {
 	font-size: @sapObjectHeader_Title_SnappedFontSize;
-	font-family: @sapFontBlackFamily;
+	font-family: @sapObjectHeader_Title_FontFamily;
 }
 
 
@@ -103,7 +103,7 @@
 
 .sapFDynamicPageTitleSnapped .sapFDynamicPageTitleMain>.sapFDynamicPageTitleMainInner .sapFDynamicPageTitleMainHeading .sapFDynamicPageTitleMainHeadingInner .sapMTitle:not(.sapUICompVarMngmtTitle) {
 	font-size: @sapObjectHeader_Title_SnappedFontSize;
-	font-family: @sapFontBlackFamily;
+	font-family: @sapObjectHeader_Title_FontFamily;
 }
 
 // Overview Page using Dynamic page Header

package/src/sap/f/themes/sap_horizon/ShellBar.less

@@ -54,7 +54,8 @@
 			stop-opacity: 0.2;
 		}
 		&:focus {
-			outline: none;
+			outline: @sapUiContentFocusWidth solid @sapUiContentFocusColor;
+			border-radius: 0.375rem;
 			background-color: @sapUiShellActiveBackground;
 			color: @sapUiShellActiveTextColor;
 			&:after {

package/src/sap/f/themes/sap_horizon/SidePanel.less

@@ -3,7 +3,14 @@
 /* Horizon theme                   */
 /* =============================== */
 
+@_sap_ui_layout_Splitter_BarDecorationColors: @sapUiGroupContentBorderColor, transparent;
+
 .sapFSP {
+	.sapFSPSplitterBar {
+		.sapFSPSplitterBarGripIcon {
+			color: @sapUiButtonLiteTextColor;
+		}
+	}
 	.sapFSPSide {
 		.sapFSPSideInner {
 			.sapFSPActionBar {

package/src/sap/f/themes/sap_horizon_dark/AvatarGroup.less

@@ -1,42 +1,99 @@
-/* ================================== */
-/* CSS for control sap.f/AvatarGroup  */
-/* Evening Horizon theme              */
-/* ================================== */
-
-.sapFAvatarGroup:focus {
-	box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
-	outline: none;
-	border-radius: 0.35rem;
+/* ===================================== */
+/* CSS for control sap.f/AvatarGroup	 */
+/* Evening Horizon theme            	 */
+/* ===================================== */
+
+.applyBorderColorAccent(@counter) when (@counter > 0) {
+	.sapFAvatar.sapFAvatarColorAccent@{counter} {
+		border: 0.0625rem solid~"@{sapUiAccent@{counter}}";
+	}
+
+	.applyBorderColorAccent(@counter - 1);
 }
 
 .sapFAvatarGroup {
 	padding: 0.125rem;
-}
 
-.sapFAvatarGroupIndividual {
+	.sapFAvatar {
+		border: none;
+	}
 
-	.sapFAvatarGroupItem:focus {
+	&:focus {
+		box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
 		outline: none;
-		.sapFAvatar  {
-			outline: none;
-			box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
+		border-radius: 0.35rem;
+	}
+
+	&.sapFAvatarGroupIndividual {
+		.sapFAvatarGroupItem {
+
+			&:hover:not(:active):not(:focus) {
+				.applyBorderColorAccent(10)
+			}
+
+			&:active {
+				.sapFAvatar {
+					background-color: @sapUiButtonActiveBackground;
+
+					.sapFAvatarInitialsHolder {
+						color: @sapUiButtonActiveTextColor;
+					}
+				}
+			}
+
+			&:focus {
+				outline: none;
+
+				.sapFAvatar {
+					outline: none;
+					box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
+				}
+			}
+
 		}
 	}
-}
 
-html.sap-desktop .sapFAvatarGroupMoreButton.sapMBtn:focus > .sapMFocusable:not(.sapMBadgeIndicator):before {
-	border-radius: 50%;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0;
-}
+	&.sapFAvatarGroupGroup {
+		&:hover:not(:active) {
+			.sapFAvatarGroupItem {
+				.applyBorderColorAccent(10);
+			}
+		}
+
+		&:active {
+			.sapFAvatarGroupItem {
+				.sapFAvatar {
+					border: 0.0625rem solid @sapUiButtonActiveBorderColor;
+					background-color: @sapUiButtonActiveBackground;
 
+					.sapFAvatarInitialsHolder {
+						color: @sapUiButtonActiveTextColor;
+					}
+				}
+			}
 
-html.sap-desktop .sapFAvatarGroupMoreButton.sapMBtn:focus > .sapMBtnActive.sapMFocusable {
-	border-color: transparent;
+			.sapFAvatarGroupMoreButton {
+				.sapMBtnInner {
+					background-color: @sapUiButtonActiveBackground;
+					border: 0.0625rem solid @sapUiButtonActiveBorderColor;
+
+					.sapMBtnContent {
+						color: @sapUiButtonActiveTextColor;
+					}
+				}
+			}
+		}
+	}
 }
 
 .sapFAvatarGroupPopover .sapFCard {
 	border-radius: 0;
+}
+
+html.sap-desktop .sapFAvatarGroupMoreButton.sapMBtn:focus>.sapMFocusable:not(.sapMBadgeIndicator):before {
+	border-radius: 50%;
+	left: 0;
+	right: 0;
+	top: 0;
+	bottom: 0;
 }

package/src/sap/f/themes/sap_horizon_dark/DynamicPageTitle.less

@@ -86,7 +86,7 @@
 
 .sapFDynamicPageTitleMain>.sapFDynamicPageTitleMainInner .sapFDynamicPageTitleMainHeading .sapFDynamicPageTitleMainHeadingInner .sapMTitle:not(.sapUICompVarMngmtTitle) {
 	font-size: @sapObjectHeader_Title_FontSize;
-	font-family: @sapFontBlackFamily;
+	font-family: @sapObjectHeader_Title_FontFamily;
 }
 
 
@@ -94,7 +94,7 @@
 
 .sapFDynamicPage-Std-Phone .sapFDynamicPageTitleMain>.sapFDynamicPageTitleMainInner .sapFDynamicPageTitleMainHeading .sapFDynamicPageTitleMainHeadingInner .sapMTitle:not(.sapUICompVarMngmtTitle) {
 	font-size: @sapObjectHeader_Title_SnappedFontSize;
-	font-family: @sapFontBlackFamily;
+	font-family: @sapObjectHeader_Title_FontFamily;
 }
 
 
@@ -102,7 +102,7 @@
 
 .sapFDynamicPageTitleSnapped .sapFDynamicPageTitleMain>.sapFDynamicPageTitleMainInner .sapFDynamicPageTitleMainHeading .sapFDynamicPageTitleMainHeadingInner .sapMTitle:not(.sapUICompVarMngmtTitle) {
 	font-size: @sapObjectHeader_Title_SnappedFontSize;
-	font-family: @sapFontBlackFamily;
+	font-family: @sapObjectHeader_Title_FontFamily;
 }
 
 // Overview Page using Dynamic page Header

package/src/sap/f/themes/sap_horizon_dark/ShellBar.less

@@ -54,8 +54,8 @@
 			stop-opacity: 0.2;
 		}
 		&:focus {
-			outline: none;
-			background-color: @sapUiShellActiveBackground;
+			outline: @sapUiContentFocusWidth solid @sapUiContentFocusColor;
+			border-radius: 0.375rem;
 			color: @sapUiShellActiveTextColor;
 			&:after {
 				box-shadow: @sapUiContentSelectedShadow;

package/src/sap/f/themes/sap_horizon_dark/SidePanel.less

@@ -3,7 +3,14 @@
 /* Evening Horizon theme           */
 /* =============================== */
 
+@_sap_ui_layout_Splitter_BarDecorationColors: @sapUiGroupContentBorderColor, transparent;
+
 .sapFSP {
+	.sapFSPSplitterBar {
+		.sapFSPSplitterBarGripIcon {
+			color:@sapUiButtonLiteTextColor;
+		}
+	}
 	.sapFSPSide {
 		.sapFSPSideInner {
 			.sapFSPActionBar {

package/src/sap/f/themes/sap_horizon_hcb/SidePanel.less

@@ -3,7 +3,17 @@
 /* Horizon High Contrast Black theme */
 /* ================================= */
 
+@_sap_ui_layout_Splitter_BarDecorationColors: @sapUiObjectHeaderBorderColor, fade(@sapUiObjectHeaderBorderColor, 0);
+@_sap_ui_layout_Splitter_BarActiveDecorationColors: @sapUiObjectHeaderBorderColor, @sapUiObjectHeaderBorderColor;
+
 .sapFSP {
+	.sapFSPSplitterBar {
+		&:hover {
+			.sapFSPSplitterBarGripIcon {
+				background: @sapUiHighlight;
+			}
+		}
+	}
 	.sapFSPSide {
 		.sapFSPSideInner {
 			border: 0.0625rem solid @sapUiGroupContentBorderColor;

package/src/sap/f/themes/sap_horizon_hcw/SidePanel.less

@@ -3,7 +3,17 @@
 /* Horizon High Contrast White theme */
 /* ================================= */
 
+@_sap_ui_layout_Splitter_BarDecorationColors: @sapUiObjectHeaderBorderColor, fade(@sapUiObjectHeaderBorderColor, 0);
+@_sap_ui_layout_Splitter_BarActiveDecorationColors: @sapUiObjectHeaderBorderColor, @sapUiObjectHeaderBorderColor;
+
 .sapFSP {
+	.sapFSPSplitterBar {
+		&:hover {
+			.sapFSPSplitterBarGripIcon {
+				background: @sapUiHighlight;
+			}
+		}
+	}
 	.sapFSPSide {
 		.sapFSPSideInner {
 			border: 0.0625rem solid @sapUiGroupContentBorderColor;

package/src/sap/m/themes/sap_horizon/BusyIndicator.less

@@ -5,11 +5,11 @@
 
 /* Background animation element */
 .sapUiLocalBusyIndicatorAnimation > div::before {
-	background: @sapUiBrand;
+	background: @sapUiContentBusyColor;
 	animation-duration: 0ms;
 }
 
 /* Shadow animation element */
 .sapUiLocalBusyIndicatorAnimation > div::after {
-	box-shadow: inset 0px 0px 0px 0px @sapUiBrand;
+	box-shadow: inset 0px 0px 0px 0px @sapUiContentBusyColor;
 }

package/src/sap/m/themes/sap_horizon/Button.less

@@ -35,7 +35,7 @@ span.sapMBtnInner.sapMBtnEmphasized {
 /* --------------------- */
 .sapMBtnInner {
 	font-size: @sapMFontMediumSize;
-	height: 2.25rem;
+	height: @sapUiElementHeight;
 	min-width: 2.25rem;
 	margin: 0;
 	padding: 0;
@@ -185,6 +185,10 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnNeutral.sapMFocusable:not(.sapMBadgeIn
 	border-color: @sapUiButtonLiteBorderColor;
 }
 
+.sapMBtn .sapMBtnNeutral.sapMBtnInner {
+	text-shadow: @sapUiContentTextShadow;
+}
+
 /* ---------------------------------------------------------------------*/
 /* Disabled, hover and active states:                                   */
 /* ---------------------------------------------------------------------*/
@@ -285,31 +289,6 @@ html.sap-desktop .sapMFooter-CTX .sapMBtnInner.sapMBtnReject {
 	color: @sapUiButtonLiteTextColor;
 }
 
-// box shadow on hover
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive) {
-	box-shadow: @sapContent_Interaction_Shadow;
-}
-
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnEmphasized,
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnSuccess,
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnNegative,
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnNeutral,
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnCritical {
-	box-shadow: none;
-}
-
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnAccept {
-	box-shadow: @sapContent_Positive_Shadow;
-}
-
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnReject {
-	box-shadow: @sapContent_Negative_Shadow;
-}
-
-.sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnAttention {
-	box-shadow: @sapContent_Critical_Shadow;
-}
-
 /* ----------------------*/
 /* Badges                */
 /* ----------------------*/
@@ -320,4 +299,12 @@ html.sap-desktop .sapMFooter-CTX .sapMBtnInner.sapMBtnReject {
 	color: @sapContent_BadgeTextColor;
 	font-size: @sapFontSmallSize;
 	text-align: center;
+}
+
+.sapMBtn:hover > .sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed),
+.sapMIBar-CTX .sapMBtn:hover > .sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed) {
+
+	bdi {
+		color: @sapUiButtonLiteHoverTextColor;
+	}
 }

package/src/sap/m/themes/sap_horizon/GenericTile.less

@@ -22,6 +22,43 @@
 	}
 }
 
+.sapMGTTInfoContainer {
+	height: 2.5rem;
+}
+.tileWithAppInfo{
+	.sapMGTTInfo{
+		padding: 0.125rem 1rem 0.125rem 0.25rem;
+		text-transform: uppercase;
+		margin-bottom: 0.7rem;
+		border-radius: 0.125rem 0 0 0.125rem;
+		background-color: @sapInfobar_NonInteractive_Background;
+		width: fit-content;
+		.sapMText{
+			font-size: @sapMFontSmallSize ;
+			text-align: right !important;
+		}
+		.sapMGTSystemInfoText{
+			display: flex;
+			justify-content: flex-end;
+			.sapMText {
+				color: @sapUiTileTitleTextColor;
+				padding-left: 0.15rem;
+			}
+		}
+		.sapMGTAppAndSystemInfoDivider{
+			height: 0.25rem;
+		}
+		.sapMGTAppShortcutText {
+			display: flex;
+			justify-content: flex-end;
+			.sapMText {
+				color: @sapUiTileTextColor;
+			}
+		}
+	
+	}
+}
+
 .sapMGT.sapMGTScopeActions:not(.sapMGTStateLoading){
 	.sapMTileCntContent{
 		&:after{