@openui5/sap.m 1.130.1 → 1.131.0

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

@@ -562,9 +562,7 @@ span.sapMBtnInner.sapMBtnEmphasized {
 /* Button, used as a focus dom ref for active toolbar */
 .sapUiSizeCompact .sapMTBActiveButton,
 .sapMTBActiveButton {
-	position: absolute;
-	left: -1000000px;
-	top: -1000000px;
+	position: relative;
 	width: 0;
 	height: 0;
 	opacity: 0;

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

@@ -19,7 +19,6 @@
 @_sap_m_Carousel_PageIndicatorWidthSizeM: 16rem;
 @_sap_m_Carousel_PageIndicatorWidthSizeL: 20rem;
 @_sap_m_Carousel_PageIndicatorWidthSizeXL: 24rem;
-@_sap_m_Carousel_ContentArrowBoxShadow: @sapUiShadowLevel1;
 @_sap_m_Carousel_BulletInactiveBackground: var(--sapContent_NonInteractiveIconColor);
 @_sap_m_Carousel_BulletInactiveBorderColor: var(--sapContent_NonInteractiveIconColor);
 @_sap_m_Carousel_BulletActiveBackground: var(--sapSelectedColor);
@@ -213,7 +212,7 @@ html[data-sap-ui-animation='off'] .sapMCrsl .sapMCrslInner {
 	display: block;
 	position: absolute;
 	margin: -1.5625px 0 0 0;
-	box-shadow: @_sap_m_Carousel_ContentArrowBoxShadow;
+	box-shadow: var(--sapContent_Shadow0);
 
 	&:hover,
 	&:focus {
@@ -237,7 +236,7 @@ html.sap-desktop .sapMCrslHud .sapMCrslArrow {
 	transition: opacity 0.1s ease-in;
 	box-sizing: border-box;
 	background-color: var(--sapButton_Background);
-	border: 1px solid var(--sapButton_BorderColor);
+	border: var(--sapButton_BorderWidth) solid var(--sapButton_BorderColor);
 	color: var(--sapButton_IconColor);
 	cursor: pointer;
 	-webkit-user-select: none;
@@ -251,13 +250,13 @@ html.sap-desktop .sapMCrslHud .sapMCrslArrow {
 		background: var(--sapButton_Hover_Background);
 		border-color: var(--sapButton_Hover_BorderColor);
 		color: var(--sapButton_Hover_TextColor);
-		box-shadow: var(--sapContent_Interaction_Shadow);
 	}
 
 	&:active {
 		background-color: var(--sapButton_Active_Background);
 		border-color: var(--sapButton_Active_BorderColor);
 		color: var(--sapButton_Active_TextColor);
+		box-shadow: none;
 	}
 }
 

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

@@ -15,29 +15,34 @@
 	padding: 0 0 0 3rem;
 
 	&:not(.sapMCbBgDis):not(.sapMCbDisplayOnly) {
+
 		&:hover,
 		.sapMCbLabel:hover {
 			cursor: pointer;
 		}
-		&.sapMCbHasLabel:focus:before {
+
+		&.sapMCbHasLabel:focus::before {
 			pointer-events: none;
 		}
 	}
 
 	&.sapMCbDisplayOnly {
+
 		&.sapMCbErr,
 		&.sapMCbInfo,
 		&.sapMCbWarn,
 		&.sapMCbSucc {
+
 			.sapMCbBg {
 				border: none;
-				&.sapMCbMarkChecked:before {
-					color: @sapUiBaseText;
-				}
-				&.sapMCbMarkPartiallyChecked{
-					border: solid 0.0625rem #89919a
+
+				&.sapMCbMarkChecked::before {
+					color: var(--sapTextColor);
 				}
 
+				&.sapMCbMarkPartiallyChecked {
+					border: solid 0.0625rem var(--sapField_BorderColor); /* was stated in #89919a */
+				}
 			}
 		}
 	}
@@ -55,6 +60,7 @@
 		top: 0;
 		margin: 0;
 	}
+
 	&.sapMCbWrapped.sapMCbHasLabel > .sapMLabel.sapMLabelWrapped {
 		margin: 0;
 		line-height: 1.125rem;
@@ -63,6 +69,7 @@
 
 .sapMCb.sapMCbWrapped.sapMCbHasLabel {
 	height: auto;
+
 	> .sapMLabel.sapMLabelWrapped {
 		margin: 0.875rem 0;
 		line-height: 1.4rem;
@@ -94,7 +101,7 @@ html[dir="rtl"] .sapMCb {
 	}
 }
 
-.sapMCb>label {
+.sapMCb > label {
 	vertical-align: top;
 	overflow: hidden;
 	text-overflow:ellipsis;
@@ -103,8 +110,8 @@ html[dir="rtl"] .sapMCb {
 }
 
 .sapMCbBg { /* check box itself */
-	background-color: @sapUiFieldBackground;
-	border: solid 0.125rem @sapUiFieldBorderColor;
+	background-color: var(--sapField_Background);
+	border: solid 0.125rem var(--sapField_BorderColor);
 	display: inline-block;
 	position: absolute;
 	left: 0.8125rem;
@@ -116,8 +123,8 @@ html[dir="rtl"] .sapMCb {
 	text-align: center;
 	font-size: 1rem;
 
-	// note: some browsers like Samsung Galaxy S4 with Android 4.2 does not support the "border-radius" shorthand property
-	// but does support the long-hand properties for each corner like "border-top-left-radius"
+	/* note: some browsers like Samsung Galaxy S4 with Android 4.2 does not support the "border-radius" shorthand property
+	but does support the long-hand properties for each corner like "border-top-left-radius" */
 	border-top-left-radius: 0.125rem;
 	border-top-right-radius: 0.125rem;
 	border-bottom-right-radius: 0.125rem;
@@ -126,18 +133,18 @@ html[dir="rtl"] .sapMCb {
 }
 
 .sapMCbBg > .sapMCbMark,
-.sapMCbBg.sapMCbMark > input{
+.sapMCbBg.sapMCbMark > input {
 	font-size: inherit;
 }
 
-.sapMCbBg.sapMCbMarkChecked:before {
-	content: "\e05b";
-	font-family: "SAP-icons";
+.sapMCbBg.sapMCbMarkChecked::before {
+	content: '\e05b';
+	font-family: var(--sapContent_IconFontFamily);
 	display: inline-block;
 }
 
-.sapMCbBg.sapMCbMarkChecked.sapMCbMarkPartiallyChecked:before{
-	content: "";
+.sapMCbBg.sapMCbMarkChecked.sapMCbMarkPartiallyChecked::before {
+	content: '';
 	width: 100%;
 	height: 100%;
 	background-color: currentColor;
@@ -146,7 +153,7 @@ html[dir="rtl"] .sapMCb {
 	background-clip: padding-box;
 }
 
-.sapUiSizeCompact .sapMCbBg.sapMCbMarkChecked.sapMCbMarkPartiallyChecked:before {
+.sapUiSizeCompact .sapMCbBg.sapMCbMarkChecked.sapMCbMarkPartiallyChecked::before {
 	border-width: 0.125rem;
 }
 
@@ -164,24 +171,24 @@ html[data-sap-ui-browser^=ff] .sapMCbBg > input {
 
 /* Read only */
 .sapMCbRo .sapMCbBg {
-	background-color: @sapUiFieldReadOnlyBackground;
-	border-color: @sapUiFieldReadOnlyBorderColor;
+	background-color: var(--sapField_ReadOnly_Background);
+	border-color: var(--sapField_ReadOnly_BorderColor);
 }
 
-.sapMCbRo > .sapMCbBg.sapMCbMarkChecked:before {
-	color: @sapUiContentNonInteractiveIconColor;
+.sapMCbRo > .sapMCbBg.sapMCbMarkChecked::before {
+	color: var(--sapContent_NonInteractiveIconColor);
 }
 
 /* Display only */
 .sapMCbDisplayOnly {
-	font-family: "SAP-icons";
+	font-family: var(--sapContent_IconFontFamily);
 
-	.sapMCbBg.sapMCbMark.sapMCbMarkChecked.sapMCbMarkPartiallyChecked{
+	.sapMCbBg.sapMCbMark.sapMCbMarkChecked.sapMCbMarkPartiallyChecked {
 		border-radius: 0.0625rem;
-		border: 1px solid @sapUiBaseText ;
+		border: 1px solid var(--sapTextColor);
 
-		&:before {
-			background-color: @sapUiBaseText;
+		&::before {
+			background-color: var(--sapTextColor);
 		}
 	}
 
@@ -190,14 +197,14 @@ html[data-sap-ui-browser^=ff] .sapMCbBg > input {
 		border: none;
 		margin: 0.125rem;
 
-		&:before {
-			content: "\e19a";
+		&::before {
+			content: '\e19a';
 			font-size: 1rem;
 		}
 
-		&.sapMCbMarkChecked:before {
-			color: @sapUiBaseText;
-			content: "\e03f";
+		&.sapMCbMarkChecked::before {
+			color: var(--sapTextColor);
+			content: '\e03f';
 		}
 	}
 }
@@ -213,6 +220,7 @@ html[data-sap-ui-browser^=ff] .sapMCbBg > input {
 
 	.sapMCb.sapMCbWrapped.sapMCbHasLabel {
 		height: auto;
+
 		> .sapMLabel.sapMLabelWrapped {
 			margin: 0.3rem 0;
 		}

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

@@ -1,3 +1,3 @@
 .sapMContextMenuSettingContentOpacity {
-	opacity: @sapContent_DisabledOpacity;
+	opacity: var(--sapContent_DisabledOpacity);
 }

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

@@ -4,8 +4,7 @@
 /* ================================= */
 
 /* Style for Tablet/Desktop */
-.sapMCustomTile
-{
+.sapMCustomTile {
 	display: inline-block;
 	box-sizing: border-box;
 	-webkit-transition-property: transform3d;
@@ -14,7 +13,7 @@
 	transition-duration: 0.2s;
 	width: 13em;
 	height: 15em;
-	margin:0em;
+	margin: 0em;
 }
 
 .sapMCustomTileContent {

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

@@ -255,17 +255,10 @@ html.sap-desktop .sapMDialog {
 	.sapMDialog {
 		min-height: @_sap_m_Dialog_BarCompactHeight;
 		padding-bottom: @_sap_m_Dialog_BarCompactHeight;
-		padding-top: @_sap_m_Dialog_BarCompactHeight;
 
 		&.sapMDialogWithSubHeader {
-			padding-top: @_sap_m_Dialog_BarCompactHeight + @_sap_m_Dialog_SubHeaderCompactHeight;
-
-			&.sapMDialogSubHeaderInfoBar {
-				padding-top: @_sap_m_Dialog_BarCompactHeight + @_sap_m_Dialog_InfoDesignBarHeight;
-			}
 
 			&.sapMDialog-NoHeader {
-				padding-top: @_sap_m_Dialog_SubHeaderCompactHeight;
 
 				& .sapMDialogSubHeader {
 					top: 0;
@@ -274,7 +267,7 @@ html.sap-desktop .sapMDialog {
 		}
 
 		.sapMDialogTitleGroup {
-			height: @_sap_m_Dialog_BarCompactHeight;
+			min-height: @_sap_m_Dialog_BarCompactHeight;
 
 			.sapMHeader-CTX,
 			.sapMSubHeader-CTX {
@@ -335,7 +328,6 @@ html.sap-desktop .sapMDialog {
 	box-sizing: content-box;
 	min-height: @_sap_m_Dialog_BarHeight;
 	padding-bottom: @_sap_m_Dialog_BarHeight;
-	padding-top: @_sap_m_Dialog_BarHeight;
 
 	footer {
 
@@ -348,15 +340,9 @@ html.sap-desktop .sapMDialog {
 		padding-bottom: 0;
 	}
 
-	&.sapMDialog-NoHeader {
-		padding-top: 0;
-	}
-
 	&.sapMDialogWithSubHeader {
-		padding-top: @_sap_m_Dialog_BarHeight + @_sap_m_Dialog_SubHeaderHeight;
 
 		&.sapMDialogSubHeaderInfoBar {
-			padding-top: @_sap_m_Dialog_BarHeight + @_sap_m_Dialog_InfoDesignBarHeight;
 
 			.sapMDialogSubHeader {
 				height: @_sap_m_Dialog_InfoDesignBarHeight;
@@ -364,7 +350,6 @@ html.sap-desktop .sapMDialog {
 		}
 
 		&.sapMDialog-NoHeader {
-			padding-top: @_sap_m_Dialog_SubHeaderHeight;
 
 			.sapMDialogSubHeader {
 				top: 0;
@@ -373,7 +358,7 @@ html.sap-desktop .sapMDialog {
 	}
 
 	.sapMDialogTitleGroup {
-		height: @_sap_m_Dialog_BarHeight;
+		min-height: @_sap_m_Dialog_BarHeight;
 		left: 0;
 		position: absolute;
 		right: 0;

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

@@ -31,8 +31,8 @@
 	white-space: nowrap;
 	max-width: 20.5rem;
 	line-height: 1.063rem;
-	font-size: @sapMFontSmallSize;
-	color: @sapUiTileTextColor;
+	font-size: var(--sapFontSmallSize);
+	color: var(--sapTile_TextColor);
 }
 
 .sapMFCValue {
@@ -46,12 +46,12 @@
 	max-width: 10.25rem;
 	min-width: 3rem;
 	float: right;
-	font-family: @sapUiFontHeaderFamily;
+	font-family: var(--sapFontHeaderFamily);
 	font-weight: @sapUiFontHeaderWeight;
 }
 
 .sapMFCCTxt > .sapMText {
-	cursor:inherit;
+	cursor: inherit;
 }
 
 .sapMFC:focus:not([tabindex]) {
@@ -60,33 +60,34 @@
 
 .sapMFCCTxt .sapMText {
 	font-size: @sapFontSize;
-	color: @sapUiTileTitleTextColor;
+	color: var(--sapTile_TitleTextColor);
 }
 
-.sapMGT.TwoByOne.sapMTileSmallPhone{
+.sapMGT.TwoByOne.sapMTileSmallPhone {
+
 	.sapMFCCTxt .sapMText {
-		font-size: @sapFontSmallSize;
+		font-size: var(--sapFontSmallSize);
 	}
 }
 
 .sapMFCValue.Neutral {
-	color: @sapUiNeutralText;
+	color: var(--sapNeutralTextColor);
 }
 
 .sapMFCValue.Good {
-	color: @sapUiPositiveText;
+	color: var(--sapPositiveTextColor);
 }
 
 .sapMFCValue.Critical {
-	color: @sapUiCriticalText;
+	color: var(--sapCriticalTextColor);
 }
 
 .sapMFCValue.Error {
-	color: @sapUiNegativeText;
+	color: var(--sapNegativeTextColor);
 }
 
 html.sap-desktop .sapMFC:focus {
-	outline: @sapUiContentFocusColor @sapUiContentFocusStyle @sapUiContentFocusWidth;
+	outline: var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);
 }
 
 html.sap-desktop .sapMFC:focus:not([tabindex]) {
@@ -94,6 +95,7 @@ html.sap-desktop .sapMFC:focus:not([tabindex]) {
 }
 
 .sapMTileSmallPhone {
+
 	.sapMFC {
 		width: 17.75rem;
 		height: 3.438rem;