@openui5/themelib_sap_horizon 1.133.2 → 1.135.0

package/src/sap/m/themes/sap_horizon_hcb/Avatar.less

@@ -39,6 +39,7 @@
 .sapFAvatarColorTileIcon {
 	background-color: var(--sapTile_Background);
 	color: var(--sapTile_IconColor);
+	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
 
 	.sapFAvatarInitialsHolder {
 		color: currentColor;
@@ -48,21 +49,34 @@
 .sapFAvatarColorPlaceholder {
 	background-color: var(--sapContent_ImagePlaceholderBackground);
 	color: var(--sapContent_ImagePlaceholderForegroundColor);
+	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
+
 
 	.sapFAvatarInitialsHolder {
 		color: currentColor;
 	}
 }
 
+.sapFAvatarColorTransparent {
+	background-color: var(--sapAvatar_Lite_Background);
+	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
+}
+
 .generateColor (@accentIndex) {
 	@css-selector: ~"sapFAvatarColorAccent@{accentIndex}"; // Create the css selector string
 	@background-param: ~"sapUiAvatar@{accentIndex}Background"; // Build the color param which is a sapUiAccent
 	@color-param: ~"sapUiAvatar@{accentIndex}TextColor";
+	@hover-color: ~"sapUiAvatar@{accentIndex}HoverBackground";
 
 	// Build the real CSS selector.
 	// The output would be something like this: .sapFAvatar.sapFAvatarColorAccent6 {background-color: #0092d1;}
 	.@{css-selector} {
 		background-color: @@background-param;
+		&.sapFAvatarImage.sapFAvatarFocusable:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover,
+		&.sapFAvatarFocusable:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover {
+			background-color: @@hover-color;
+			box-shadow: @_sap_m_Avatar_Hover_Box_Shadow_Offset var(--sapAvatar_Hover_BorderColor);
+		}
 	}
 
 	.@{css-selector}.sapFAvatarIcon,

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

@@ -146,15 +146,22 @@
 /* Custom focus outline:                                                */
 /* ---------------------------------------------------------------------*/
 
+.sapMBtn:focus-visible > .sapMFocusable,
 html.sap-desktop .sapMBtn:focus > .sapMFocusable {
 	outline: var(--sapContent_FocusWidth) dotted var(--sapContent_FocusColor);
 	outline-offset: -0.25rem;
 }
 
+.sapMBtn:focus-visible > .sapMFocusable,
 html.sap-desktop .sapMBtn:focus > .sapMBtnActive.sapMFocusable {
 	outline-color: var(--sapContent_ContrastFocusColor);
 }
 
+.sapMBtn:focus-visible > .sapMBtnEmphasized.sapMFocusable,
+.sapMBtn:focus-visible > .sapMBtnCritical.sapMFocusable,
+.sapMBtn:focus-visible > .sapMBtnNegative.sapMFocusable,
+.sapMBtn:focus-visible > .sapMBtnSuccess.sapMFocusable,
+.sapMBtn:focus-visible > .sapMBtnNeutral.sapMFocusable,
 html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMFocusable,
 html.sap-desktop .sapMBtn:focus > .sapMBtnCritical.sapMFocusable,
 html.sap-desktop .sapMBtn:focus > .sapMBtnNegative.sapMFocusable,
@@ -163,6 +170,7 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnNeutral.sapMFocusable {
 	outline-color: var(--sapContent_ContrastFocusColor);
 }
 
+.sapMBtn:focus-visible > .sapMBtnActive.sapMBtnEmphasized.sapMFocusable,
 html.sap-desktop .sapMBtn:focus > .sapMBtnActive.sapMBtnEmphasized.sapMFocusable {
 	outline-color: var(--sapContent_ContrastFocusColor);
 }

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

@@ -4,7 +4,6 @@
 /* ================================== */
 
 .sapMGT {
-	border-radius: 0.125rem;
 	box-shadow: none;
 }
 
@@ -17,10 +16,6 @@
 	border-radius: 0.125rem;
 }
 
-.sapMGTOverlay {
-	background-color: fade(@sapUiBlockLayerBackground, 70);
-}
-
 /* LINE MODE LIST VIEW */
 
 .sapMGT.sapMGTLineMode {
@@ -154,10 +149,6 @@
 	color: var(--sapTile_TextColor);
 }
 
-.sapMGTOverlay {
-	opacity: 1;
-}
-
 .sapMGT.sapMGTBackgroundImage {
 
 	.sapMGTOverlay {

package/src/sap/m/themes/sap_horizon_hcb/IconTabBar.less

@@ -7,7 +7,6 @@
 /* Variables overriding */
 /* ========================================================================== */
 
-@_sap_m_IconTabBar_TextColor: var(--sapContent_LabelColor);
 @_sap_m_IconTabBar_TextShadow: none;
 @_sap_m_IconTabBar_HeaderFocusBorderTopOffset: -1px;
 @_sap_m_IconTabBar_HeaderFocusBorderBottomOffset: -1px;
@@ -18,7 +17,6 @@
 /* ==================== Cozy size ==================== */
 
 /* Content arrow */
-@_sap_m_IconTabBar_ContentArrowBorderWidth: 0.313rem;
 @_sap_m_IconTabBar_ContentArrowHeight: 0.875rem;
 
 /* Inline mode */
@@ -131,14 +129,12 @@
 /* Variables */
 /* ========================================================================== */
 
-@_sap_m_IconTabBar_TextHoverColor: darken(@sapUiGroupTitleTextColor, 10);
-@_sap_m_IconTabBar_SelectedTextColor: var(--sapContent_LabelColor);
+@_sap_m_IconTabBar_SelectedTextColor: var(--sapTab_Selected_Background);
 @_sap_m_IconTabBar_SelectedTextHoverColor: darken(@sapUiSelected, 10);
 @_sap_m_IconTabBar_ArrowScroll_AfterHeight: 1px;
 
 /* =========== Shell =========== */
 @_sap_m_IconTabBar_ShellHeaderShadow: var(--sapShell_Shadow);
-@_sap_m_IconTabBar_ShellContentArrowHeight: 0.313rem;
 @_sap_m_IconTabBar_ShellOverflowBorderColor: var(--sapButton_BorderColor);
 @_sap_m_IconTabBar_ShellOverflowHoverBorderColor: var(--sapButton_Hover_BorderColor);
 @_sap_m_IconTabBar_ShellOverflowPressedBorderColor: var(--sapButton_Active_BorderColor);
@@ -243,7 +239,6 @@
 }
 
 .sapMITBContentArrow {
-	border-bottom: none;
 	position: relative;
 
 	/* creates border bottom with rounded top corners */
@@ -253,7 +248,6 @@
 		bottom: 0;
 		left: 0;
 		right: 0;
-		height: @_sap_m_IconTabBar_ContentArrowBorderWidth;
 		border-radius: 0.125rem 0.125rem 0 0;
 	}
 }
@@ -299,17 +293,21 @@
 }
 
 .sapMITBFilterIcon {
-	border: 1px solid var(--sapGroup_TitleTextColor);
+	border: 0.125rem solid var(--sapTab_ForegroundColor);
 }
 
 .sapMITBFilterDefault {
 	color: var(--sapContent_ContrastIconColor);
 }
 
+.sapMITBTab .sapMITBFilterDefault {
+	background-color: var(--sapTab_Background);
+}
+
 .sapMITBSelected {
 
 	.sapMITBContentArrow::after {
-		background: var(--sapList_SelectionBorderColor);
+		background: var(--sapTab_ForegroundColor);
 	}
 
 	.sapMITBFilterDefault,
@@ -317,11 +315,13 @@
 	.sapMITBFilterPositive,
 	.sapMITBFilterNegative,
 	.sapMITBFilterCritical {
-		background: var(--sapSelectedColor);
-		color: var(--sapContent_ContrastIconColor);
+		background: var(--sapTab_Positive_Selected_Background);
+		color: var( --sapTab_Positive_Selected_IconColor);
 	}
 }
 
+
+
 /* Phone device */
 
 .sapUiMedia-Std-Phone .sapMITH.sapUiSizeCompact {

package/src/sap/m/themes/sap_horizon_hcb/InputBase.less

@@ -15,7 +15,7 @@
 @_sap_m_InputBase_IconMinWidth: 2.25rem;
 @_sap_m_InputBase_FocusOffset_Busy: 3px;
 
-.sapMInputBaseContentWrapper:not(.sapMInputBaseContentWrapperError):not(.sapMInputBaseContentWrapperWarning):not(.sapMInputBaseContentWrapperInformation):not(.sapMInputBaseDisabledWrapper) {
+.sapMInputBaseContentWrapper:not(.sapMInputBaseContentWrapperError):not(.sapMInputBaseContentWrapperWarning):not(.sapMInputBaseContentWrapperInformation):not(.sapMInputBaseDisabledWrapper):not(.sapMInputBaseReadonlyWrapper) {
 	border: var(--sapContent_FocusWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);
 }
 
@@ -101,6 +101,10 @@
 	text-align: right;
 }
 
+.sapMInputBaseReadonly:not(.sapMInputBaseDisabled) .sapMInputBaseContentWrapper {
+	border: var(--sapElement_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);
+}
+
 .sapMLIBActive {
 
 	.sapMInputBaseInner,

package/src/sap/m/themes/sap_horizon_hcb/MessageStrip.less

@@ -3,11 +3,6 @@
 /* Horizon High Contrast Black theme   */
 /* =================================== */
 
-.sapMMsgStrip {
-	border-radius: var(--sapPopover_BorderCornerRadius);
-	border-width: 0.125rem;
-}
-
 .sapMMsgStripCloseButton {
 	top: -0.4375rem;
 }

package/src/sap/m/themes/sap_horizon_hcb/ObjectStatus.less

@@ -24,6 +24,7 @@
 	.sapMObjStatusInformation .sapMObjStatusText,
 	.sapMObjStatusInformation .sapMObjStatusIcon {
 		color: var(--sapList_TextColor);
+		text-shadow: none;
 	}
 }
 
@@ -426,154 +427,154 @@
 
 /* Second set of inverted indication colors regular state */
 .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_1_Background);
-	border-color: var(--sapIndicationColor_1_BorderColor);
+	background-color: var(--sapIndicationColor_1b_Background);
+	border-color: var(--sapIndicationColor_1b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_1_TextColor);
+	color: var(--sapIndicationColor_1b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_2_Background);
-	border-color: var(--sapIndicationColor_2_BorderColor);
+	background-color: var(--sapIndicationColor_2b_Background);
+	border-color: var(--sapIndicationColor_2b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_2_TextColor);
+	color: var(--sapIndicationColor_2b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_3_Background);
-	border-color: var(--sapIndicationColor_3_BorderColor);
+	background-color: var(--sapIndicationColor_3b_Background);
+	border-color: var(--sapIndicationColor_3b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_3_TextColor);
+	color: var(--sapIndicationColor_3b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_4_Background);
-	border-color: var(--sapIndicationColor_4_BorderColor);
+	background-color: var(--sapIndicationColor_4b_Background);
+	border-color: var(--sapIndicationColor_4b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_4_TextColor);
+	color: var(--sapIndicationColor_4b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_5_Background);
-	border-color: var(--sapIndicationColor_5_BorderColor);
+	background-color: var(--sapIndicationColor_5b_Background);
+	border-color: var(--sapIndicationColor_5b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_5_TextColor);
+	color: var(--sapIndicationColor_5b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_6_Background);
-	border-color: var(--sapIndicationColor_6_BorderColor);
+	background-color: var(--sapIndicationColor_6b_Background);
+	border-color: var(--sapIndicationColor_6b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_6_TextColor);
+	color: var(--sapIndicationColor_6b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_7_Background);
-	border-color: var(--sapIndicationColor_7_BorderColor);
+	background-color: var(--sapIndicationColor_7b_Background);
+	border-color: var(--sapIndicationColor_7b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_7_TextColor);
+	color: var(--sapIndicationColor_7b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_8_Background);
-	border-color: var(--sapIndicationColor_8_BorderColor);
+	background-color: var(--sapIndicationColor_8b_Background);
+	border-color: var(--sapIndicationColor_8b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_8_TextColor);
+	color: var(--sapIndicationColor_8b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_9_Background);
-	border-color: var(--sapIndicationColor_9_BorderColor);
+	background-color: var(--sapIndicationColor_9b_Background);
+	border-color: var(--sapIndicationColor_9b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_9_TextColor);
+	color: var(--sapIndicationColor_9b_TextColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_10_Background);
-	border-color: var(--sapIndicationColor_10_BorderColor);
+	background-color: var(--sapIndicationColor_10b_Background);
+	border-color: var(--sapIndicationColor_10b_BorderColor);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusText,
 .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusIcon {
 	text-shadow: none;
-	color: var(--sapIndicationColor_10_TextColor);
+	color: var(--sapIndicationColor_10b_TextColor);
 }
 
 /* Second set of inverted indication colors hovered state */
 .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_1_Hover_Background);
+	background-color: var(--sapIndicationColor_1b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_2_Hover_Background);
+	background-color: var(--sapIndicationColor_2b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_3_Hover_Background);
+	background-color: var(--sapIndicationColor_3b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_4_Hover_Background);
+	background-color: var(--sapIndicationColor_4b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_5_Hover_Background);
+	background-color: var(--sapIndicationColor_5b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_6_Hover_Background);
+	background-color: var(--sapIndicationColor_6b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_7_Hover_Background);
+	background-color: var(--sapIndicationColor_7b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_8_Hover_Background);
+	background-color: var(--sapIndicationColor_8b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_9_Hover_Background);
+	background-color: var(--sapIndicationColor_9b_Hover_Background);
 }
 
 .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
-	background-color: var(--sapIndicationColor_10_Hover_Background);
+	background-color: var(--sapIndicationColor_10b_Hover_Background);
 }
 
 html.sap-desktop .sapMObjStatusActive:focus .sapMObjStatusLink::after {

package/src/sap/m/themes/sap_horizon_hcb/SplitButton.less

@@ -8,18 +8,19 @@
 	bottom: 0.375rem;
 	left: 0.125rem;
 	right: 0.125rem;
-	border: 0.125rem dotted @sapUiContentFocusColor;
+	border: 0.125rem dotted var(--sapContent_FocusColor);
 	border-radius: 0.375rem
 }
 
 .sapUiSizeCompact {
+
 	.sapMSB:focus .sapMSBInner:not(.sapMSBInnerDisabled)::after {
 		top: 0.3125rem;
 		bottom: 0.3125rem;
 	}
 }
 
-//ie
+/* ie */
 .sapMSBTextIE.sapMSBText {
 	padding-right: 2.25rem;
 }

package/src/sap/m/themes/sap_horizon_hcb/StepInput.less

@@ -4,7 +4,9 @@
 /* ================================== */
 
 .sapMStepInput:focus {
+
 	.sapMInputBaseContentWrapper:not(.sapMInputBaseReadonlyWrapper):not(.sapMStepInputReadOnly) {
+
 		&::before {
 			border-width: 2px;
 		}