@openui5/themelib_sap_belize 1.124.0 → 1.125.0

package/src/sap/m/themes/sap_belize_base/MessagePage.less

@@ -0,0 +1,110 @@
+/* ================================== */
+/* CSS for control sap.m/MessagePage  */
+/* Base theme                         */
+/* ================================== */
+
+/* MessagePage general styles */
+.sapMMessagePage {
+	width: 100%;
+	height: 100%;
+	background: @sapUiGlobalBackgroundColor;
+	position: relative;
+}
+
+.sapMMessagePageInner {
+	box-sizing: border-box;
+	display: flex;
+	padding: 1rem;
+	position: absolute;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	overflow-y: auto;
+}
+
+/* Allow MessagePage to be positioned inside ObjectPage */
+.sapUxAPBlockContainer .sapMMessagePageInner {
+	position: static;
+}
+
+.sapMMessagePageContentWrapper {
+	margin: auto;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	transform: translateY(-1rem);
+	width: 30rem;
+	max-width: 100%;
+}
+
+.sapMMessagePage > .sapMBar + .sapMMessagePageInner {
+	top: 3rem;
+}
+
+/* MessagePage inner controls styles*/
+.sapMMessagePage {
+	.sapMMessagePageInner {
+		.sapMMessagePageIcon.sapUiIcon::before {
+			font-size: 6rem;
+			color: @sapUiContentNonInteractiveIconColor;
+		}
+
+		& > .sapMMessagePageContentWrapper > * {
+			max-width: 100%;
+		}
+	}
+
+	.sapMMessagePageMainText {
+		font-size: 1.5rem;
+		line-height: 2rem;
+		margin-top: 1rem;
+	}
+
+	.sapMText.sapMMessagePageMainText {
+		color: @sapUiGroupTitleTextColor;
+		font-size: @sapMFontHeader2Size;
+	}
+
+	.sapMMessagePageDescription {
+		font-size: 1rem;
+		margin-top: 1rem;
+
+		.sapMLnk {
+			font-size: 1rem;
+		}
+	}
+
+	.sapMText.sapMMessagePageDescription {
+		color: @sapUiContentLabelColor;
+		font-size: @sapMFontHeader5Size;
+	}
+
+	.sapMMessagePageButtonsWrapper {
+		margin-top: 2rem;
+		text-align: center;
+	}
+
+	.sapMBtn {
+		margin: 0 0.25rem;
+	}
+}
+
+.sapUiSizeCompact .sapMMessagePage > .sapMBar {
+	height: 2.5rem;
+
+	.sapMBarPH,
+	.sapMBarLeft {
+		height: 2.5rem;
+		padding-top: 0.25rem;
+		padding-bottom: 0.25rem;
+	}
+
+	.sapMBarMiddle {
+		height: 2.5rem;
+	}
+
+	&+ .sapMMessagePageInner {
+		top: 2.5rem;
+	}
+}

package/src/sap/m/themes/sap_belize_base/MessagePopover.less

@@ -0,0 +1,66 @@
+/* ===================================== */
+/* CSS for control sap.m/MessagePopover  */
+/* Base theme                            */
+/* ===================================== */
+
+.sapMMsgPopover.sapMMsgPopover-init {
+	.sapMNavItem.sapMPage {
+		position: relative;
+	}
+
+	.sapMIBar {
+		border-bottom: 0;
+	}
+}
+
+.sapMMsgPopoverCloseBtn {
+	.sapMBtnIcon {
+		width: 2.5rem;
+		height: 2.5rem;
+		font-size: 1rem;
+	}
+}
+
+/* Compact size */
+.sapUiSizeCompact.sapMMsgPopover {
+	.sapMMsgPopoverCloseBtn .sapMBtnIcon {
+		width: 1.626rem;
+		height: 1.626rem;
+		font-size: 0.75rem;
+	}
+
+	.sapMMsgPopoverCloseBtn .sapMBtnIcon {
+		margin-right: 0;
+	}
+
+	.sapMBtnCustomIcon  {
+		margin-left: 0;
+	}
+}
+
+.sapMPopover.sapMMsgPopover.sapMMsgPopover-init {
+	.sapMPopoverArr:after {
+		border-top-color: @sapUiPageHeaderBackground;
+	}
+}
+
+.sapMMsgPopoverCloseBtn .sapMBtnIcon {
+	color: @sapUiButtonIconColor;
+}
+
+// style links in the description as Link control
+.sapMMsgPopoverDescriptionText a {
+	text-decoration: none;
+	color: @sapUiLink;
+	&:hover {
+		text-decoration: underline;
+		color: @sapUiLinkHover;
+	}
+	&:visited {
+		text-decoration: none;
+		color: @sapUiLinkVisited;
+	}
+	&:active {
+		color: @sapUiLinkActive;
+	}
+}

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

@@ -0,0 +1,128 @@
+/* =================================== */
+/* CSS for control sap.m/MessageStrip  */
+/* Base theme                          */
+/* =================================== */
+
+.sapMMsgStrip {
+	border: 1px solid;
+	border-radius: 0.1875rem;
+	box-sizing: border-box;
+	font-size: @sapMFontMediumSize;
+	font-weight: normal;
+	padding: 0.4375rem 1rem;
+	position: relative;
+	min-height: 2rem;
+
+	&[data-sap-ui-ms-closable='true'] > .sapMMsgStripMessage {
+		margin-right: 1.25rem;
+	}
+}
+
+html[data-sap-ui-animation='on'] {
+	.sapMMsgStrip {
+		-webkit-transition: opacity 0.2s;
+		transition: opacity 0.2s;
+	}
+
+	.sapMMsgStripCloseButton {
+		-webkit-transition: color 0.1s;
+		transition: color 0.1s;
+	}
+}
+
+.sapMMsgStripClosing {
+	opacity: 0;
+}
+
+.sapMMsgStripIcon {
+	position: absolute;
+	left: 0;
+	width: 2.5rem;
+	font-size: 1rem;
+	text-align: center;
+
+	& ~ .sapMMsgStripMessage {
+		margin-left: 1.5rem;
+	}
+}
+
+.sapMMsgStripMessage {
+	max-height: 10rem;
+	overflow: auto;
+
+	& > .sapMText,
+	& > .sapMFT,
+	& > .sapMLnk {
+		display: inline;
+	}
+
+	& > .sapMLnk {
+		margin-left: 0.25rem;
+
+		&:not(.sapMLnkDsbl) {
+			text-shadow: @sapUiContentTextShadow;
+		}
+	}
+
+	& > .sapMText {
+		line-height: 1.2;
+	}
+
+}
+
+.sapMMsgStripCloseButton {
+	position: absolute;
+	top: -0.5625rem;
+	right: 0.125rem;
+}
+
+.sapUiSizeCompact .sapMMsgStripCloseButton {
+	top: -0.0625rem;
+}
+
+
+.sapMMsgStripCloseButton {
+	position: absolute;
+	top: -0.5625rem;
+	right: 0.125rem;
+}
+
+.sapMMsgStripInformation {
+	background-color: @sapUiNeutralBG;
+	border-color: @sapUiNeutralBorder;
+	color: @sapUiBaseText;
+
+	& .sapMMsgStripIcon {
+		color: @sapUiNeutralElement;
+	}
+}
+
+.sapMMsgStripSuccess {
+	background-color: @sapUiSuccessBG;
+	border-color: @sapUiSuccessBorder;
+	color: @sapUiBaseText;
+
+	& .sapMMsgStripIcon {
+		color: @sapUiPositiveElement;
+	}
+}
+
+.sapMMsgStripWarning {
+	background-color: @sapUiWarningBG;
+	border-color: @sapUiWarningBorder;
+	color: @sapUiBaseText;
+
+	& .sapMMsgStripIcon {
+		color: @sapUiCriticalElement;
+	}
+}
+
+.sapMMsgStripError {
+	background-color: @sapUiErrorBG;
+	border-color: @sapUiErrorBorder;
+	color: @sapUiBaseText;
+
+	& .sapMMsgStripIcon {
+		color: @sapUiNegativeElement;
+	}
+}

package/src/sap/m/themes/sap_belize_base/MessageToast.less

@@ -0,0 +1,31 @@
+/* =================================== */
+/* CSS for control sap.m/MessageToast  */
+/* Base theme                          */
+/* =================================== */
+
+.sapMMessageToast {
+	box-sizing: border-box;
+	position: absolute;
+	max-width: 15rem;
+	word-wrap: break-word;
+	text-align: center;
+	text-decoration: none;
+	text-overflow: ellipsis;
+	overflow: hidden;
+	white-space: pre-line;
+	font-size: @sapFontSize;
+	font-family: @sapUiFontFamily;
+	font-weight: normal;
+	padding: 1rem;
+	background: @sapUiListBackground;
+	color: @sapUiListTextColor;
+	box-shadow: @sapUiContentShadow2;
+	border-radius: @sapUiElementBorderCornerRadius;
+}
+
+.sapMMessageToast.sapMFocus {
+	outline-width: @sapUiContentFocusWidth;
+	outline-style: @sapUiContentFocusStyle;
+	outline-color: @sapUiContentFocusColor;
+	outline-offset: -@sapUiContentFocusWidth;
+}

package/src/sap/m/themes/sap_belize_base/MessageView.less

@@ -0,0 +1,257 @@
+/* ===================================== */
+/* CSS for control sap.m/MessagePopover  */
+/* Base theme                            */
+/* ===================================== */
+@_sap_m_MessageView_DescIcon_Width: 3rem;
+
+.sapMMsgView {
+	height: 100%;
+
+	.sapMSegBBtnMixed .sapMSegBBtnInner {
+		padding-left: 0;
+		padding-right: 0;
+	}
+
+	.sapMDialogScrollCont {
+		padding: 0;
+	}
+
+	.sapMIBar .sapMBarChild {
+		margin-left: .25rem;
+		margin-right: .25rem;
+	}
+
+	.sapMMsgViewTitleText,
+	.sapMMsgViewDescriptionText {
+		margin: 1rem 1rem 0 3rem;
+		a.sapMLnkMaxWidth,
+		&.sapMLnkMaxWidth {
+			white-space: normal;
+		}
+	}
+
+	.sapMMsgViewDescriptionText {
+		padding-bottom: 1rem;
+		font-size: @sapMFontMediumSize;
+		display: block;
+	}
+
+	.sapMMsgViewDescriptionLink {
+		display: block;
+		margin: 1rem 0 0 3rem;
+	}
+
+	.sapMMsgViewDescriptionText:empty {
+		display: none;
+	}
+
+	.sapMMsgViewTitleText {
+		vertical-align: middle;
+		font-size: @sapMFontHeader5Size;
+	}
+
+	.sapMMsgViewItem {
+		padding-left: 0;
+
+		&.sapMSLIWithDescription {
+			height: 3.3125rem;
+		}
+		&:not(.sapMSLIWithDescription) {
+			height: 2.75rem;
+		}
+
+		.sapMSLIImgIcon {
+			margin-left: 0;
+		}
+	}
+
+	.sapMSLIDescription {
+		margin-top: 0.125rem;
+		font-family: @sapUiFontFamily;
+		font-size:  @sapMFontMediumSize;
+		color: @sapUiContentLabelColor;
+	}
+
+	.sapMSLITitle {
+		font-family: @sapUiFontHeaderFamily;
+		font-size: @sapMFontHeader5Size;
+		font-weight: @sapUiFontHeaderWeight;
+		color: @sapUiGroupTitleTextColor;
+
+		.sapMLnk {
+			display: block;
+		}
+	}
+
+	.sapMSLITitleOnly {
+		font-size: @sapMFontHeader5Size;
+	}
+
+	.sapMLIB.sapMLIBActive {
+		.sapMSLIImgIcon {
+			color: @sapUiListActiveTextColor;
+		}
+	}
+
+	.sapMSLIDescIcon .sapMSLIDescription {
+		margin-top: 0.125rem;
+	}
+
+	.sapMSLIInfo {
+		margin: 0;
+	}
+
+	.sapMTextMaxWidth {
+		max-width: ~"calc(100% - @{_sap_m_MessageView_DescIcon_Width})";
+	}
+
+	.sapMSLITitle, .sapMSLITitleOnly,
+	.sapMSLIWithDescription > .sapMLIBContent > .sapMSLIDiv > .sapMSLIDescription {
+		padding: 0;
+	}
+
+	.sapMMsgViewHiddenContainer {
+		display: none;
+	}
+
+	// remove the truncation behavior, when a list item does not need it
+	// (if it needs to have a truncation we change the item type to navigation)
+	.sapMMsgViewItem:not(.sapMLIBTypeNavigation) .sapMSLITitleOnly {
+		text-overflow: clip;
+	}
+}
+
+.sapMMsgViewDescIcon {
+	position: absolute;
+	left: 0;
+	width: @_sap_m_MessageView_DescIcon_Width;
+	top: .7rem;
+	font-size: 1.35rem;
+}
+
+.sapMMsgViewItemActive {
+
+	& .sapMLnk {
+		font-size: @sapMFontHeader5Size;
+	}
+
+	& .sapMSLITitleOnly {
+		display: flex;
+		align-items: center;
+	}
+}
+
+/* Compact size */
+.sapUiSizeCompact .sapMMsgView {
+	&.sapMPopoverArrUp:after,
+	&.sapMPopoverWithoutBar.sapMPopoverNav.sapMPopoverWithHeaderCont > .sapMPopoverArrUp:after,
+	&.sapMPopoverWithoutBar.sapMPopoverPage.sapMPopoverWithHeaderCont > .sapMPopoverArrUp:after {
+		bottom: -9px;
+		left: -8px;
+	}
+
+	.sapMMsgViewItem {
+		padding-left: 0;
+
+		&.sapMSLIWithDescription {
+			height: 3.25rem;
+		}
+	}
+
+	.sapMMsgViewItemActive .sapMLnk {
+		font-size: @sapMFontHeader6Size;
+	}
+
+	.sapMMsgViewItem:not(.sapMSLIWithDescription) {
+		height: 2rem;
+	}
+
+	.sapMMsgViewItem:not(.sapMSLIWithDescription) .sapMLIBImgNav.sapUiIcon {
+		height: 2rem;
+		line-height: 2rem;
+	}
+
+	.sapMMsgViewItem .sapMLIBImgNav.sapUiIcon {
+		height: 3.4375rem;
+		line-height: 3.4375rem;
+	}
+
+	.sapMMsgViewCloseBtn .sapMBtnIcon {
+		width: 1.626rem;
+		height: 1.626rem;
+		font-size: 0.75rem;
+	}
+
+	.sapMList .sapMLIBContent .sapUiIcon {
+		font-size: 1rem;
+	}
+
+	.sapMBtnInner {
+		padding: 0;
+	}
+
+	.sapMMsgViewBackBtn .sapMBtnIcon {
+		margin-right: 0;
+	}
+
+	.sapMBtnCustomIcon  {
+		margin-left: 0;
+	}
+
+	.sapMMsgViewDescIcon {
+		width: @_sap_m_MessageView_DescIcon_Width;
+		height: 1.626rem;
+		line-height: 1.626rem;
+		font-size: 1rem;
+	}
+
+	.sapMSLIDescription {
+		margin-top: 0;
+	}
+
+	.sapMSLITitle, .sapMSLITitleOnly {
+		font-size: @sapMFontHeader6Size;
+	}
+
+	.sapMSLIDescIcon .sapMSLITitle,
+	.sapMSLIDescIcon .sapMSLIDescription {
+		margin-top: 0.125rem;
+		margin-bottom: 0.125rem;
+	}
+}
+
+.sapMMsgViewCloseBtn .sapMBtnIcon {
+	color: @sapUiButtonIconColor;
+}
+
+.sapMMsgViewItemSuccess .sapMSLIImgIcon,
+.sapMMsgViewBtnSuccess.sapMSegBBtn .sapUiIcon,
+.sapMMsgViewDescIconSuccess {
+	color: @sapUiPositiveElement;
+}
+
+.sapMMsgViewItemWarning .sapMSLIImgIcon,
+.sapMMsgViewBtnWarning.sapMSegBBtn .sapUiIcon,
+.sapMMsgViewDescIconWarning {
+	color: @sapUiCriticalElement;
+}
+
+.sapMMsgViewItemError .sapMSLIImgIcon,
+.sapMMsgViewBtnError.sapMSegBBtn .sapUiIcon,
+.sapMMsgViewDescIconError {
+	color: @sapUiNegativeElement;
+}
+
+.sapMMsgViewItemInformation .sapMSLIImgIcon,
+.sapMMsgViewBtnInformation.sapMSegBBtn .sapUiIcon,
+.sapMMsgViewDescIconInformation {
+	color: @sapInformativeElementColor;
+}
+
+.sapMMsgViewItem .sapMSLIIconActive {
+	color: @sapUiContentContrastIconColor;
+}
+
+.sapMMsgViewDescriptionText a.sapMLnk {
+	overflow: visible;
+}