@openui5/sap.m/src/sap/m/themes/base/MessagePage.less

OpenUI5 UI Library sap.m

/* ================================== */
/* 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: -ms-flexbox;
	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: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack:center; // needed to vertically center content only in IE
	align-items: center;
	transform: translateY(-1rem);
	width: 30rem;
	max-width: 100%;
}

.sapMMessagePage > .sapMBar + .sapMMessagePageInner {
	top: 3rem;
}

/* MessagePage inner controls styles*/
.sapMMessagePage {
	.sapMMessagePageInner {
		.sapUiIcon::before {
			font-size: 6rem;
			color: @sapUiContentNonInteractiveIconColor;
		}

		& > .sapMMessagePageContentWrapper > * {
			-ms-flex-negative: 0;
			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;
	}
}