@openui5/sap.m 1.131.0 → 1.132.0

package/src/sap/m/themes/base/ObjectHeader.less

@@ -68,10 +68,9 @@ html.sap-phone .sapMOH.sapMOHC {
 	font-size: @sapMFontMediumSize;
 	margin-top: 0.375rem;
 	margin-bottom: 0.625rem;
-	color: @sapUiContentLabelColor;
+	color: var(--sapContent_LabelColor);
 }
 
-
 .sapMOHIntroActive > a:active,
 html.sap-desktop .sapMOHIntroActive > a:hover,
 .sapMOHTitleActive h6 .sapMText:active,
@@ -97,11 +96,12 @@ html.sap-desktop .sapMOHTitleActive h1 .sapMText:hover {
 	float: left;
 }
 
-.sapMOHC>.sapMOHTitleDiv {
+.sapMOHC > .sapMOHTitleDiv {
 	padding-right: 0.5rem;
 }
 
-.sapMOHC>.sapMOHTitleDivFull,.sapMOHTitleDivFull {
+.sapMOHC > .sapMOHTitleDivFull,
+.sapMOHTitleDivFull {
 	width: 100%;
 }
 
@@ -193,11 +193,11 @@ html.sap-phone .sapMText.sapMOHTitle {
 	font-size: 1.188rem;
 }
 
-.sapMOHIcon+.sapMOHTitle {
+.sapMOHIcon + .sapMOHTitle {
 	margin-left: 4rem;
 }
 
-.sapMOHIcon+.sapMOHTitleAndArrow {
+.sapMOHIcon + .sapMOHTitleAndArrow {
 	margin-left: 3.5rem;
 }
 
@@ -206,7 +206,7 @@ html.sap-phone .sapMText.sapMOHTitle {
 	vertical-align: top;
 	position: absolute;
 	right: 0;
-	color: @sapUiContentIconColor;
+	color: var(--sapContent_IconColor);
 }
 
 .sapMOHC .sapMOHTitleArrow {
@@ -226,7 +226,7 @@ html .sapUiContainer-Narrow .sapMOHTitleArrow .sapUiIcon {
 	padding: 0.3rem 0.4rem 0.3rem 0.4rem;
 }
 
-.sapMOHTitle+.sapMOHTitleArrow {
+.sapMOHTitle + .sapMOHTitleArrow {
 	margin-left: 0.5rem;
 }
 
@@ -293,7 +293,7 @@ html.sap-phone .sapMOHNumberWrap {
 	margin-top: 0;
 }
 
-.sapMOHC>.sapMOHAttr {
+.sapMOHC > .sapMOHAttr {
 	margin-top: 0.125rem;
 }
 
@@ -311,7 +311,7 @@ html.sap-phone .sapMOHNumberWrap {
 	display: inline-block;
 	text-overflow: inherit;
 	white-space: inherit;
-	color: @sapUiContentLabelColor;
+	color: var(--sapContent_LabelColor);
 	vertical-align: middle;
 }
 
@@ -329,14 +329,13 @@ html.sap-phone .sapMOHNumberWrap {
 	.sapMObjStatusText {
 		word-break: normal;
 	}
-
 }
 
 .sapMOHStatusFixedWidth {
 	width: 35%;
 }
 
-.sapMOHStatusFixedWidth>.sapMPI {
+.sapMOHStatusFixedWidth > .sapMPI {
 	float: right;
 }
 
@@ -361,7 +360,7 @@ html .sapUiContainer-Medium .additionalOHNumberDiv.sapMOHNumberDiv {
 }
 
 .additionalOHNumberDiv.sapMOHNumberDiv .sapMObjectNumber:not(.sapMObjectNumberStatusError):not(.sapMObjectNumberStatusWarning):not(.sapMObjectNumberStatusSuccess) {
-	color: @sapUiContentLabelColor;
+	color: var(--sapContent_LabelColor);
 }
 
 .additionalOHNumberDiv.sapMOHNumberDiv .sapMObjectNumber .sapMObjectNumberText {
@@ -375,7 +374,7 @@ html .sapUiContainer-Medium .additionalOHNumberDiv.sapMOHNumberDiv {
 	float: right;
 	white-space: nowrap;
 	width: 1px;
-	background: @sapUiToolbarSeparatorColor;
+	background: var(--sapToolbar_SeparatorColor);
 	height: 1.375rem;
 }
 
@@ -388,14 +387,16 @@ html .sapUiContainer-Medium .additionalOHNumberDiv.sapMOHNumberDiv {
 	font-size: 0.875rem;
 }
 
-.sapMOH .sapMObjStatusMarker .sapUiIcon:before {
+.sapMOH .sapMObjStatusMarker .sapUiIcon::before {
 	vertical-align: top;
 }
+
 /*
  * Do NOT clear if ObjectHeader is placed in a responsive grid layout.
  * The layout will clear after the ObjectHeader by itself. This caused problems
  * on webkit browser on phones (CSN 0120031469 0000034838 2014)
  */
+
 div[class*='sapUiRespGrid'] > .sapMOH > .sapMOHLastDivider {
 	clear: none;
 }
@@ -439,12 +440,12 @@ html:not(.sapUiMedia-Std-Phone) .sapMSplitContainer:not(.sapMSplitContainerHideM
 /* Group1 (title, flags and number) */
 .sapMOHRTitleNumberDiv {
 	display: inline-block;
-	max-width: 95rem; // set max width in order the content not to be stretched too much on a very wide screen
+	max-width: 95rem; /* set max width in order the content not to be stretched too much on a very wide screen */
 	width: 100%;
 }
 
 .sapMOHRStatesOneOrThree {
-	max-width: 95rem; // set max width in order the content not to be stretched too much on a very wide screen
+	max-width: 95rem; /* set max width in order the content not to be stretched too much on a very wide screen */
 }
 
 html.sap-desktop .sapMOHRStatesOneOrThree .sapMOHRTitleNumberDiv {
@@ -452,7 +453,7 @@ html.sap-desktop .sapMOHRStatesOneOrThree .sapMOHRTitleNumberDiv {
 	max-width: none;
 }
 
-/* icon*/
+/* icon */
 .sapMOHRIcon {
 	position: absolute;
 	top: 0.4375rem;
@@ -462,6 +463,7 @@ html.sap-desktop .sapMOHRStatesOneOrThree .sapMOHRTitleNumberDiv {
 }
 
 .sapMOHRIcon.sapMPointer .sapUiIcon.sapUiIconPointer {
+
 	&:active,
 	&:focus {
 		outline: none;
@@ -477,7 +479,7 @@ html.sap-desktop .sapMOHRStatesOneOrThree .sapMOHRTitleNumberDiv {
 	max-width: 3rem;
 }
 
-.sapMOHRHideIcon{
+.sapMOHRHideIcon {
 	display: none;
 	visibility: hidden;
 	margin-left: 0;
@@ -521,7 +523,7 @@ html .sapUiContainer-Narrow .sapMOHRTitleTextWrappable {
 	position: relative;
 }
 
-.sapMOHR .sapMObjStatusMarker{
+.sapMOHR .sapMObjStatusMarker {
 	white-space: nowrap;
 }
 
@@ -534,7 +536,8 @@ html .sapUiContainer-Narrow .sapMOHRTitleTextWrappable {
 .sapMOHR .sapMObjStatusMarker .sapMObjectMarker .sapMText {
 	display: inline;
 }
-.sapMOHR .sapMObjStatusMarker .sapUiIcon:before {
+
+.sapMOHR .sapMObjStatusMarker .sapUiIcon::before {
 	vertical-align: inherit;
 }
 
@@ -545,7 +548,6 @@ html .sapUiContainer-Narrow .sapMOHRTitleTextWrappable {
 
 /* overwrite transform for the markers favorite and flag icon */
 html[dir=rtl] .sapMObjStatusMarker > .sapUiIcon.sapUiIconMirrorInRTL {
-	-webkit-transform: none; /* Chrome, Safari, Opera */
 	transform: none;
 }
 
@@ -563,7 +565,7 @@ html[dir=rtl] .sapMObjStatusMarker > .sapUiIcon.sapUiIconMirrorInRTL {
 
 html.sap-desktop.sapUiMedia-Std-Phone .sapMOHRIntroMargin,
 html.sap-phone .sapMOHRIntroMargin,
-html .sapUiContainer-Narrow  .sapMOHRIntroMargin {
+html .sapUiContainer-Narrow .sapMOHRIntroMargin {
 	margin-top: -0.3rem;
 }
 
@@ -606,7 +608,7 @@ html .sapUiContainer-Narrow .sapMOHRTitleArrow .sapUiIcon {
 	vertical-align: top;
 	padding-top: 1rem;
 	width: 100%;
-	max-width: 95rem; // set max width in order the content not to be stretched too much on a very wide screen
+	max-width: 95rem; /* set max width in order the content not to be stretched too much on a very wide screen */
 }
 
 html.sap-desktop .sapMOHRStatesOneOrThree > .sapMOHRStates {
@@ -629,8 +631,9 @@ html.sap-desktop .sapMOHRStatesOneOrThree > .sapMOHRStates .sapMObjectAttributeD
 	padding-top: 0.125rem;
 }
 
-// Android fix
-html[data-sap-ui-os^="Android"] {
+/* Android fix */
+html[data-sap-ui-os^='Android'] {
+
 	.sapMOHR .sapMObjectNumberUnit {
 		padding-top: 0.25rem;
 	}
@@ -680,7 +683,7 @@ html.sap-desktop.sapUiMedia-Std-Tablet .sapMOHRStatesOneOrThree > .sapMOHRTitleN
 html.sap-tablet .sapMOHRTitleDiv:not(.sapMOHRTitleDivFull),
 html.sap-tablet .sapMOHRStatesOneOrThree > .sapMOHRTitleNumberDiv > .sapMOHRTitleDiv:not(.sapMOHRTitleDivFull),
 html .sapUiContainer-Medium .sapMOHRTitleDiv:not(.sapMOHRTitleDivFull),
-html .sapUiContainer-Medium .sapMOHRStatesOneOrThree > .sapMOHRTitleNumberDiv > .sapMOHRTitleDiv:not(.sapMOHRTitleDivFull){
+html .sapUiContainer-Medium .sapMOHRStatesOneOrThree > .sapMOHRTitleNumberDiv > .sapMOHRTitleDiv:not(.sapMOHRTitleDivFull) {
 	width: 65%;
 }
 
@@ -810,27 +813,36 @@ html .sapUiContainer-Narrow .sapMOHRTabs .sapMITH {
 }
 
 .sapUiMedia-Std-Desktop {
+
 	&.sapUiMedia-StdExt-LargeDesktop {
-		.sapUiResponsiveContentPadding .sapMOHR{
+
+		.sapUiResponsiveContentPadding .sapMOHR {
+
 			.sapMITH {
 				margin-left: -3rem;
 				margin-right: -3rem;
 			}
 		}
+
 		.sapFFCLColumnBegin.sapUiContainer-Narrow,
 		.sapFFCLColumnMid.sapUiContainer-Narrow,
 		.sapFFCLColumnEnd.sapUiContainer-Narrow {
-			.sapUiResponsiveContentPadding .sapMOHR{
+
+			.sapUiResponsiveContentPadding .sapMOHR {
+
 				.sapMITH {
 					margin-left: -1rem;
 					margin-right: -1rem;
 				}
 			}
 		}
+
 		.sapFFCLColumnBegin.sapUiContainer-Medium,
 		.sapFFCLColumnMid.sapUiContainer-Medium,
 		.sapFFCLColumnEnd.sapUiContainer-Medium {
-			.sapUiResponsiveContentPadding .sapMOHR{
+
+			.sapUiResponsiveContentPadding .sapMOHR {
+
 				.sapMITH {
 					margin-left: -2rem;
 					margin-right: -2rem;
@@ -852,7 +864,7 @@ html .sapUiContainer-Narrow .sapMOHRTabs .sapMITH {
 .sapMOHTitle.sapMOHTitleActive > h3 .sapMText,
 .sapMOHTitle.sapMOHTitleActive > h2 .sapMText,
 .sapMOHTitle.sapMOHTitleActive > h1 .sapMText {
-	color: @sapUiLink;
+	color: var(--sapLinkColor);
 	cursor: pointer;
 }
 
@@ -862,11 +874,11 @@ html .sapUiContainer-Narrow .sapMOHRTabs .sapMITH {
 .sapMOHTitle h3 .sapMText,
 .sapMOHTitle h2 .sapMText,
 .sapMOHTitle h1 .sapMText {
-	color: @sapUiGroupTitleTextColor;
+	color: var(--sapGroup_TitleTextColor);
 }
 
 html.sap-phone .sapMOHTitle h1 > .sapMText {
-	font-size: @sapMFontHeader4Size;
+	font-size: var(--sapFontHeader4Size);
 }
 
 .sapMOHNumberDiv .sapMObjectNumber {
@@ -876,7 +888,7 @@ html.sap-phone .sapMOHTitle h1 > .sapMText {
 }
 
 .sapMOHNumberDiv .sapMObjectNumberText {
-	font-family: @sapUiFontHeaderFamily;
+	font-family: var(--sapFontHeaderFamily);
 	font-size: 1.375rem;
 	font-weight: @sapUiFontHeaderWeight;
 	white-space: nowrap;
@@ -898,32 +910,32 @@ html.sap-phone .sapMOHTitle h1 > .sapMText {
 }
 
 .sapMOHC .sapMOHNumberDiv .sapMObjectNumberText {
-	font-family: @sapUiFontHeaderFamily;
+	font-family: var(--sapFontHeaderFamily);
 	font-size: 1.375rem;
 }
 
 .sapMOH .sapMObjectAttributeActive {
-	color: @sapUiLink;
+	color: var(--sapLinkColor);
 }
 
 .sapMOHNumberStateNone {
-	color: @sapUiGroupTitleTextColor;
+	color: var(--sapGroup_TitleTextColor);
 }
 
 .sapMOHNumberStateError {
-	color: @sapUiNegativeText;
+	color: var(--sapNegativeTextColor);
 }
 
 .sapMOHNumberStateWarning {
-	color: @sapUiCriticalText;
+	color: var(--sapCriticalTextColor);
 }
 
 .sapMOHNumberStateSuccess {
-	color: @sapUiPositiveText;
+	color: var(--sapPositiveTextColor);
 }
 
 .sapMOHIcon .sapUiIcon {
-	color: @sapUiContentIconColor;
+	color: var(--sapContent_IconColor);
 }
 
 .sapMOHIntro.sapMOHIntroActive >.sapMLnk:active {
@@ -931,21 +943,21 @@ html.sap-phone .sapMOHTitle h1 > .sapMText {
 }
 
 html.sap-desktop .sapMOHTitleArrow .sapUiIcon:hover {
-	background-color: @sapUiButtonLiteHoverBackground;
+	background-color: var(--sapButton_Lite_Hover_Background);
 }
 
 .sapMOHC .sapMOHTitleArrow .sapUiIcon:active,
 .sapMOH .sapMOHTitleArrow .sapUiIcon:active {
-	background-color: @sapUiButtonLiteActiveBackground;
-	color: @sapUiContentContrastTextColor;
+	background-color: var(--sapButton_Lite_Active_Background);
+	color: var(--sapContent_ContrastTextColor);
 }
 
-/*** styles for responsive object header ***/
+/* styles for responsive object header */
 .sapMOHRTitle h1 {
-	font-family: @sapUiFontHeaderFamily;
-	font-size: @sapMFontHeader2Size;
+	font-family: var(--sapFontHeaderFamily);
+	font-size: var(--sapFontHeader2Size);
 	font-weight: @sapUiFontHeaderWeight;
-	color: @sapUiGroupTitleTextColor;
+	color: var(--sapGroup_TitleTextColor);
 }
 
 .sapMOHRTitle h6,
@@ -953,52 +965,52 @@ html.sap-desktop .sapMOHTitleArrow .sapUiIcon:hover {
 .sapMOHRTitle h4,
 .sapMOHRTitle h3,
 .sapMOHRTitle h2 {
-	font-family: @sapUiFontHeaderFamily;
+	font-family: var(--sapFontHeaderFamily);
 	font-weight: @sapUiFontHeaderWeight;
-	color: @sapUiGroupTitleTextColor;
+	color: var(--sapGroup_TitleTextColor);
 }
 
 html.sap-phone .sapMOHRTitle h1,
 html.sap-desktop.sapUiMedia-Std-Phone .sapMOHRTitle h1,
 html .sapUiContainer-Narrow .sapMOHRTitle h1 {
-	font-size: @sapMFontHeader4Size;
+	font-size: var(--sapFontHeader4Size);
 }
 
 .sapMOHRIcon .sapUiIcon {
-	font-family: SAP-icons;
+	font-family: var(--sapContent_IconFontFamily);
 	font-size: 2.5rem;
 	font-weight: normal;
-	color: @sapUiContentIconColor;
+	color: var(--sapContent_IconColor);
 }
 
 .sapMOHRTitleArrow .sapUiIcon {
-	color: @sapUiContentIconColor;
+	color: var(--sapContent_IconColor);
 }
 
 html.sap-desktop .sapMOHRTitleArrow .sapUiIcon:hover {
-	background-color: @sapUiButtonLiteHoverBackground;
-	border-color: @sapUiButtonLiteHoverBorderColor;
+	background-color: var(--sapButton_Lite_Hover_Background);
+	border-color: var(--sapButton_Lite_Hover_BorderColor);
 }
 
 .sapMOHRTitleIcon .sapMOHRTitleFollowArrow .sapMOHRTitleArrow .sapUiIcon:active {
-	background-color: @sapUiButtonLiteActiveBackground;
-	color: @sapUiButtonActiveTextColor;
+	background-color: var(--sapButton_Lite_Active_Background);
+	color: var(--sapButton_Active_TextColor);
 }
 
 .sapMOHR .sapMObjStatusMarker{
-	color: @sapUiContentMarkerIconColor;
+	color: var(--sapContent_MarkerIconColor);
 }
 
 .sapMOHRIntro {
-	font-family: @sapUiFontFamily;
+	font-family: var(--sapFontFamily);
 	font-size: @sapMFontMediumSize;
 	font-weight: normal;
-	color: @sapUiContentLabelColor;
+	color: var(--sapContent_LabelColor);
 }
 
 .sapMOHRTitleActive .sapMOHRTitleText {
 	cursor: pointer;
-	color: @sapUiLink;
+	color: var(--sapLinkColor);
 	text-decoration: none;
 }
 
@@ -1007,23 +1019,23 @@ html.sap-desktop .sapMOHRTitleArrow .sapUiIcon:hover {
 }
 
 .sapMOHR .sapMObjectNumberText {
-	font-family: @sapUiFontHeaderFamily;
+	font-family: var(--sapFontHeaderFamily);
 	font-size: 1.375rem;
 	font-weight: @sapUiFontHeaderWeight;
 }
 
-.sapMOHR .sapMObjectNumberUnit{
-	font-family: @sapUiFontFamily;
+.sapMOHR .sapMObjectNumberUnit {
+	font-family: var(--sapFontFamily);
 	font-weight: normal;
 }
 
 .sapMOHR .sapMOHRAttr,
 .sapMOHR .sapMOHRStatus,
 .sapMOHR .sapMObjStatus {
-	font-family: @sapUiFontFamily;
+	font-family: var(--sapFontFamily);
 	font-size: @sapMFontMediumSize;
 	font-weight: normal;
-	color: @sapUiContentLabelColor;
+	color: var(--sapContent_LabelColor);
 }
 
 .sapMOHR .sapMOHRAttr,
@@ -1032,20 +1044,24 @@ html.sap-desktop .sapMOHRTitleArrow .sapUiIcon:hover {
 }
 
 .sapMOHR .sapMOHRStatus {
+
 	.sapMObjStatusText {
 		word-break: normal;
 	}
 }
 
 .sapMOHRStatus .sapMObjStatusNone .sapMObjStatusText {
-	color: @sapUiNeutralText;
+	color: var(--sapNeutralTextColor);
 }
+
 .sapMOHRStatus .sapMObjStatusSuccess .sapMObjStatusText {
-	color: @sapUiPositiveText;
+	color: var(--sapPositiveTextColor);
 }
+
 .sapMOHRStatus .sapMObjStatusError .sapMObjStatusText {
-	color: @sapUiNegativeText;
+	color: var(--sapNegativeTextColor);
 }
+
 .sapMOHRStatus .sapMObjStatusWarning .sapMObjStatusText {
-	color: @sapUiCriticalText;
+	color: var(--sapCriticalTextColor);
 }