@openui5/sap.m 1.100.0 → 1.102.1

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

@@ -15,28 +15,33 @@
 		border-bottom: none;
 	}
 
+	&.sapMNLGroupCollapsed .sapMNLGroupChildren {
+		display: none;
+	}
+
 	.sapMNLGroupHeader {
 		min-height: 2.75rem;
 		background: @_sap_m_NotificationListGroup_Background;
 		border-bottom: 0.0625rem solid @sapUiListGroupHeaderBorderColor;
 		box-sizing: border-box;
-		padding: 0.75rem 0.5rem 0 0.75rem;
+		padding: 0.75rem 0.5rem 0 1rem;
 		display: flex;
-		align-items: center;
-	}
+		align-items: flex-start;
 
-	.sapMNLGroupTitle {
-		color: @_sap_m_NotificationListGroup_HeaderColor;
-		font-size: @sapMFontHeader6Size;
-		font-family: @sapUiFontHeaderFamily;
-		font-weight: @sapUiFontHeaderWeight;
-		text-overflow: ellipsis;
-		overflow: hidden;
-		white-space: nowrap;
-	}
+		.sapMNLIBPriority {
+			padding-top: 0.75rem;
+		}
 
-	.sapMNLGroupHeaderSpacer {
-		flex: 1;
+		.sapMNLGroupTitle {
+			padding: 0.75rem 0;
+			color: @_sap_m_NotificationListGroup_HeaderColor;
+			font-size: @sapMFontHeader6Size;
+			font-family: @sapUiFontHeaderFamily;
+			font-weight: bold;
+			overflow-wrap: break-word;
+			flex: 1;
+			min-width: 0;
+		}
 	}
 
 	.sapMNLGroupChildren {
@@ -44,13 +49,6 @@
 		padding: 0;
 	}
 
-	&.sapMNLGroupUnread {
-		.sapMNLGroupTitle,
-		.sapMNLGroupCount {
-			font-weight: bold;
-		}
-	}
-
 	.sapMNLGroupCollapseButton {
 		margin-right: 0.75rem;
 		width: 2.25rem;
@@ -77,34 +75,22 @@
 	}
 }
 
-.sapMNLGroup.sapMNLGroupCollapsed .sapMNLGroupChildren {
+.sapMNLIActionsHidden {
 	display: none;
 }
 
-.sapMNLGroupCount {
-	margin-left: 0.25rem;
-	margin-right: 1rem;
-
-	color: @_sap_m_NotificationListGroup_HeaderColor;
-	font-size: @sapMFontHeader6Size;
-	font-family: @sapUiFontHeaderFamily;
-}
-
-.sap-phone {
-	.sapMNLGroup .sapMNLGroupHeader {
-		padding: 0 0.5rem
-	}
-
-	.sapMNLGroupCollapseButton {
-		margin-right: 0.75rem;
-	}
-}
-
 .sapUiSizeCompact {
 	.sapMNLGroup {
-		.sapMNLGroupCollapseButton {
-			margin-right: 1rem;
-			width: 2rem;
+		.sapMNLGroupHeader {
+			padding: 0.5rem 0.5rem 0 0.75rem;
+
+			.sapMNLIBPriority {
+				padding-top: 0.5rem;
+			}
+
+			.sapMNLGroupTitle {
+				padding: 0.5rem 0;
+			}
 		}
 	}
 }

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

@@ -27,13 +27,16 @@
 		display: flex;
 	}
 
+	.sapMNLIImage {
+		margin-right: 0.75rem;
+	}
+
 	.sapMNLIContent {
 		display: flex;
 		flex-direction: column;
-		width: 100%;
 		min-width: 0; // chrome flex overflow issue
 		flex: 1;
-		padding: 0 1rem 0 0.75rem;
+		padding-right: 1rem;
 
 		.sapMNLITitle {
 			display: flex;
@@ -60,10 +63,6 @@
 		}
 	}
 
-	&.sapMNLINoAvatar .sapMNLIContent {
-		padding-left: 0;
-	}
-
 	.sapMNLIFooter {
 		display: flex;
 		align-items: center;
@@ -102,6 +101,11 @@
 			}
 		}
 	}
+
+	&.sapMNLINoAvatar .sapMNLIImage,
+	&.sapMNLIB-LayoutS .sapMNLIImage {
+		display: none;
+	}
 }
 
 .sapMNLGroup .sapMNLI {
@@ -116,16 +120,6 @@
 	max-height: 40px; // font-size * line-height (value 1.4) * 2 (number of rows)
 }
 
-.sapMNLIActions {
-	.sapMIBar {
-		border: none;
-
-		.sapMBarChild {
-			margin: 0 !important;
-		}
-	}
-}
-
 .sapMNLIShowMore .sapMLnk {
 	vertical-align: middle;
 	margin-left: 1rem;
@@ -139,6 +133,8 @@
 	align-items: normal;
 }
 
-.sap-phone .sapMNLI {
-	padding: 1rem 0.5rem 1rem 0.75rem;
+.sapUiSizeCompact {
+	.sapMNLI {
+		padding: 1rem 0.5rem 1rem 0.75rem;
+	}
 }

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

@@ -25,7 +25,7 @@
 .sapMListTbl .sapMObjectAttributeActive .sapMText,
 .sapMObjectAttributeActive .sapMText,
 .sapMObjectAttributeActive .sapMObjectAttributeText {
-	color: @sapLinkColor;
+	color: @sapUiLink;
 	cursor: pointer;
 	pointer-events: auto;
 }

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

@@ -149,10 +149,13 @@ html[dir=rtl] .sapMObjLAttrDiv {
 	width: 50%;
 	text-align: right;
 	vertical-align: top;
+	padding-left: 0.5rem;
 }
 
 html[dir=rtl] .sapMObjLStatusDiv {
 	text-align: left;
+	padding-left: 0;
+	padding-right: 0.5rem;
 }
 
 .sapMObjLAttrRow .sapMObjStatus {

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

@@ -7,7 +7,6 @@
 	display: inline-block;
 	.sapUiIcon {
 		font-size: 1rem;
-		pointer-events: none;
 		color: @sapUiContentMarkerIconColor;
 		&:before {
 			vertical-align: middle;
@@ -16,6 +15,9 @@
 			display: none;
 		}
 	}
+	.sapUiIcon:not(.sapUiIconPointer) {
+		pointer-events: none;
+	}
 	.sapMLnk {
 		overflow: visible;
 		padding-bottom: 1px;

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

@@ -34,6 +34,9 @@
 		content: attr(data-colon);
 		white-space: pre;
 	}
+	.sapMEmptyIndicator{
+		line-height: normal;
+	}
 }
 
 .sapMLIBActive {
@@ -661,6 +664,11 @@ html.sap-desktop .sapMObjStatusActive:focus {
 
 }
 
+html.sap-desktop .sapMOHStatus .sapMObjStatusActive:focus .sapMObjStatusLink::after {
+	left: 1px;
+	right: 1px;
+}
+
 .sapMObjStatus .sapUiPseudoInvisibleText {
 	font-size: 0px;
 }

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

@@ -27,7 +27,7 @@
 	-webkit-text-size-adjust: none;
 
 	font-weight: @sapUiFontHeaderWeight;
-	font-size: @sapMFontHeader4Size;
+	font-size: @sapUiGroupTitleFontSize;
 	font-family: @sapUiFontHeaderFamily;
 	color: @sapUiGroupTitleTextColor;
 }

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

@@ -9,6 +9,9 @@
  /* Buffer width for the scroll bar */
 @_sap_m_Popover_Scroll_Width_Buffer: 20px;
 
+/* Arrow offset from the Popover's corners */
+@_sap_m_Popover_ArrowOffset: 8;
+
 /* shared mixin for arrow shadow*/
 .sapMPopoverArrAfterShadow(@horizontalShadow, @verticalShadow) {
 	box-shadow: @horizontalShadow @verticalShadow 0.750rem 0 fade(@sapUiContentShadowColor, 30), 0 0 0.125rem 0 fade(@sapUiContentShadowColor, 30);
@@ -68,7 +71,7 @@
 	overflow: hidden;
 	background: @sapUiGroupContentBackground;
 	border: none;
-	box-shadow: @sapUiShadowLevel2;
+	box-shadow: @sapUiContentShadow2;
 	border-radius: 0.25rem;
 	min-height: 2rem;
 }
@@ -213,7 +216,7 @@ html[data-sap-ui-browser^="sf"] .sapMPopover {
 	left: 20px;
 	/* position */
 	top: -0.5rem;
-	height: 0.5625rem;
+	height: 0.5rem;
 
 	&:after {
 		margin: 0.1875rem 0 0 0.1875rem;
@@ -226,8 +229,8 @@ html[data-sap-ui-browser^="sf"] .sapMPopover {
 	/* offset */
 	top: 1rem;
 	/* position */
-	right: -0.5625rem;
-	width: 0.5625rem;
+	right: -0.5rem;
+	width: 0.5rem;
 
 	&:after {
 		margin: 0.1875rem 0 0 -0.375rem;
@@ -240,7 +243,7 @@ html[data-sap-ui-browser^="sf"] .sapMPopover {
 	/* offset */
 	left: 1rem;
 	/* position */
-	height: 0.5625rem;
+	height: 0.5rem;
 
 	&:after {
 		margin: -0.375rem 0 0 0.125rem;
@@ -252,9 +255,9 @@ html[data-sap-ui-browser^="sf"] .sapMPopover {
 /* pointing left arrow */
 .sapMPopoverArrLeft {
 	/* position */
-	left: -0.5625rem;
+	left: -0.5rem;
 	top: -2rem;
-	width: 0.5625rem;
+	width: 0.5rem;
 	height: 1rem;
 
 	&:after {

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

@@ -10,6 +10,10 @@
 
 @_sap_m_QuickViewCard_PagePadding: 0;
 
+@_sap_m_QuickView_TitleMarginBottom: 0.5rem;
+@_sap_m_QuickView_TitleFontSize: @sapMFontHeader5Size;
+@_sap_m_QuickView_FormTitleFontSize: @sapMFontHeader5Size;
+
 .sapMQuickView .sapMNav,
 .sapMQuickViewCard .sapMNav {
 	white-space: nowrap;
@@ -104,6 +108,10 @@ html.sap-tablet .sapMQuickViewPage > section {
 .sapMQuickViewCard .sapMQuickViewPage {
 	padding: @_sap_m_QuickViewCard_PagePadding;
 	box-sizing: border-box;
+
+	.sapMTitle {
+		font-size: @_sap_m_QuickView_TitleFontSize;
+	}
 }
 
 .sapMQuickViewPage .sapUiFormResGridCont > div {
@@ -169,7 +177,7 @@ html.sap-phone .sapMQuickViewPage .sapUiHLayout {
 
 .sapMQuickViewPage .sapUiVltCell:first-child {
 	max-height: @_sap_m_QuickView_TitleMaxHeight;
-	margin-bottom: 0.5rem;
+	margin-bottom: @_sap_m_QuickView_TitleMarginBottom;
 	overflow: hidden;
 }
 
@@ -210,7 +218,7 @@ html.sap-tablet .sapMQuickViewHeader {
 .sapMQuickViewPage h3,
 .sapMQuickViewPage .sapUiForm .sapUiFormTitle {
 	font-family: @sapUiFontHeaderFamily;
-	font-size: @sapMFontHeader5Size;
+	font-size: @_sap_m_QuickView_FormTitleFontSize;
 	font-weight: @sapUiFontHeaderWeight;
 	line-height: normal;
 	color: @sapUiGroupTitleTextColor;
@@ -269,6 +277,10 @@ html.sap-tablet.sap-ios .sapMPanel .sapMQuickViewCard {
 	outline: none;
 }
 
+.sapMQuickView .sapMBar {
+	padding-left: 0.75rem;
+}
+
 /* Compact size */
 .sapUiSizeCompact {
 	.sapMQuickViewPage.sapMPage > header.sapMPageHeader {

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

@@ -42,13 +42,19 @@
 	.sapMRbBOut {
 		height: 100%;
 		width: 100%;
-		transform: translate(50%, 50%);
+		transform: translate(0.675rem, 0.675rem);
 		margin: 0.825rem;
 		padding: 1px; /* using padding here so that margin won't collide */
 		stroke: @sapUiFieldBorderColor;
 		fill: @sapUiFieldBackground;
 	}
 }
+.sapUiSizeCompact {
+	.sapMRb .sapMRbB {
+	.sapMRbBOut {
+		transform: translate(0.5rem, 0.5rem);
+	}}
+}
 
 .sapMRbSvg {
 	height: 1.375rem;
@@ -94,7 +100,7 @@
 }
 
 .sapMRbB .sapMRbBInn {
-	transform: translate(50%, 50%);
+	transform: translate(0.675rem, 0.675rem);
 	stroke: transparent;
 	fill: none;
 	-webkit-user-select: none;
@@ -102,6 +108,12 @@
 	r: 22%;
 }
 
+.sapUiSizeCompact {
+	.sapMRbBInn {
+		transform: translate(0.5rem, 0.5rem);
+	}
+}
+
 .sapMRbHasLabel.sapMRb:focus:before {
 	right: 0;
 }
@@ -214,7 +226,13 @@
 html[dir="rtl"] {
 	.sapMRbB .sapMRbBInn,
 	.sapMRb .sapMRbB .sapMRbBOut {
-		transform: translate(-50%, 50%);
+		transform: translate(-0.675rem, 0.675rem);
+	}
+	.sapUiSizeCompact {
+		.sapMRbB .sapMRbBInn,
+		.sapMRb .sapMRbB .sapMRbBOut {
+			transform: translate(-0.675rem, 0.675rem);
+		}
 	}
 }
 

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

@@ -12,6 +12,10 @@
 	margin: 0.8125rem 0;
 }
 
+.sapUiSizeCompact .sapMRI {
+	margin: 0.5rem 0;
+}
+
 html.sap-phone .sapMRI:focus,
 html.sap-tablet .sapMRI:focus {
 	outline: none;

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

@@ -272,10 +272,6 @@ html.sap-desktop {
 	.sapMSinglePCBlockers,
 	.sapMSinglePCAppointments {
 		.sapUiCalendarApp {
-			&.sapUiCalendarAppSel:hover::after {
-				background-color: darken(@sapUiSelected, 10);
-			}
-
 			&:hover::after {
 				background-color: @sapUiListHoverBackground;
 			}
@@ -594,35 +590,13 @@ html.sap-desktop {
 	}
 	.sapMSinglePCBlockers, .sapMSinglePCAppointments {
 
+		&.sapUiCalendarRowVisFilled > .@{class}.sapUiCalendarRowApps:hover > .sapUiCalendarApp:not(.sapUiCalendarAppSel) > .sapUiCalendarAppCont{
+			background-color: @sapUiListHoverBackground;
+		}
 		&.sapUiCalendarRowVisFilled > .@{class}.sapUiCalendarRowApps > .sapUiCalendarApp:not(.sapUiCalendarAppSel) > .sapUiCalendarAppCont{
 			background-color: fade(@bcolor, 90%);
 		}
 	}
-	//Special Dates
-	.sapMSinglePCGrid .@{iitemtypeclass} {
-		&.sapUiCalItem:hover {
-			border-radius: 0.25rem;
-		}
-		//week views
-		&.sapUiCalItem.sapUiCalItemSel .sapUiCalItemText,
-		&.sapUiCalItem .sapUiCalItemText {
-			box-shadow: none;
-		}
-		&.sapUiCalItem:not(.sapUiCalItemSel) {
-			box-shadow: inset 0 -0.25rem 0 @color;
-		}
-		//week views selected
-		&.sapUiCalItem.sapUiCalItemSel {
-			box-shadow: inset 0 -0.25rem 0 @color, inset 0 -0.25rem white;
-			.sapUiCalItemText {
-				box-shadow: none;
-			}
-		}
-		//day view
-		.sapMSinglePCBlockersColumn {
-			box-shadow: inset 0 0.25rem 0 @color;
-		}
-	}
 }
 
 .calendarRowTypeColorMixIn(sapUiCalendarAppType01, sapUiCalItemType01, @_sap_m_SinglePlanningCalendar_sapUiCalendarAppType01, @_sap_m_SinglePlanningCalendar_sapUiCalendarAppBackgroundType01);

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

@@ -29,6 +29,13 @@
 			z-index: 1;
 			color: @sapUiButtonIconColor;
 			pointer-events: none;
+			background-color: transparent;
+			border: 0;
+			.sapMBtnIcon{
+				bottom: 0.6rem;
+				left: 0.9rem;
+				border: 0;
+			}
 			&:focus {
 				outline: none;
 			}
@@ -91,6 +98,17 @@
 	}
 }
 
+.sapUiSizeCompact{
+	.sapMST {
+		.sapMSTMoreIcon {
+			.sapMBtnIcon{
+				left: 0.3rem;
+				bottom: 0.4rem;
+			}
+		}
+	}
+}
+
 .sapMSTWrapper {
 	position: absolute;
 	left: 100%;

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

@@ -22,6 +22,7 @@
 	position: relative;
 	background-repeat: no-repeat;
 	z-index: 1;
+	min-width: 4rem;
 }
 
 .sapUiLocalBusy .sapMSliderInner {
@@ -30,7 +31,8 @@
 
 .sapMSliderInner,
 .sapMSliderProgress {
-	height: 0.188rem;
+	height: 0.25rem;
+	border-radius: 0.25rem;
 }
 
 .sapMSliderProgress,
@@ -39,6 +41,7 @@
 }
 
 .sapMSliderHandle {
+	box-sizing: border-box;
 	display: block;
 	outline: none;
 }
@@ -113,10 +116,11 @@
 /* slider handle */
 .sapMSliderHandle {
 	margin-left: -1rem;
-	top: -0.91rem;
-	height: 1.75rem;
-	width: 1.75rem;
+	top: -0.875rem;
+	height: 2rem;
+	width: 2rem;
 	direction: ltr;
+	cursor: pointer;
 
 	/* 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" */
@@ -125,23 +129,19 @@
 	border-bottom-right-radius: 1rem;
 	border-bottom-left-radius: 1rem;
 
-	&:before{
+	&:focus:before {
 		content: '';
 		position: absolute;
-		width: 100%;
-		left: 50%;
-		top: 40%;
-		transform: translate(-50%, -50%);
-		cursor: pointer;
+		border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+		border-radius: 50%;
+		pointer-events: none;
+		top: -4px;
+		bottom: -4px;
+		left: -4px;
+		right: -4px;
 	}
 }
 
-/* focus */
-html.sap-desktop .sapMSliderHandle:focus {
-	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
-	outline-offset: 0.0625rem;
-}
-
 /* ============ */
 /* compact size */
 /* ============ */
@@ -156,8 +156,8 @@ html.sap-desktop .sapMSliderHandle:focus {
 
 	/* slider handle */
 	.sapMSliderHandle {
-		height: 1.375rem;
-		width: 1.375rem;
+		height: 1.625rem;
+		width: 1.625rem;
 		margin-left: -0.8125rem;
 		top: -0.75rem;
 	}

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

@@ -57,11 +57,6 @@
 	padding-bottom: 0.125rem;
 }
 
-/* flex does not work in IE11 as expected, hence adding width 100% when only title is displayed */
-.sapMSLIDiv:not(.sapMSLIInfoMiddle) > .sapMSLITitleOnly {
-	width: 100%;
-}
-
 .sapMSLITitle,
 .sapMSLITitleOnly {
 	font-size: @sapMFontLargeSize;
@@ -74,7 +69,7 @@
 	color: @sapUiContentLabelColor;
 }
 
-.sapMSLIWithDescription > .sapMLIBContent > .sapMSLIDiv > .sapMSLIDescription {
+.sapMSLIWithDescription .sapMSLIDescription {
 	padding-top: 0.5rem;
 }
 
@@ -124,6 +119,7 @@
 	text-align: right;
 	margin: 0 0 0 1rem;
 	font-size: @sapMFontMediumSize;
+	min-width: 2rem;
 }
 
 .sapMSLIWrapping .sapMSLIInfo {
@@ -145,7 +141,7 @@ html[dir=rtl] .sapMSLIInfo {
 }
 
 .sapMSLIInfoNone {
-	color: @sapUiNeutralText;
+	color: @sapUiContentLabelColor;
 }
 
 .sapMSLIInfoError {
@@ -237,7 +233,7 @@ html[dir=rtl] .sapMSLIInfo {
 .sapMSLIWrapping.sapMSLINoIconInset > .sapMLIBContent > .sapMSLIImgNoInsetIcon,
 .sapMSLIWrapping.sapMSLINoIconInset > .sapMLIBContent > .sapMSLIImgNoInset,
 .sapMSLIWrapping > .sapMLIBContent > .sapMSLIImg {
-	margin-top: 0.75rem;
+	margin-top: 0.725rem;
 }
 
 .sapMSLIWrapping > .sapMLIBContent > .sapMSLIDiv {
@@ -319,5 +315,5 @@ html[dir=rtl] .sapMSLIInfo {
 .sapUiSizeCompact .sapMSLI.sapMSLIWithDescription > .sapMLIBSelectS,
 .sapUiSizeCompact .sapMSLI.sapMSLIWithDescription > .sapMLIBSelectM,
 .sapUiSizeCompact .sapMSLI.sapMSLIWrapping > .sapMLIBContent > .sapMSLIImgIcon {
-	margin-top: 0.5rem;
+	margin-top: 0.725rem;
 }

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

@@ -40,7 +40,7 @@
 
 div.sapMSuggestionsPopover {
 	border: none;
-	box-shadow: @sapUiShadowLevel1;
+	box-shadow: @sapUiContentShadow1;
 }
 
 .sapMSuggestionsPopover.sapMPopover {