@openui5/themelib_sap_belize 1.124.1 → 1.125.0

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

@@ -0,0 +1,152 @@
+/* ================================ */
+/* CSS for control sap.m/SuggestionsPopover  */
+/* Base theme                       */
+/* ================================ */
+
+@_sap_m_SuggestionsPopover_ItemMinHeight: 2.5rem;
+@_sap_m_SuggestionsPopover_ItemMinHeightCompact: 2rem;
+@_sap_m_SuggestionsPopover_GroupItemHeight: 2.75rem;
+@_sap_m_SuggestionsPopover_GroupItemHeightCompact: 2.75rem;
+
+@_sap_m_SuggestionsPopover_TabularItemHeight: 2.5rem;
+@_sap_m_SuggestionsPopover_TabularItemHeightCompact: 2rem;
+@_sap_m_SuggestionsPopover_TabularGroupItemHeight: 2.5rem;
+@_sap_m_SuggestionsPopover_TabularGroupItemHeightCompact: 2rem;
+
+.sapMSuggestionsPopover {
+	.sapMListUl > .sapMLIB.sapMSLIWrapping {
+		min-height: @_sap_m_SuggestionsPopover_ItemMinHeight;
+	}
+
+	.sapMSLIWrapping > .sapMLIBContent > .sapMSLIDiv {
+		padding: 0.25rem 0rem;
+	}
+
+	.sapMListUl > .sapMLIB.sapMGHLI {
+		height: @_sap_m_SuggestionsPopover_GroupItemHeight;
+	}
+
+	.sapMListTbl .sapMLIB {
+		height: @_sap_m_SuggestionsPopover_TabularItemHeight;
+	}
+
+	.sapMListTbl .sapMListTblHeader,
+	.sapMListTbl .sapMLIB.sapMGHLI {
+		height: @_sap_m_SuggestionsPopover_TabularGroupItemHeight;
+	}
+
+	.sapMListTbl .sapMListTblHeader .sapMColumnHeader,
+	.sapMListTbl .sapMLIB .sapMListTblCell {
+		padding-top: 0.625rem;
+		padding-bottom: 0.625rem;
+	}
+}
+
+div.sapMSuggestionsPopover {
+	border: none;
+	box-shadow: @sapUiContentShadow1;
+}
+
+.sapMSuggestionsPopover.sapMPopover.sapMSuggestionPopoverDefaultWidth {
+	max-width: 40rem;
+}
+
+.sapMSuggestionsPopover.sapMPopover:not(.sapMSuggestionPopoverDefaultWidth):not(.sapMSuggestionPopoverInputWidth) {
+	max-width: ~"calc(100% - 2rem)" !important;
+}
+
+.sapMSuggestionsPopover.sapMPopover .sapMPopoverCont {
+	max-width: 100% !important;
+}
+
+.sapUiSizeCompact {
+	.sapMSuggestionsPopover,
+	&.sapMSuggestionsPopover {
+
+		.sapMListUl > .sapMLIB.sapMSLIWrapping {
+			min-height: @_sap_m_SuggestionsPopover_ItemMinHeightCompact;
+		}
+
+		.sapMSLIWrapping > .sapMLIBContent > .sapMSLIDiv {
+			padding: 0.25rem 0;
+		}
+
+		.sapMListUl > .sapMLIB.sapMGHLI {
+			height: @_sap_m_SuggestionsPopover_GroupItemHeightCompact;
+		}
+
+		.sapMListTbl .sapMLIB {
+			height: @_sap_m_SuggestionsPopover_TabularItemHeightCompact;
+		}
+
+		.sapMListTbl .sapMListTblHeader,
+		.sapMListTbl .sapMLIB.sapMGHLI {
+			height: @_sap_m_SuggestionsPopover_TabularGroupItemHeightCompact;
+		}
+
+		.sapMListTbl .sapMListTblHeader .sapMColumnHeader,
+		.sapMListTbl .sapMLIB .sapMListTblCell {
+			padding-top: 0.25rem;
+			padding-bottom: 0.25rem;
+		}
+	}
+}
+
+.sapMDialog.sapMSuggestionsPopover .sapMDialogScroll .sapMDialogScrollCont {
+	padding: 0;
+}
+
+.sapMInputSuggestionTableHidden {
+	display: none;
+}
+
+.sapMSuggestionsPopover .sapMDLIValue {
+	font-size: @sapMFontMediumSize;
+	color: @sapUiListTextColor;
+	padding-right: 1rem;
+}
+
+.sapMSuggestionsPopover .sapMLIBActive .sapMDLIValue {
+	color: @sapUiListActiveTextColor;
+}
+
+.sapMSuggestionsPopover .sapMDLILabel {
+	font-size: @sapMFontMediumSize;
+}
+
+.sapMSuggestionsPopover .sapMSLITitleOnly {
+	font-size: @sapMFontMediumSize;
+}
+
+div.sapMSuggestionsPopover .sapMSuggestionsPopoverValueState {
+	font-size: @sapMFontSmallSize;
+	line-height: normal;
+	padding: 0.5625rem 1rem;
+
+	&.sapMSuggestionsPopoverErrorState {
+		background: @sapUiErrorBG;
+		color: @sapUiBaseText;
+	}
+
+	&.sapMSuggestionsPopoverInformationState {
+		background: @sapUiInformationBG;
+	}
+
+	&.sapMSuggestionsPopoverSuccessState {
+		background: @sapUiSuccessBG;
+		color: @sapUiBaseText;
+	}
+
+	&.sapMSuggestionsPopoverWarningState {
+		background: @sapUiWarningBG;
+		color: @sapUiBaseText;
+	}
+
+	.sapMSuggestionsPopoverTitle.sapMTitle {
+		padding-left: 0.75rem;
+	}
+}
+
+.sapMSuggestionsPopover .sapMSuggestionsPopoverNoneState {
+	display: none;
+}

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

@@ -0,0 +1,68 @@
+/* ============================== */
+/* CSS for control sap.m/Support  */
+/* Base theme                     */
+/* ============================== */
+
+html.sap-phone .sapMSupport .sapMDialogScrollCont {
+	padding : 0;
+}
+
+.sapMSupport .sapUiSupportLabel{
+	font-weight: bold;
+}
+
+.sapMSupport .sapUiSupportTechInfoBorder {
+	border: 1px solid @sapUiListBorderColor;
+}
+
+.sapMSupport .sapUiSupportTxtFld,
+.sapMSupport .sapUiSupportBtn {
+	border: 1px solid @sapUiFieldBorderColor;
+	font-size: 14px;
+	height: 22px;
+	box-sizing: border-box;
+	margin-left:10px;
+}
+
+.sapMSupport .sapUiSupportTxtArea {
+	width: 100%;
+	height: 50px;
+	margin-top: 5px;
+	resize: none;
+	box-sizing: border-box;
+}
+
+.sapMSupport .sapUiSupportPnlLbl {
+	display: block;
+}
+
+.sapMSupport .sapUiSupportDiv {
+	margin-top: 5px;
+}
+
+.sapMSupport .sapUiSupportTxtFld {
+	background-color: @sapUiFieldBackground;
+	padding: 1px;
+}
+
+.sapMSupport .sapUiSupportTxtFld:focus {
+	outline: 1px dashed @sapUiContentFocusColor;
+	outline-offset: 2px;
+}
+
+.sapMSupport .sapUiSupportBtn {
+	background-color: @sapUiButtonBackground;
+	border-color: @sapUiButtonBorderColor;
+	padding-bottom: 3px;
+	cursor: pointer;
+}
+
+.sapMSupport .sapUiSupportBtn:focus,
+.sapMSupport .sapUiSupportBtn.sapUiSupportRunningTrace {
+	outline: 1px dashed @sapUiContentFocusColor;
+	outline-offset: 2px;
+}
+
+.sapMSupport .sapUiSupportBtn.sapUiSupportRunningTrace {
+	cursor: default;
+}

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

@@ -0,0 +1,338 @@
+/* ============================= */
+/* CSS for control sap.m/Switch  */
+/* Base theme                    */
+/* ============================= */
+
+/* ------------------------------ */
+/* Switch required variables      */
+/* ------------------------------ */
+
+@_sap_m_Switch_OnPosition: -32;
+@_sap_m_Switch_OffPosition: 0;
+@_sap_m_Switch_TransitionTime: 175;
+
+/* ------------------------------ */
+/* Switch common styles           */
+/* ------------------------------ */
+
+.sapMSwtText,
+.sapMSwtHandle,
+.sapMSwtInner {
+	position: absolute;
+}
+
+.sapMSwtCont,
+.sapMSwt {
+	position: relative;
+}
+
+.sapMSwtText,
+.sapMSwtAcceptReject .sapMSwtHandle {
+	box-sizing: border-box;
+}
+
+/* ------------------------------ */
+/* Switch container               */
+/* ------------------------------ */
+
+.sapMSwtCont {
+	display: inline-block;
+	vertical-align: top;
+	outline: none;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	user-select: none;
+	padding: 0.5rem 0 0.5rem 0;
+}
+
+.sapMSwtCont:not(.sapMSwtContDisabled) {
+	cursor: pointer;
+}
+
+.sapMSwtCont > input {
+	display: none;
+}
+
+/* ------------------------------ */
+/* Switch                         */
+/* ------------------------------ */
+
+.sapMSwt {
+	outline: none;
+
+	width: 4rem;
+	height: 2rem;
+
+	/* use px instead of rem, borders sized in "rem" disappear when the page is zoomed out in Chrome. */
+	border: 1px solid;
+
+	/* 1px margin from left and right, so the outline doesn't get cropped when focuses */
+	margin: 0 1px;
+
+	/* 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: 1rem;
+	border-top-right-radius: 1rem;
+	border-bottom-right-radius: 1rem;
+	border-bottom-left-radius: 1rem;
+	overflow: hidden;
+}
+
+/* background */
+
+.sapMSwtOn:not(.sapMSwtAcceptReject) {
+	background: @sapUiToggleButtonPressedBackground;
+	border-color: @sapUiToggleButtonPressedBorderColor;
+}
+
+.sapMSwtOff:not(.sapMSwtAcceptReject) {
+	background: @sapUiButtonBackground;
+	border-color: @sapUiButtonBorderColor;
+}
+
+/* hover */
+
+.sapMSwt.sapMSwtHoverable:hover {
+	background: @sapUiButtonHoverBackground;
+}
+
+.sapMSwt.sapMSwtHoverable:not(.sapMSwtAcceptReject):hover {
+	border-color: @sapUiButtonHoverBorderColor;
+}
+
+.sapMSwtHoverable.sapMSwtOn:not(.sapMSwtAcceptReject):hover {
+	background: @sapUiToggleButtonPressedHoverBackground;
+	border-color: @sapUiToggleButtonPressedHoverBorderColor;
+}
+
+/* focus */
+
+.sapMSwtDisabled:focus {
+	outline: none;
+}
+
+/* ------------------------------ */
+/* Switch inner                   */
+/* ------------------------------ */
+
+.sapMSwtInner {
+	width: 100%;
+	height: 100%;
+}
+
+.sapMSwtOff > .sapMSwtInner {
+	left: -2rem;
+}
+
+.sapMSwtOn > .sapMSwtInner {
+	left: 0;
+}
+
+/* CSS transitions */
+
+.sapMSwtTrans > .sapMSwtInner {
+	-webkit-transition: left 0.125s ease-in-out;
+	transition: left 0.125s ease-in-out;
+}
+
+html[dir=rtl] .sapMSwtTrans > .sapMSwtInner {
+	-webkit-transition-property: right;
+	transition-property: right;
+}
+
+/* ------------------------------ */
+/* Switch text                    */
+/* ------------------------------ */
+
+.sapMSwtText {
+	text-align: center;
+	font-size: @sapMFontSmallSize;
+	width: 100%;
+	line-height: 2rem;
+}
+
+.sapMSwtLabel {
+	display: block;
+	white-space: nowrap;
+	text-decoration: none;
+	overflow: hidden;
+	width: 1.875rem;
+	padding: 0 0.1875rem;
+	text-transform: uppercase;
+	line-height: inherit;
+}
+
+.sapMSwtOn .sapMSwtText {
+	color: @sapUiToggleButtonPressedTextColor;
+}
+
+.sapMSwtOff .sapMSwtText {
+	color: @sapUiContentLabelColor;
+}
+
+.sapMSwtTextOff {
+	left: 2rem;
+}
+
+.sapMSwtLabelOff {
+	float: right;
+}
+
+.sapMSwt.sapMSwtDefault {
+	&.sapMSwtOff .sapMSwtTextOn,
+	&.sapMSwtOn .sapMSwtTextOff {
+		.sapMSwtLabel {
+			// Special case - the currently invisible label should be smaller
+			// so the text won't get in the visible part of the control
+			width: 1.6rem;
+		}
+	}
+}
+
+/* ------------------------------ */
+/* Switch handler                 */
+/* ------------------------------ */
+
+.sapMSwtHandle {
+	display: block;
+	top: 0;
+	bottom: 0;
+	margin: auto;
+	width: 1.5rem;
+	height: 1.5rem;
+	left: 2.25rem;
+
+	// 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.75rem;
+	border-top-right-radius: 0.75rem;
+	border-bottom-right-radius: 0.75rem;
+	border-bottom-left-radius: 0.75rem;
+	-webkit-background-clip: padding-box;
+	background-clip: padding-box;
+}
+
+/* background */
+
+.sapMSwtOn .sapMSwtHandle {
+	background: transparent;
+	box-sizing: border-box;
+	border: 2px solid contrast(@sapUiToggleButtonPressedBackground, @sapUiContentIconColor, @sapUiContentContrastIconColor, @sapUiContentContrastTextThreshold);
+}
+
+.sapMSwtOff .sapMSwtHandle {
+	background: transparent;
+	box-sizing: border-box;
+	border: 2px solid @sapUiButtonBorderColor;
+}
+
+/* ====================================================== */
+/* switch type "AcceptReject"                             */
+/* ====================================================== */
+
+/* ----------------------------------------- */
+/* Switch type "AcceptReject" common styles  */
+/* ----------------------------------------- */
+
+/* background */
+
+.sapMSwtAcceptReject.sapMSwtOn {
+	border-color: @sapUiPositiveElement;
+}
+
+.sapMSwtAcceptReject.sapMSwtOff {
+	border-color: @sapUiNegativeElement;
+}
+
+/* ------------------------------ */
+/* Switch                         */
+/* ------------------------------ */
+
+/* background */
+
+.sapMSwtAcceptReject.sapMSwt {
+	background: @sapUiButtonBackground;
+}
+
+/* ------------------------------ */
+/* Switch text                    */
+/* ------------------------------ */
+
+.sapMSwtAcceptReject .sapMSwtLabelOn::before,
+.sapMSwtAcceptReject .sapMSwtLabelOff::before {
+	font-family: 'SAP-icons';
+	speak: none;
+}
+
+/* icon fonts */
+
+.sapMSwtAcceptReject .sapMSwtLabel {
+	font-size: @sapMFontLargeSize;
+}
+
+.sapMSwtAcceptReject .sapMSwtLabelOn::before {
+	content: "\e05b";
+	color: @sapUiPositiveElement;
+}
+
+.sapMSwtAcceptReject .sapMSwtLabelOff::before {
+	content: "\e03e";
+	color: @sapUiNegativeElement;
+}
+
+/* ------------------------------ */
+/* Switch handler                 */
+/* ------------------------------ */
+
+.sapMSwtAcceptReject .sapMSwtHandle {
+	background: transparent;
+	border-style: solid;
+	border-width: 0.125rem;
+}
+
+.sapMSwtAcceptReject.sapMSwtOn .sapMSwtHandle {
+	border-color: @sapUiPositiveElement;
+}
+
+.sapMSwtAcceptReject.sapMSwtOff .sapMSwtHandle {
+	border-color: @sapUiNegativeElement;
+}
+
+/* ============ */
+/* compact size */
+/* ============ */
+
+/* ------------------------------ */
+/* Switch container               */
+/* ------------------------------ */
+
+.sapUiSizeCompact .sapMSwtCont {
+	padding-top: 0.125rem;
+	padding-bottom: 0.125rem;
+}
+
+/* ------------------------------ */
+/* Switch                         */
+/* ------------------------------ */
+
+.sapUiSizeCompact .sapMSwt {
+	width: 3.5rem;
+	height: 1.625rem;
+}
+
+/* ------------------------------ */
+/* Switch text                    */
+/* ------------------------------ */
+
+.sapUiSizeCompact .sapMSwtText {
+	line-height: 1.625rem;
+}
+
+/* ------------------------------ */
+/* Switch handler                 */
+/* ------------------------------ */
+
+.sapUiSizeCompact .sapMSwtHandle {
+	height: 1rem;
+	width: 1rem;
+}

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

@@ -0,0 +1,43 @@
+/* =================================== */
+/* CSS for control sap.m/TabContainer  */
+/* Base theme                          */
+/* =================================== */
+
+.sapMTabContainer {
+	display: -webkit-flex;
+	display: flex;
+	-webkit-flex-direction: column;
+	flex-direction: column;
+	height: 100%;
+	.sapMTabContainerContent {
+		position: relative;
+		-webkit-flex-grow: 1;
+		flex-grow: 1;
+		.sapMTabContainerInnerContent {
+			position: absolute;
+			top: 0;
+			bottom: 0;
+			left: 0;
+			right: 0;
+			overflow-x: scroll;
+		}
+	}
+}
+
+/* mixin call for creating container content padding classes (arguments: rootContainer, contentSelector) */
+.sapUiContainerContentPadding(~".sapMTabContainer", ~"> .sapMTabContainerContent > .sapMTabContainerInnerContent");
+
+.sapMTabContainer {
+	.sapMTabContainerContentTransparent{
+		background-color: transparent;
+	}
+	.sapMTabContainerContentList{
+		background-color: @sapUiGroupContentBackground;
+	}
+	.sapMTabContainerContentSolid{
+		background-color: @sapUiShellBackground;
+	}
+	.sapMTabContainerContentStandard{
+		background-color: @sapUiBaseBG;
+	}
+}