@openui5/themelib_sap_belize 1.124.0 → 1.125.0

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

@@ -0,0 +1,78 @@
+/* ========================================== */
+/* CSS for control sap.m/GroupHeaderListItem  */
+/* Base theme                                 */
+/* ========================================== */
+
+.sapMGHLI .sapMLIBUnread,
+.sapMGHLI .sapMLIBSelectM,
+.sapMGHLI .sapMLIBSelectS,
+.sapMGHLI .sapMLIBSelectD,
+.sapMGHLI .sapMTblItemNav,
+.sapMGHLI .sapMListTblSelCol,
+.sapMGHLI .sapMListTblUnreadCol  {
+	display: none;
+}
+
+.sapMGHLIUpperCase {
+	text-transform: uppercase;
+}
+
+.sapMGHLI > .sapMLIBContent,
+.sapMGHLICell > .sapMLIBContent {
+	display: -webkit-box;
+	display: flex;
+	-webkit-box-align: center;
+	align-items: center;
+}
+
+.sapMGHLITitle,
+.sapMGHLICounter {
+	display: block;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.sapMGHLICounter {
+	padding-left: 0.25rem;
+	webkit-box-flex: 0;
+	flex: none;
+}
+
+.sapMGHLI {
+	-webkit-align-items: flex-end;
+	align-items: flex-end;
+}
+
+.sapMListUl .sapMLIB.sapMGHLI {
+	height: 2rem;
+	line-height: 2rem;
+	font-size: @sapMFontHeader6Size;
+	font-weight: @sapUiFontHeaderWeight;
+	color: @sapUiListTableGroupHeaderTextColor;
+	background: @sapUiListGroupHeaderBackground;
+	border-bottom: @sapUiElementBorderWidth solid @sapUiListTableGroupHeaderBorderColor;
+}
+
+.sapMListUl > .sapMLIB.sapMGHLI {
+	background: @sapUiListGroupHeaderBackground;
+	height: @sapUiElementLineHeight;
+	line-height: 2rem;
+	padding-top: 1rem;
+}
+
+.sapMGHLI.sapMLIBActive.sapMLIB,
+.sapMGHLI.sapMLIBActive.sapMLIB > td {
+	color: @sapUiListActiveTextColor;
+	background: @sapUiListActiveBackground;
+}
+
+.sapMGHLICell {
+	padding: 0 1rem;
+}
+
+/* group headers should have background color grey so that they are distinguishable from ListItems */
+.sapMListTbl .sapMGHLI.sapMLIB:not(.sapMLIBActive):not(.sapMLIBSelected):not(:hover),
+.sapMListTbl .sapMGHLI.sapMLIB.sapMLIBTypeInactive {
+	background: @sapUiListTableGroupHeaderBackground;
+}

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

@@ -0,0 +1,298 @@
+/* ====================================== */
+/* CSS for control sap.m/HeaderContainer  */
+/* Base theme                             */
+/* ====================================== */
+
+.sapMHdrCntr {
+	position: relative;
+	display: inline-block;
+	vertical-align: top;
+}
+
+.sapMHdrCntr.Horizontal {
+	max-width: 100%;
+	&.sapMHdrCntrSnapToRow {
+		.sapMScrollContScroll {
+			display: inline-flex;
+			.sapMHdrCntrItemCntr > * {
+				min-height: 100%;
+			}
+		}
+	}
+}
+
+.sapMHdrCntr.Vertical {
+	max-height: 100%;
+}
+
+/* initial condition for hide and display arrow button container*/
+.sapMHdrCntrBtnCntr {
+	display: none;
+}
+
+.sapMHdrCntrBtnCntr.Horizontal {
+	position: absolute;
+	top: 0px;
+	bottom: 0px;
+	width: 2.5rem;
+	&.sapMHdrCntrLeft {
+		left: 0.25rem;
+	}
+	&.sapMHdrCntrRight {
+		right: 0.25rem;
+	}
+}
+
+.sapUiSizeCompact .sapMHdrCntrBtnCntr.Horizontal {
+	&.sapMHdrCntrLeft {
+		left: 0rem;
+	}
+	&.sapMHdrCntrRight {
+		right: 0rem;
+	}
+}
+
+html.sap-phone .sapMHdrCntrBtnCntr.Horizontal,
+html.sap-tablet:not(.sap-desktop) .sapMHdrCntrBtnCntr.Horizontal {
+	width: 1.5rem;
+	&.sapMHdrCntrLeft {
+		left: 0rem;
+	}
+	&.sapMHdrCntrRight {
+		right: 0rem;
+	}
+}
+
+.sapMHdrCntrBtnCntr.Vertical {
+	position: absolute;
+	left: 0px;
+	right: 0px;
+	height: 2.5rem;
+	&.sapMHdrCntrLeft {
+		top: 0.25rem;
+	}
+	&.sapMHdrCntrRight {
+		bottom: 0.25rem;
+	}
+}
+
+html.sap-phone .sapMHdrCntrBtnCntr.Vertical,
+html.sap-tablet:not(.sap-desktop) .sapMHdrCntrBtnCntr.Vertical {
+	height: 1.5rem;
+	&.sapMHdrCntrLeft {
+		top: 0rem;
+	}
+	&.sapMHdrCntrRight {
+		bottom: 0rem;
+	}
+}
+
+.sapMHdrCntrBtnCntr.Horizontal > .sapMHdrCntrBtn {
+	position: absolute;
+	top: 50%;
+	margin-top: -1.5rem;
+	min-width: 1.375rem;
+}
+
+.sapUiSizeCompact .sapMHdrCntrBtnCntr.Horizontal > .sapMHdrCntrBtn {
+	right: 0.25rem;
+	margin-top: -1rem;
+}
+
+html.sap-phone .sapMHdrCntrBtnCntr.Horizontal > .sapMHdrCntrBtn,
+html.sap-tablet:not(.sap-desktop) .sapMHdrCntrBtnCntr.Horizontal > .sapMHdrCntrBtn {
+	margin-top: -0.6rem;
+	font-size: 1rem;
+}
+
+.sapMHdrCntrBtnCntr.Vertical > .sapMHdrCntrBtn {
+	position: absolute;
+	height: 2.5rem;
+	left: 50%;
+	margin-left: -1.5rem;
+	padding: 0px;
+}
+
+html.sap-phone .sapMHdrCntrBtnCntr.Vertical > .sapMHdrCntrBtn,
+html.sap-tablet:not(.sap-desktop) .sapMHdrCntrBtnCntr.Vertical > .sapMHdrCntrBtn {
+	margin-left: -0.375rem;
+	font-size: 1rem;
+	height: 1.375rem;
+}
+
+.sapMHdrCntrBtnCntr.Vertical > .sapMHdrCntrBtn.sapMHdrCntrRight {
+	bottom: 0px;
+}
+
+.sapMHdrCntrCntr.Horizontal {
+	white-space: nowrap;
+}
+
+.sapUiSizeCompact .sapMHrdrLeftPadding .sapMHdrCntrCntr.Horizontal {
+	padding-left: 2.5rem;
+}
+
+.sapMHrdrLeftPadding .sapMHdrCntrCntr.Horizontal {
+	padding-left: 3rem;
+}
+
+.sapUiSizeCompact .sapMHrdrRightPadding .sapMHdrCntrCntr.Horizontal {
+	padding-right: 2.5rem;
+}
+
+.sapMHrdrRightPadding .sapMHdrCntrCntr.Horizontal {
+	padding-right: 3rem;
+}
+
+html.sap-phone .sapMHrdrLeftPadding .sapMHdrCntrCntr.Horizontal,
+html.sap-tablet:not(.sap-desktop) .sapMHrdrLeftPadding .sapMHdrCntrCntr.Horizontal {
+	padding-left: 1.5rem;
+}
+
+html.sap-phone .sapMHrdrRightPadding .sapMHdrCntrCntr.Horizontal,
+html.sap-tablet:not(.sap-desktop) .sapMHrdrRightPadding .sapMHdrCntrCntr.Horizontal {
+	padding-right: 1.5rem;
+}
+
+.sapMHdrCntrCntr.Vertical {
+	height: 100%;
+	box-sizing: border-box;
+}
+
+.sapMHrdrTopPadding .sapMHdrCntrCntr.Vertical {
+	padding-top: 3rem;
+}
+
+.sapUiSizeCompact .sapMHrdrTopPadding .sapMHdrCntrCntr.Vertical {
+	padding-top: 2.5rem;
+}
+
+.sapMHrdrBottomPadding .sapMHdrCntrCntr.Vertical {
+	padding-bottom: 3rem;
+}
+
+.sapUiSizeCompact .sapMHrdrBottomPadding .sapMHdrCntrCntr.Vertical {
+	padding-bottom: 2.5rem;
+}
+
+html.sap-phone .sapMHrdrTopPadding .sapMHdrCntrCntr.Vertical,
+html.sap-tablet:not(.sap-desktop) .sapMHrdrTopPadding .sapMHdrCntrCntr.Vertical {
+	padding-top: 1.5rem;
+}
+
+html.sap-phone .sapMHrdrBottomPadding .sapMHdrCntrCntr.Vertical,
+html.sap-tablet:not(.sap-desktop) .sapMHrdrBottomPadding .sapMHdrCntrCntr.Vertical {
+	padding-bottom: 1.5rem;
+}
+
+.sapMHdrCntr .sapMScrollContScroll:focus {
+	outline: none;
+}
+
+.sapMHrdrCntrInner {
+	border: 1px solid transparent;
+	position: relative;
+	vertical-align: top;
+	margin: 0.0625rem;
+	padding: 0rem 0.375rem 0rem 0.375rem;
+	overflow: visible;
+}
+
+.sapMHdrCntrCntr.Vertical .sapMHrdrCntrInner {
+	float: left;
+	clear: left;
+}
+
+.sapMHdrCntrCntr.Horizontal .sapMHrdrCntrInner:not(div:first-of-type) {
+	margin-left: 1rem;
+}
+
+.sapMHdrCntrCntr.Vertical .sapMHrdrCntrInner:not(div:first-of-type) {
+	margin-top: 1rem;
+}
+
+.sapMHrdrCntrDvdrs .sapMHrdrCntrInner:not(:first-child)::after {
+	content: "";
+	position: absolute;
+	box-sizing: border-box;
+	display: inline-block;
+}
+
+.sapMHrdrCntrDvdrs.Horizontal .sapMHrdrCntrInner::after {
+	top: 0.375rem;
+	bottom: 0.375rem;
+	left: -0.6rem;
+	border-left: 1px solid @sapUiListBorderColor;
+}
+
+.sapMHrdrCntrDvdrs.Vertical .sapMHrdrCntrInner::after {
+	left: 0.5rem;
+	right: 0.5rem;
+	top: -0.6rem;
+	border-top: 1px solid @sapUiListBorderColor;
+}
+
+.sapMKTileBorder {
+	display: none;
+}
+
+.sapMHdrPddngRight2 {
+	padding-right: 2rem;
+}
+
+.sapMHdrPddngRight0 {
+	padding-right: 0rem;
+}
+
+.sapMHdrPddngLeft2 {
+	padding-left: 2rem;
+}
+
+.sapMHdrPddngleft0 {
+	padding-left: 0rem;
+}
+.sapMHdrCntrItemCntr {
+	display: inline-block;
+}
+
+.sapMHdrCntrBGTransparent {
+	background-color: @sapUiObjectHeaderBackground;
+}
+
+.sapMHdrCntrBGSolid {
+	background-color: @sapUiObjectHeaderBackground;
+}
+
+.sapMHdrCntrBGTranslucent {
+	background-color: @sapUiObjectHeaderBackground;
+}
+
+html.sap-desktop .sapMHrdrCntrInner:focus {
+	outline: none;
+	border: 1px dotted @sapUiContentFocusColor;
+}
+
+@media (min-width:320px) and (max-width:599px){
+    .sapMHdrCntrCntr.Horizontal .sapMHrdrCntrInner {
+		margin-left: 0rem !important;
+		padding: 0rem 0.5rem 0rem 0.5rem !important;
+	}
+	
+	.sapMHdrCntrCntr.Horizontal .sapMHrdrCntrInner:last-of-type {
+		padding-right: 1rem !important;
+	}
+
+	.sapMHrdrCntrDvdrs.Horizontal .sapMHrdrCntrInner::after {
+		left: 0.4rem;
+		border-left: 1px solid @sapUiListBorderColor;
+	}
+	
+	html[dir=rtl] .sapMHdrCntrCntr.Horizontal .sapMHrdrCntrInner {
+		margin-right: 0rem !important;
+		padding: 0rem 0.5rem 0rem 0.5rem !important;
+	}
+	
+	html[dir=rtl]  .sapMHdrCntrCntr.Horizontal .sapMHrdrCntrInner:last-of-type {
+		padding-left: 1rem !important;
+	}
+}