@openui5/themelib_sap_belize 1.124.2 → 1.126.0

package/src/sap/ui/rta/themes/sap_belize_base/Overlay.less

@@ -0,0 +1,271 @@
+/******************************************************************
+	Style of the RTA Overlays - base Theme
+*******************************************************************/
+@_sap_ui_rta_Overlay_PersButtonBG: @sapUiButtonSelectedBackground; //#8fb5ff
+@_sap_ui_rta_Overlay_PersButtonBorder: @sapUiButtonLiteBorderColor; // #fff
+@_sap_ui_rta_Overlay_PersButtonIcon: @sapUiButtonBackground; // #fff
+@_sap_ui_rta_Overlay_BorderColor: @sapUiSelected; //#8fb5ff
+@_sap_ui_rta_Overlay_HoverBorder: @sapUiFieldHoverBackground; //#fff;
+@_sap_ui_rta_Overlay_HoverBG: fade(@sapUiSelected, 5%); //rgba(143, 181, 255, 0.05);
+@_sap_ui_rta_Overlay_ErrorBorder: @sapUiErrorBorder; //#ff0000
+@_sap_ui_rta_Overlay_BoxShadow: @sapUiUx3ToolPopupShadow; //0px 6px 12px 0px fade(black, 30);
+@_sap_ui_rta_Overlay_ShellBG: darken(desaturate(@sapUiChart1, 48%), 14%); //#435060
+@_sap_ui_rta_Overlay_PlaceholderBG: lighten(@sapUiFieldReadOnlyBackground, 20%); // #e6e6e6
+
+.sapUiRtaRoot {
+	.sapUiRtaMarginBottom {
+		margin-bottom: 2.5rem; //40px
+	}
+
+	.sapUiRtaPaddingTop {
+		padding-top: 2.5rem; //40px
+	}
+
+	&.sapUiRtaStretchPaddingTop, .sapUiRtaStretchPaddingTop {
+		padding-top: 1.5rem; //24px
+	}
+}
+
+.sapUiSizeCozy .sapUiRtaRoot .sapUiRtaStretchPaddingTop, .sapUiSizeCozy .sapUiRtaRoot.sapUiRtaStretchPaddingTop {
+	padding-top: 2rem; //32px
+}
+
+.sapUiRta {
+	&.sapUiRtaPersonalize {
+		.sapUiRtaPersDelete {
+			.sapUiRtaPersDeleteClick {
+				.sapUiRtaPersDeleteIconOuter {
+					.sapMBtn {
+						top: 0.625rem; //10px
+						right: 0.625rem; //10px
+						position: absolute;
+						height: 1.5rem; //24px
+						padding: 0;
+
+						.sapMBtnInner {
+							border-radius: 50%;
+							width: 1.5rem; //24px
+							height: 1.5rem; //24px
+							min-width: 1.5rem; //24px
+							background-color: @_sap_ui_rta_Overlay_PersButtonBG;
+							box-shadow: 0 0 0.25rem rgba(0, 0, 0, 0.2);
+							cursor: pointer;
+							border: 0.125rem solid @_sap_ui_rta_Overlay_PersButtonBorder; //2px
+
+							.sapUiIcon {
+								color: @_sap_ui_rta_Overlay_PersButtonIcon;
+								font-size: 0.69rem; //11px
+								line-height: 1.25rem; //20px
+							}
+						}
+					}
+				}
+			}
+
+			&.sapUiRtaOverlayPlaceholder {
+				.sapUiRtaPersDeleteClick {
+					display: none;
+				}
+			}
+		}
+
+		.sapUiRtaPersAdd, .sapUiRtaPersAddTop {
+			.sapUiRtaPersAddIconOuter {
+				position: absolute;
+				text-align: center;
+				width: 100%;
+
+				.sapMBtn {
+					height: 100%;
+					padding: 0;
+
+					.sapMBtnInner {
+						border: none;
+						background-color: transparent;
+
+						.sapMBtnIcon {
+							font-size: 1rem; //16px
+						}
+					}
+				}
+			}
+		}
+
+		.sapUiRtaPersAdd {
+			> .sapUiRtaPersAddIconOuter {
+				bottom: -2.5rem; //40px
+				top: auto;
+			}
+		}
+	}
+
+	.sapUiDtOverlayTargetZone {
+		&:after {
+			transition: box-shadow .25s;
+			box-shadow: @_sap_ui_rta_Overlay_BoxShadow;
+		}
+
+		> .sapUiDtOverlayChildren {
+			> .sapUiRtaOverlayPlaceholder {
+				border: none;
+			}
+		}
+
+		&.sapUiDtOverlayDropZone > .sapUiDtOverlayChildren > .sapUiRtaOverlayPlaceholder {
+			background: transparent;
+		}
+	}
+
+	.sapUiDtOverlayDropZone {
+		> .sapUiDtOverlayChildren {
+			> .sapUiRtaOverlayPlaceholder {
+				background: @_sap_ui_rta_Overlay_PlaceholderBG !important;
+				// no "border"
+				&:after {
+					content: none;
+				}
+
+				// no "focus" border
+				&:focus {
+					&:before {
+						content: none;
+					}
+				}
+
+				// all descendants
+				* {
+					background: @_sap_ui_rta_Overlay_PlaceholderBG;
+					// no "border"
+					&:after {
+						content: none;
+					}
+
+					// no "focus" border
+					&:focus {
+						&:before {
+							content: none;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	.sapUiRtaEditableField {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+
+		> div:hover {
+			cursor: text !important;
+		}
+	}
+
+	.sapUiDtDragGhost {
+		box-shadow: @_sap_ui_rta_Overlay_BoxShadow;
+	}
+}
+
+.sapUiRta:not(.sapUiRtaVisualizationMode) {
+	.sapUiRtaOverlayHover {
+		-webkit-transition: background 0.1s cubic-bezier(1, .01, 1, 0);
+		-moz-transition: background 0.1s cubic-bezier(1, .01, 1, 0);
+		-o-transition: background 0.1s cubic-bezier(1, .01, 1, 0);
+		transition: background 0.1s cubic-bezier(1, .01, 1, 0);
+		background: @_sap_ui_rta_Overlay_HoverBG;
+
+		&:after {
+			content: " ";
+			border: 0.0625rem solid @_sap_ui_rta_Overlay_HoverBorder; //1px
+			transition: box-shadow .25s;
+			box-shadow: @_sap_ui_rta_Overlay_BoxShadow;
+			outline: 0.0625rem solid @_sap_ui_rta_Overlay_BorderColor; //1px
+			outline-offset: -0.0625rem; //1px
+		}
+	}
+
+	.sapUiRtaResizeHandle {
+		cursor: col-resize;
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		width: 0.625rem; // 10px
+		background-clip: content-box;
+		background-color: @_sap_ui_rta_Overlay_BorderColor;
+		-webkit-user-select: none;
+		user-select: none;
+
+		&:before {
+			content: "";
+			position: absolute;
+			top: 10%;
+			bottom: 10%;
+			left: 37.5%;
+			border-left: 0.0625rem solid @sapUiHighlightTextColor; //1px
+		}
+
+		&:after {
+			content: "";
+			position: absolute;
+			top: 25%;
+			bottom: 25%;
+			left: 62.5%;
+			border-left: 0.0625rem solid @sapUiHighlightTextColor; //1px
+		}
+	}
+
+	.sapUiRtaResizeHandleExtension {
+		position: relative;
+		top: 0;
+		bottom: 0;
+		width: 0.5rem; // 8px
+		border-right: 0.125rem dotted @_sap_ui_rta_Overlay_BorderColor; // 2px
+		background-clip: content-box;
+		-webkit-user-select: none;
+		user-select: none;
+	}
+
+	.sapUiRtaFullScreenDiv {
+		width: 100%;
+		height: 100%;
+		top: 0;
+		left: 0;
+		display: block;
+		position: fixed;
+	}
+
+	.sapUiDtOverlaySelected {
+		transition: box-shadow .25s;
+		box-shadow: @_sap_ui_rta_Overlay_BoxShadow;
+
+		&:after {
+			outline-color: @_sap_ui_rta_Overlay_BorderColor;
+		}
+
+		&.sapUiRtaErrorBg:after {
+			outline: 0.125rem solid @_sap_ui_rta_Overlay_ErrorBorder; //2px
+			outline-offset: -0.125rem; //2px
+			border: none
+		}
+	}
+}
+
+.sapUiRtaMode #shell-shapes {
+	display: none;
+}
+
+.sapUiRtaMode .sapUiShellBackgroundImage.sapUiGlobalBackgroundImageForce.sapUshellShellBG {
+	background-color: @_sap_ui_rta_Overlay_ShellBG;
+	background-image: none;
+}
+
+.sapUiRtaMode .sapUshellViewPortCenter,
+.sapUiRtaMode .sapMShellBG {
+	background: @_sap_ui_rta_Overlay_ShellBG;
+}
+
+.sapUiRtaMode .sapUiBlockLayerOnly {
+	background-color: initial;
+}

package/src/sap/ui/rta/themes/sap_belize_base/OverlayWithScrollbar.less

@@ -0,0 +1,61 @@
+/******************************************************************
+	Style of the RTA OverlayWithScrollBar - base Theme
+*******************************************************************/
+
+.sapUiRta .sapUiDtOverlayWithScrollBar {
+	&.sapUiDtOverlaySelected {
+		&.sapUiDtOverlayWithScrollBarVertical {
+			&:after {
+				inset-inline-end: var(--sap-ui-rta-scrollbar-scrollWidth) !important;
+			}
+		}
+
+		&.sapUiDtOverlayWithScrollBarHorizontal {
+			&:after {
+				inset-block-end: var(--sap-ui-rta-scrollbar-scrollWidth) !important;
+			}
+		}
+
+		&.sapUiDtOverlayFocusable {
+			&.sapUiDtOverlayWithScrollBarVertical {
+				&:focus:before {
+					inset-inline-end: var(--sap-ui-rta-scrollbar-scrollWidthPlusTwo) !important;
+				}
+			}
+
+			&.sapUiDtOverlayWithScrollBarHorizontal {
+				&:focus:before {
+					inset-block-end: var(--sap-ui-rta-scrollbar-scrollWidthPlusTwo) !important;
+				}
+			}
+		}
+	}
+
+	&.sapUiDtOverlayFocusable {
+		&.sapUiDtOverlayWithScrollBarHorizontal {
+			&:focus:before {
+				inset-block-end: var(--sap-ui-rta-scrollbar-scrollWidth) !important;
+			}
+		}
+
+		&.sapUiDtOverlayWithScrollBarVertical {
+			&:focus:before {
+				inset-inline-end: var(--sap-ui-rta-scrollbar-scrollWidth) !important;
+			}
+		}
+	}
+
+	&.sapUiRtaOverlayHover {
+		&.sapUiDtOverlayWithScrollBarHorizontal {
+			&:after {
+				inset-block-end: var(--sap-ui-rta-scrollbar-scrollWidth) !important;
+			}
+		}
+
+		&.sapUiDtOverlayWithScrollBarVertical {
+			&:after {
+				inset-inline-end: var(--sap-ui-rta-scrollbar-scrollWidth) !important;
+			}
+		}
+	}
+}

package/src/sap/ui/rta/themes/sap_belize_base/Toolbar.adaptation.less

@@ -0,0 +1,299 @@
+/******************************************************************
+	Style of the RTA Toolbar (type: adaptation) - base Theme
+*******************************************************************/
+@_sap_ui_rta_Toolbar_Adaptation_BaseColor: darken(desaturate(@sapUiChart1, 48%), 14%); //#435060
+@_sap_ui_rta_Toolbar_Adaptation_BaseColorLight: lighten(@_sap_ui_rta_Toolbar_Adaptation_BaseColor, 5%); //#4d5d6f
+@_sap_ui_rta_Toolbar_Adaptation_TextColor: @sapUiTextInverted; //#fff
+@_sap_ui_rta_Toolbar_Adaptation_BtnFocusBorder: @sapUiTextInverted; //#fff
+@_sap_ui_rta_Toolbar_Adaptation_BtnHoverBG: @sapUiSegmentedButtonHoverBackground; //#ec8b46
+@_sap_ui_rta_Toolbar_Adaptation_BorderColor: @sapUiLightBorder; //#808080
+@_sap_ui_rta_Toolbar_Adaptation_DraftVersionColor: lighten(@sapUiActive, 20%); //#f5c5a3
+@_sap_ui_rta_Toolbar_Adaptation_ActiveVersionColor: lighten(@sapUiContentHelpColor, 66%); //#b7ffb7
+@_sap_ui_rta_Toolbar_Adaptation_BoxShadow_DarkColor: @sapUiDarkShadowTint; // #000
+@_sap_ui_rta_Toolbar_Adaptation_BoxShadow_LightColor: @sapUiLightShadowTint; // #fff
+@_sap_ui_rta_Toolbar_Adaptation_BtnHoverText: @sapUiTextInverted; //#fff
+@_sap_ui_rta_Toolbar_Adaptation_SegBBtnHoverTextColor: @sapUiTextInverted; //#fff
+@_sap_ui_rta_Toolbar_Adaptation_FocusOutlineCol: @sapUiTextInverted; //#fff
+@_sap_ui_rta_Toolbar_Adaptation_VersionHistoryHover: darken(@_sap_ui_rta_Toolbar_Adaptation_BaseColor, 5%);
+
+.sapUiRtaMode {
+
+	.sapUiRtaToolbar.sapUiRtaToolbarAdaptation {
+
+		.sapMHBox.sapMFlexBox:first-child.sapMTBShrinkItem {
+			min-width: 0; /* Overrider '.sapMTBShrinkItem' */
+		}
+
+		.sapMHBox.sapMFlexBox:last-child {
+			.sapMFlexItem:first-child {
+				.sapMSegB {
+					margin-left: 0;
+				}
+			}
+		}
+
+		.sapMFlexBox {
+			margin-left: 0;
+			height: 2.5rem; //40px
+		}
+
+		// Disable the right margin for Exit button
+		> .sapMFlexItem:last-child {
+			> .sapMFlexItem:last-child {
+				.sapMBtn:last-child {
+					margin-right: 0;
+				}
+			}
+		}
+
+		.sapMBtn {
+			padding: 0;
+			height: 2.5rem; //40px
+			margin: 0 0.25rem; //4px
+
+			&.sapMBtnDisabled .sapMBtnInner {
+				opacity: 0.5;
+			}
+
+			&:focus .sapMFocusable {
+				outline: none;
+				border: 0.0625rem dotted @_sap_ui_rta_Toolbar_Adaptation_BtnFocusBorder; //1px
+			}
+
+			&:hover:not(.sapMBtnDisabled) {
+				> .sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBtnEmphasized) {
+					background-color: @_sap_ui_rta_Toolbar_Adaptation_BtnHoverBG;
+
+					.sapUiIcon {
+						color: @_sap_ui_rta_Toolbar_Adaptation_BtnHoverText;
+					}
+				}
+			}
+
+			&:hover {
+				> .sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed) bdi {
+					color: @_sap_ui_rta_Toolbar_Adaptation_BtnHoverText;
+				}
+			}
+		}
+
+		.sapMTBStandard {
+			height: 2.5rem; //40px
+			border-bottom: none;
+			background: @_sap_ui_rta_Toolbar_Adaptation_BaseColor;
+		}
+
+		.sapMBtnTransparent,
+		:not(.sapMBtnDisabled) .sapMBtnTransparent > .sapMBtnIcon,
+		:not(.sapMBtnDisabled) .sapMBtnGhost > .sapMBtnIcon,
+		:not(.sapMBtnDisabled) .sapMMenuBtn.sapMMenuBtnRegular .sapMBtnInner::after {
+			color: @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+		}
+
+		.sapMSegB {
+			.sapMSegBBtn {
+				&:not(:hover) {
+					.sapMSegBBtnInner {
+						background-color: @_sap_ui_rta_Toolbar_Adaptation_BaseColor;
+					}
+				}
+
+				.sapMSegBBtnInner {
+					color: @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+					border: none;
+					position: relative;
+
+					.sapUiIcon {
+						color: @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+					}
+				}
+
+				&.sapMSegBBtnFocusable {
+					&:hover .sapMSegBBtnInner,
+					&.sapMSegBBtnSel:hover .sapMSegBBtnInner {
+						color: @_sap_ui_rta_Toolbar_Adaptation_SegBBtnHoverTextColor;
+
+						.sapUiIcon {
+							color: @_sap_ui_rta_Toolbar_Adaptation_SegBBtnHoverTextColor;
+						}
+					}
+
+					&:focus .sapMSegBBtnInner {
+						outline: 0.0625rem dotted @_sap_ui_rta_Toolbar_Adaptation_FocusOutlineCol; //1px
+						outline-offset: -0.0625rem; //1px
+					}
+
+					&.sapMSegBBtnSel {
+						& .sapMSegBBtnInner::after {
+							position: absolute;
+							display: block;
+							content: '';
+							border-bottom: 0.125rem solid @_sap_ui_rta_Toolbar_Adaptation_TextColor; //2px
+							left: 0.375rem; //6px
+							right: 0.375rem; //6px
+							bottom: 0.125rem; //2px
+						}
+					}
+				}
+			}
+		}
+
+		.sapUiRtaVersionButton.sapUiRtaDraftVersionAccent > span > span > bdi {
+			color: @_sap_ui_rta_Toolbar_Adaptation_DraftVersionColor;
+		}
+
+		.sapUiRtaVersionButton.sapUiRtaActiveVersionAccent > span > span > bdi {
+			color: @_sap_ui_rta_Toolbar_Adaptation_ActiveVersionColor;
+		}
+
+		.sapUiRtaToolbarVisualizationSelection li:first-child {
+			border-bottom: 0.0625rem solid @_sap_ui_rta_Toolbar_Adaptation_BorderColor; //1px
+		}
+
+		.sapUiRtaToolbarActionsSection > div:first-child {
+			width: 100%;
+		}
+
+		.sapUiRtaToolbarIconAndDraftSection > div {
+			width: 100%;
+		}
+
+		.sapUiRtaToolbarSwitcherSection > div {
+			width: 100% !important;
+		}
+	}
+
+	.sapUiRtaVersionHistory {
+		background-color: @_sap_ui_rta_Toolbar_Adaptation_BaseColor;
+		box-shadow: 0.375rem 0.625rem 2rem fade(@_sap_ui_rta_Toolbar_Adaptation_BoxShadow_DarkColor, 30),
+		0.125rem 0.375rem 1rem fade(@_sap_ui_rta_Toolbar_Adaptation_BoxShadow_DarkColor, 60),
+		0 0 0 0.0625rem fade(@_sap_ui_rta_Toolbar_Adaptation_BoxShadow_LightColor, 20),
+		0 0.0625rem 0 0 fade(@_sap_ui_rta_Toolbar_Adaptation_BoxShadow_LightColor, 20); //10px 20px 6px 6px 1px 1px
+
+		.sapMGHLITitle {
+			color: @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+		}
+
+		.sapMListUl > .sapMLIB {
+			background: @_sap_ui_rta_Toolbar_Adaptation_BaseColor;
+		}
+
+		.sapMLIBHighlightWarning {
+			background: @_sap_ui_rta_Toolbar_Adaptation_DraftVersionColor;
+		}
+
+		.sapMLIBHighlightWarning ~ .sapMLIBContent .sapMFeedListItemTextString {
+			color: @_sap_ui_rta_Toolbar_Adaptation_DraftVersionColor;
+		}
+
+		.sapMLIBHighlightSuccess {
+			background: @_sap_ui_rta_Toolbar_Adaptation_ActiveVersionColor;
+		}
+
+		.sapUiRtaVersionsList {
+			border-bottom: 0.125rem solid @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+			.sapMLIBTypeInactive {
+				&.sapMLIBFocusable:focus {
+					outline: none;
+				}
+				.sapMLIBContent {
+					margin-top: -1rem;
+				}
+				.sapMGHLITitle {
+					cursor: default;
+					text-align: center;
+					width: 100%;
+				}
+			}
+			.sapMListUl .sapMLIB.sapMGHLI {
+				border-bottom: 0.0625rem solid @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+				background: @_sap_ui_rta_Toolbar_Adaptation_BaseColorLight;
+				box-shadow: none;
+			}
+		}
+
+		.sapMLIBHighlightSuccess ~ .sapMLIBContent .sapMFeedListItemTextString {
+			color: @_sap_ui_rta_Toolbar_Adaptation_ActiveVersionColor;
+		}
+
+		.sapMLIBHighlightSuccess ~ .sapMLIBContent .sapMFeedListItemInfoText,
+		.sapMLIBHighlightSuccess ~ .sapMLIBContent .sapMFeedListItemTimestampText {
+			color: @_sap_ui_rta_Toolbar_Adaptation_ActiveVersionColor;
+		}
+
+		.sapMFeedListItemTextString {
+			color: @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+			cursor: pointer;
+		}
+
+		.sapMFeedListItemFooter,
+		.sapMFeedListItemTimestampText,
+		.sapMFeedListItemInfoText {
+			color: @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+			cursor: pointer;
+		}
+
+		.sapMFeedListShowSeparatorsAll.sapMLIB,
+		.sapMListTblCell,
+		.sapMListTblNavCol {
+			background-color: @_sap_ui_rta_Toolbar_Adaptation_BaseColor;
+			border: 0;
+		}
+		.sapMPopoverArr:after {
+			background-color: lighten(@_sap_ui_rta_Toolbar_Adaptation_BaseColor, 10%);
+			border: 0;
+		}
+
+		.sapMLIBFocusable:focus {
+			outline: 0.0625rem dotted @_sap_ui_rta_Toolbar_Adaptation_TextColor;
+			outline-offset: calc(-0.0625rem - 0.0625rem);
+		}
+
+		.sapMLIBHoverable:hover {
+			background: @_sap_ui_rta_Toolbar_Adaptation_VersionHistoryHover;
+		}
+	}
+}
+
+.sapUiSizeCozy.sapUiRtaMode {
+	.sapUiRtaToolbar {
+		.sapMSegB {
+			.sapMSegBBtn.sapMSegBBtnFocusable.sapMSegBBtnSel {
+				& .sapMSegBBtnInner:after {
+					bottom: 0.375rem; //6px
+					left: 0.5625rem; //9px
+					right: 0.5625rem; //9px
+				}
+			}
+		}
+	}
+}
+
+.sapUiRtaIconAndDraftToolbar {
+	// fit-content is required for the intersection observer
+	width: fit-content;
+	justify-content: flex-start;
+}
+
+.sapUiRtaActionsToolbar {
+	// fit-content is required for the intersection observer
+	width: fit-content;
+	justify-content: flex-end;
+}
+
+// the default hbox width which is set via the element properties must be overruled
+.sapUiRtaToolbarIconAndDraftSection,
+.sapUiRtaToolbarActionsSection {
+	// display grid is required so the toolbar is positioned on the end into the section hbox
+	display: grid;
+	width: ~"calc(50% - 12.5rem) !important"; //200px
+}
+
+.sapUiRtaVersionButton {
+	max-width: 12.5rem; //200px
+	min-width: 3rem; //48px
+}
+
+.sapUiRtaToolbarSwitcherSection {
+	width: auto;
+}

package/src/sap/ui/rta/themes/sap_belize_base/Toolbar.base.less

@@ -0,0 +1,42 @@
+/******************************************************************
+	Style of the RTA Toolbar (all types) - base Theme
+*******************************************************************/
+@_sap_ui_rta_Toolbar_Base_TextColor: @sapUiTextInverted; //#fff
+@_sap_ui_rta_Toolbar_Base_BaseColor: darken(desaturate(@sapUiChart1, 48%), 14%); //#435060
+@_sap_ui_rta_Toolbar_Base_BaseBG: darken(desaturate(@sapUiChart1, 48%), 14%); //#435060
+@_sap_ui_rta_Toolbar_Base_BoxShadow_DarkColor: @sapUiDarkShadowTint; // #000
+@_sap_ui_rta_Toolbar_Base_BoxShadow_LightColor: @sapUiLightShadowTint; // #fff
+@_sap_ui_rta_Toolbar_Border_Image: repeating-linear-gradient(-45deg,
+@_sap_ui_rta_Toolbar_Base_BaseColor,
+@_sap_ui_rta_Toolbar_Base_BaseColor 0.25rem,
+@_sap_ui_rta_Toolbar_Base_TextColor 0.25rem,
+@_sap_ui_rta_Toolbar_Base_TextColor 0.375rem) 4;
+
+@_sap_ui_rta_Toolbar_Box_Shadow: 0.375rem 0.625rem 2rem fade(@_sap_ui_rta_Toolbar_Base_BoxShadow_DarkColor, 30),
+0.125rem 0.375rem 1rem fade(@_sap_ui_rta_Toolbar_Base_BoxShadow_DarkColor, 60),
+0 0 0 0.0625rem fade(@_sap_ui_rta_Toolbar_Base_BoxShadow_LightColor, 20),
+0 0.0625rem 0 0 fade(@_sap_ui_rta_Toolbar_Base_BoxShadow_LightColor, 20);
+
+.sapUiRtaMode {
+
+	.sapUiRtaMarginTopForToolbar {
+		margin-top: 3rem; //48px
+	}
+
+	.sapUiRtaToolbar {
+		border: 0.125rem solid @_sap_ui_rta_Toolbar_Base_TextColor; //2px
+		border-image: @_sap_ui_rta_Toolbar_Border_Image;
+		box-shadow: @_sap_ui_rta_Toolbar_Box_Shadow;
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		padding-left: 1.25rem; //20px
+		height: 2.75rem; /* Overrider `.sapUiSizeCompact .sapMTB` */ //44px
+		background-color: @_sap_ui_rta_Toolbar_Base_BaseBG;
+
+		&.sapUiRtaToolbar_scrolling {
+			position: fixed!important;
+		}
+	}
+}

package/src/sap/ui/rta/themes/sap_belize_base/Toolbar.fiori.less

@@ -0,0 +1,21 @@
+/**
+	This class is being assigned to the original Fiori Header Toolbar when RTA Toolbar shows
+ */
+
+.sapUiRtaFioriHeaderInvisible {
+	visibility: hidden;
+}
+
+/* type: fiori */
+.sapUiRtaToolbar.type_fiori {
+	transition: opacity 0.25s ease-out;
+	opacity: 0;
+
+	.sapMImg {
+		height: 2.5rem !important; // 40px
+	}
+
+	&.is_visible {
+		opacity: 1;
+	}
+}

package/src/sap/ui/rta/themes/sap_belize_base/Toolbar.standalone.less

@@ -0,0 +1,12 @@
+/******************************************************************
+	Style of the RTA Standalone Toolbar - base Theme
+*******************************************************************/
+.sapUiRtaToolbar.type_standalone.color_default {
+	top: -3.125rem; //50px;
+	transition: top 0.25s ease-out;
+	height: 3rem; //48p
+
+	&.is_visible {
+		top: 0;
+	}
+}