@openui5/sap.tnt 1.99.1 → 1.102.0

package/.eslintrc.json

@@ -0,0 +1,18 @@
+{
+	"overrides": [
+		/*
+		 * Productive code, sample and unit test code of sap.tnt has been cleaned up.
+		 * No more references to the global jQuery allowed
+		 */
+		{
+			"files": [
+				"src/**/*.js",
+				"test/sap/tnt/demokit/**/*.js",
+				"test/sap/tnt/qunit/**/*.js"
+			],
+			"globals": {
+				"jQuery": "off"
+			}
+		}
+	]
+}

package/THIRDPARTY.txt

@@ -400,7 +400,7 @@ Contained in: src/sap.ui.mdc/test/sap/ui/mdc/sample/field/filterfieldwithoperato
 
 Library: sap.ui.webc.common:
 
-Component: UI5 Web Components, version: 1.0.0-rc.12
+Component: UI5 Web Components, version: 1.1.2
 Copyright: SAP
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
@@ -411,7 +411,7 @@ Contained in: src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/base/*.*
 	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-tnt/*.*
 	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-business-suite/*.*
 
-Component: lit-html, version: 1.4.1
+Component: lit-html, version: 2.0.1
 Copyright: Google LLC
 License: BSD-3-Clause
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/BSD-3-Clause.txt
@@ -420,7 +420,7 @@ Contained in: src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/lit-html/
 
 Library: sap.ui.webc.fiori:
 
-Component: UI5 Web Components, version: 1.0.0-rc.12
+Component: UI5 Web Components, version: 1.1.2
 Copyright: SAP
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
@@ -429,7 +429,7 @@ Contained in: src/sap.ui.webc.fiori/src/sap/ui/webc/fiori/thirdparty/*.*
 
 Library: sap.ui.webc.main:
 
-Component: UI5 Web Components, version: 1.0.0-rc.12
+Component: UI5 Web Components, version: 1.1.2
 Copyright: SAP
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
@@ -450,7 +450,7 @@ License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
 Contained in: lib/jsdoc/ui5/plugin.js
 
-Component: SAP Theming Base Content, version: 11.1.34
+Component: SAP Theming Base Content, version: 11.1.39
 Copyright: SAP SE or an SAP affiliate company and Theming Base Content contributors
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/sap.tnt",
-  "version": "1.99.1",
+  "version": "1.102.0",
   "description": "OpenUI5 UI Library sap.tnt",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -14,7 +14,7 @@
     "url": "https://github.com/SAP/openui5.git"
   },
   "dependencies": {
-    "@openui5/sap.m": "1.99.1",
-    "@openui5/sap.ui.core": "1.99.1"
+    "@openui5/sap.m": "1.102.0",
+    "@openui5/sap.ui.core": "1.102.0"
   }
 }

package/src/sap/tnt/.library

@@ -6,7 +6,7 @@
   <copyright>OpenUI5
  * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.</copyright>
-  <version>1.99.1</version>
+  <version>1.102.0</version>
 
   <documentation>SAPUI5 library with responsive controls.</documentation>
 

package/src/sap/tnt/InfoLabel.js

@@ -47,7 +47,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/tnt/NavigationList.js

@@ -41,7 +41,7 @@ sap.ui.define([
 		 * @extends sap.ui.core.Control
 		 *
 		 * @author SAP SE
-		 * @version 1.99.1
+		 * @version 1.102.0
 		 *
 		 * @constructor
 		 * @public

package/src/sap/tnt/NavigationListItem.js

@@ -32,7 +32,7 @@ sap.ui.define(["sap/ui/thirdparty/jquery", "./library", 'sap/ui/core/Core', "sap
 		 * @extends sap.ui.core.Item
 		 *
 		 * @author SAP SE
-		 * @version 1.99.1
+		 * @version 1.102.0
 		 *
 		 * @constructor
 		 * @public
@@ -394,8 +394,9 @@ sap.ui.define(["sap/ui/thirdparty/jquery", "./library", 'sap/ui/core/Core', "sap
 			expandIconControl.setTooltip(this._getExpandIconTooltip(false));
 
 			var $container = this.$().find('.sapTntNavLIGroupItems');
+			var oDomRef = this.getDomRef();
 			$container.stop(true, true).slideDown(duration || 'fast', function () {
-				$container.toggleClass('sapTntNavLIHiddenGroupItems');
+				oDomRef.querySelector(".sapTntNavLIGroupItems").classList.toggle('sapTntNavLIHiddenGroupItems');
 			});
 
 			this.getNavigationList()._updateNavItems();
@@ -420,8 +421,9 @@ sap.ui.define(["sap/ui/thirdparty/jquery", "./library", 'sap/ui/core/Core', "sap
 			expandIconControl.setTooltip(this._getExpandIconTooltip(true));
 
 			var $container = this.$().find('.sapTntNavLIGroupItems');
+			var oDomRef = this.getDomRef();
 			$container.stop(true, true).slideUp(duration || 'fast', function () {
-				$container.toggleClass('sapTntNavLIHiddenGroupItems');
+				oDomRef.querySelector(".sapTntNavLIGroupItems").classList.toggle('sapTntNavLIHiddenGroupItems');
 			});
 
 			this.getNavigationList()._updateNavItems();

package/src/sap/tnt/SideNavigation.js

@@ -9,6 +9,7 @@ sap.ui.define([
 	'./library',
 	'sap/ui/core/Control',
 	'sap/ui/core/ResizeHandler',
+	"sap/ui/core/theming/Parameters",
 	'sap/ui/core/Icon',
 	'sap/ui/core/delegate/ScrollEnablement',
 	"./SideNavigationRenderer"
@@ -17,6 +18,7 @@ sap.ui.define([
 		library,
 		Control,
 		ResizeHandler,
+		Parameters,
 		Icon,
 		ScrollEnablement,
 		SideNavigationRenderer
@@ -40,7 +42,7 @@ sap.ui.define([
 		 * @extends sap.ui.core.Control
 		 *
 		 * @author SAP SE
-		 * @version 1.99.1
+		 * @version 1.102.0
 		 *
 		 * @constructor
 		 * @public
@@ -117,7 +119,6 @@ sap.ui.define([
 		});
 
 		SideNavigation.prototype.init = function () {
-
 			this._scroller = new ScrollEnablement(this, this.getId() + "-Flexible-Content", {
 				horizontal: false,
 				vertical: true
@@ -127,6 +128,12 @@ sap.ui.define([
 			this.data('sap-ui-fastnavgroup', 'true', true);
 		};
 
+		// event listener for theme changed
+		SideNavigation.prototype.onThemeChanged = function() {
+			this._mThemeParams = null;
+			this._initThemeParams();
+		};
+
 		SideNavigation.prototype.setAggregation = function (aggregationName, object) {
 			if (object && object.attachItemSelect) {
 				object.attachItemSelect(this._itemSelectionHandler.bind(this));
@@ -152,6 +159,9 @@ sap.ui.define([
 				$this = this.$(),
 				itemAggregation = that.getAggregation('item'),
 				fixedItemAggregation = that.getAggregation('fixedItem'),
+				themeParams,
+				expandedWidth,
+				collapsedWidth,
 				width;
 
 			if (!this.getDomRef()) {
@@ -176,7 +186,7 @@ sap.ui.define([
 			}
 
 			if (isExpanded) {
-				$this.toggleClass('sapTntSideNavigationNotExpanded', !isExpanded);
+				this.getDomRef().classList.toggle('sapTntSideNavigationNotExpanded', !isExpanded);
 
 				if (itemAggregation) {
 					itemAggregation.setExpanded(isExpanded);
@@ -191,7 +201,11 @@ sap.ui.define([
 			}
 
 			that._hasActiveAnimation = true;
-			width = isExpanded ? '15rem' : '3rem';
+
+			themeParams = this._mThemeParams || {};
+			expandedWidth = themeParams['_sap_tnt_SideNavigation_Width'] || "15rem";
+			collapsedWidth = themeParams['_sap_tnt_SideNavigation_CollapsedWidth'] || "3rem";
+			width = isExpanded ? expandedWidth : collapsedWidth;
 
 			$this.animate({
 					width: width
@@ -215,10 +229,10 @@ sap.ui.define([
 				return;
 			}
 
-			this.$().toggleClass('sapTntSideNavigationNotExpandedWidth', !isExpanded);
+			this.getDomRef().classList.toggle('sapTntSideNavigationNotExpandedWidth', !isExpanded);
 
 			if (!isExpanded) {
-				this.$().toggleClass('sapTntSideNavigationNotExpanded', !isExpanded);
+				this.getDomRef().classList.toggle('sapTntSideNavigationNotExpanded', !isExpanded);
 
 				if (this.getAggregation('item')) {
 					this.getAggregation('item').setExpanded(isExpanded);
@@ -239,6 +253,15 @@ sap.ui.define([
 			setTimeout(this._toggleArrows.bind(this), 0);
 		};
 
+		SideNavigation.prototype._initThemeParams = function() {
+			this._mThemeParams = Parameters.get({
+				name: ["_sap_tnt_SideNavigation_Width", "_sap_tnt_SideNavigation_CollapsedWidth"],
+				callback: function (mParams) {
+					this._mThemeParams = mParams;
+				}.bind(this)
+			});
+		};
+
 		/**
 		 * @private
 		 */
@@ -253,6 +276,10 @@ sap.ui.define([
 			}
 
 			this._deregisterControl();
+
+			if (!this._mThemeParams) {
+				this._initThemeParams();
+			}
 		};
 
 		/**
@@ -346,12 +373,12 @@ sap.ui.define([
 		 * @private
 		 */
 		SideNavigation.prototype.exit = function () {
-
 			if (this._scroller) {
 				this._scroller.destroy();
 				this._scroller = null;
 			}
 
+			this._mThemeParams = null;
 			this._deregisterControl();
 		};
 

package/src/sap/tnt/ToolHeader.js

@@ -120,7 +120,7 @@ sap.ui.define([
 	* @implements sap.tnt.IToolHeader
 	*
 	* @author SAP SE
-	* @version 1.99.1
+	* @version 1.102.0
 	*
 	* @constructor
 	* @public

package/src/sap/tnt/ToolHeaderUtilitySeparator.js

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/tnt/ToolPage.js

@@ -36,7 +36,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/tnt/library.js

@@ -15,17 +15,15 @@ sap.ui.define(["sap/ui/core/library", "sap/m/library"],
 	 * SAPUI5 library with controls specialized for administrative applications.
 	 *
 	 * @namespace
-	 * @name sap.tnt
+	 * @alias sap.tnt
 	 * @author SAP SE
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 * @since 1.36
 	 * @public
 	 */
-
-	// delegate further initialization of this library to the Core
-	sap.ui.getCore().initLibrary({
+	var thisLib = sap.ui.getCore().initLibrary({
 		name : "sap.tnt",
-		version: "1.99.1",
+		version: "1.102.0",
 		dependencies : ["sap.ui.core", "sap.m"],
 		designtime: "sap/tnt/designtime/library.designtime",
 		types: [
@@ -59,7 +57,7 @@ sap.ui.define(["sap/ui/core/library", "sap/m/library"],
 	 * @public
 	 * @ui5-metamodel This enumeration also will be described in the UI5 (legacy) designtime metamodel
 	 */
-	sap.tnt.RenderMode = {
+	thisLib.RenderMode = {
 		/**
 		 * When type of the content of <code>InfoLabel</code> is numeric paddings are narrow
 		 * @public
@@ -83,6 +81,6 @@ sap.ui.define(["sap/ui/core/library", "sap/m/library"],
 	 * @ui5-metamodel This interface also will be described in the UI5 (legacy) designtime metamodel
 	 */
 
-	return sap.tnt;
+	return thisLib;
 
 });

package/src/sap/tnt/themes/base/InfoLabel.less

@@ -8,6 +8,9 @@
 @_sap_tnt_InfoLabel_LineHeightDisplayOnly: 1rem;
 @_sap_tnt_InfoLabel_HeightWithoutBorders: 0.875rem;
 @_sap_tnt_InfoLabel_PaddingWhenEmpty: 0 @_sap_tnt_InfoLabel_HeightWithoutBorders/2;
+@_sap_tnt_InfoLabel_DisplayModeBorder: none;
+@_sap_tnt_InfoLabel_DisplayModeBackground: @sapTextColor;
+@_sap_tnt_InfoLabel_DisplayModeColor: @sapContent_ContrastTextColor;
 
 /* ==========================================================================
    Root element
@@ -44,11 +47,11 @@
    InfoLabel Display Only
    ========================================================================== */
 .sapTntInfoLabel.sapTntInfoLabelDisplayOnly {
-	border: none;
-	background: @sapTextColor;
+	border: @_sap_tnt_InfoLabel_DisplayModeBorder;
+	background: @_sap_tnt_InfoLabel_DisplayModeBackground;
 
 	.sapTntInfoLabelInner {
-		color: @sapContent_ContrastTextColor;
+		color: @_sap_tnt_InfoLabel_DisplayModeColor;
 		line-height: @_sap_tnt_InfoLabel_LineHeightDisplayOnly;
 	}
 }

package/src/sap/tnt/themes/base/NavigationList.less

@@ -3,6 +3,10 @@
 /* Base theme                              */
 /* ======================================= */
 
+@_sap_tnt_NavigationList_CollapsedWidth: 3rem;
+@_sap_tnt_NavigationList_IconColor: @sapUiContentIconColor;
+@_sap_tnt_NavigationList_IconFontSize: 1rem;
+@_sap_tnt_NavigationList_ExpandIconColor: @sapUiContentIconColor;
 @_sap_tnt_NavigationList_ItemHeight: 3rem;
 @_sap_tnt_NavigationList_NoIconsGroupPadding: 1rem;
 @_sap_tnt_NavigationList_NoIconsNestedItemPadding: 1rem;
@@ -49,8 +53,13 @@
 		color: @sapUiListTextColor;
 	}
 
-	.sapUiIcon {
-		color: @sapUiContentIconColor;
+	.sapTntNavLIGroupIcon {
+		color: @_sap_tnt_NavigationList_IconColor;
+		font-size: @_sap_tnt_NavigationList_IconFontSize;
+	}
+
+	.sapTntNavLIExpandIcon {
+		color: @_sap_tnt_NavigationList_ExpandIconColor;
 	}
 
 	a {
@@ -58,20 +67,15 @@
 		height: 100%;
 		text-decoration: none;
 		outline: none;
-
-		display: -webkit-box;
-		display: -webkit-flex;
 		display: flex;
-
-		-webkit-box-align: center;
-		-webkit-align-items: center;
 		align-items: center;
+		justify-content: center;
 	}
 }
 
 .sapTntNavLIText {
-	width: 100%;
-	display: block;
+	flex: 1;
+	min-width: 0;
 }
 
 .sapTntNavLIPopup .sapTntNavLIGroupItem .sapMText {
@@ -130,7 +134,7 @@
 }
 
 .sapTntNavLICollapsed {
-	width: 3rem;
+	width: @_sap_tnt_NavigationList_CollapsedWidth;
 }
 
 .sapTntNavLI li,
@@ -221,12 +225,11 @@
 .sapTntNavLI:not(.sapTntNavLINoIcons) {
 
 	span.sapTntNavLIGroupIcon {
-		min-width: 2.75rem;
-		padding: 0.6875rem 0;
+		width: @_sap_tnt_NavigationList_CollapsedWidth;
 	}
 
 	.sapTntNavLIGroupItem .sapMText {
-		padding-left: 2.75rem;
+		padding-left: @_sap_tnt_NavigationList_CollapsedWidth;
 	}
 }
 
@@ -275,8 +278,7 @@
 	.sapTntNavLI:not(.sapTntNavLINoIcons) {
 
 		span.sapTntNavLIGroupIcon {
-			min-width: 2.75rem;
-			padding: 0.5rem 0;
+			width: @_sap_tnt_NavigationList_CollapsedWidth;
 		}
 	}
 }

package/src/sap/tnt/themes/base/SideNavigation.less

@@ -3,19 +3,15 @@
 /* Base theme                              */
 /* ======================================= */
 
+@_sap_tnt_SideNavigation_Width: 15rem;
+@_sap_tnt_SideNavigation_CollapsedWidth: 3rem;
 @_sap_tnt_SideNavigation_NavigationSeparatorBackgroundColor: @sapUiGroupContentBorderColor;
 @_sap_tnt_SideNavigation_NavigationSeparatorHeight: 1px;
+@_sap_tnt_SideNavigation_TriangleColor: @sapUiContentIconColor;
 
 .sapTntSideNavigation {
-  display: -webkit-box;
-  display: -webkit-flex;
   display: flex;
-  -webkit-box-direction: normal;
-  -webkit-box-orient: vertical;
-  -webkit-flex-direction: column;
   flex-direction: column;
-  -webkit-box-flex: 1;
-  -webkit-flex-grow: 1;
   flex-grow: 1;
   box-sizing: border-box;
   overflow: hidden;
@@ -24,11 +20,11 @@
 }
 
 .sapTntSideNavigation {
-  width: 15rem;
+  width: @_sap_tnt_SideNavigation_Width;
 }
 
 .sapTntSideNavigation.sapTntSideNavigationNotExpandedWidth {
-  width: 3rem;
+  width: @_sap_tnt_SideNavigation_CollapsedWidth;
 }
 
 .sapTntSideNavigationNotExpanded {
@@ -41,7 +37,7 @@
 	}
 
 	.sapTntSideNavigationFlexible {
-		padding-right: 3rem;
+		padding-right: @_sap_tnt_SideNavigation_CollapsedWidth;
 		width: 6rem;
 	}
 
@@ -50,7 +46,7 @@
 		width: 0;
 		height: 0;
 		border-left: 0.375rem solid transparent;
-		border-bottom: 0.375rem solid @sapUiContentIconColor;
+		border-bottom: 0.375rem solid @_sap_tnt_SideNavigation_TriangleColor;
 		position:absolute;
 		right: 0.1875rem;
 		bottom:0.125rem;

package/src/sap/tnt/themes/base/ToolHeader.less

@@ -6,6 +6,10 @@
 @_sap_tnt_ToolHeader_AvatarBackground: lighten(saturate(spin(@sapUiAccent6, 348), 36), 28);
 @_sap_tnt_ToolHeader_AvatarColor: @sapUiBaseText;
 @_sap_tnt_ToolHeader_BorderColor: contrast(@sapShellColor, @sapUiContentFocusColor, @sapUiContentContrastFocusColor, @sapContent_ContrastTextThreshold);
+@_sap_tnt_ToolHeader_ArrowHeight: 0.1875rem;
+@_sap_tnt_ToolHeader_ArrowMargin: 0;
+@_sap_tnt_ToolHeader_Padding: 0 0.5rem;
+@_sap_tnt_ToolHeader_ArrowMarginBottom: 0.188rem;
 
 .sapTntToolHeaderPopover.sapMOTAPopover.sapMPopover .sapMPopoverCont .sapMPopoverScroll,
 .sapTntToolHeaderPopover.sapMOTAPopover.sapMPopover .sapMPopoverCont .sapMPopoverScroll .sapMBtn {
@@ -23,7 +27,7 @@
 .sapMIBar.sapTntToolHeader .sapMBarChild.sapMITH {
 	height: @_sap_tnt_ToolHeader_Height;
 	box-shadow: none;
-	padding: 0 0.5rem;
+	padding: @_sap_tnt_ToolHeader_Padding;
 	flex: 1;
 	min-width: 0; // fixes Chrome flex issue
 
@@ -35,7 +39,8 @@
 			&:after {
 				border-radius: 0.125rem;
 				box-shadow: none;
-				margin-bottom: 0.188rem;
+				margin-bottom: @_sap_tnt_ToolHeader_ArrowMarginBottom;
+				height: @_sap_tnt_ToolHeader_ArrowHeight;
 			}
 		}
 	}
@@ -48,7 +53,7 @@
 }
 
 .sapTntToolHeader .sapMITH .sapMITBContentArrow {
-	margin: 0;
+	margin: @_sap_tnt_ToolHeader_ArrowMargin;
 }
 
 // ==========================================================================

package/src/sap/tnt/themes/base/ToolPage.less

@@ -10,13 +10,6 @@
 @_sap_tnt_ToolPage_AsideWidth : 15rem;
 @_sap_tnt_ToolPage_AsideWidthOnTablet : 3rem;
 @_sap_tnt_ToolPage_HeaderHeight : 3rem;
-@_sap_tnt_ToolPage_FooterHeight : 3rem;
-
-@_sap_tnt_ToolPage_CompactAsideWidth : 15rem;
-@_sap_tnt_ToolPage_CompactAsideWidthOnTablet : 3rem;
-@_sap_tnt_ToolPage_CompactHeaderHeight : 3rem;
-@_sap_tnt_ToolPage_CompactFooterHeight : 2rem;
-
 @_sap_tnt_ToolPage_AnimationDuration : 0.3s;
 
 /* ==========================================================================
@@ -70,11 +63,6 @@
   height: 100%;
 }
 
-.sapTntToolPageAsideFooter {
-  height: @_sap_tnt_ToolPage_FooterHeight;
-  overflow: hidden;
-}
-
 html:not([data-sap-ui-animation='off']) .sapTntToolPageMain {
   transition: padding-left @_sap_tnt_ToolPage_AnimationDuration, transform @_sap_tnt_ToolPage_AnimationDuration;
 }
@@ -159,71 +147,6 @@ html:not([data-sap-ui-animation='off']) .sapTntToolPageAside {
   height: 100%;
 }
 
-.sapTntToolPageMainFooter {
-  height: @_sap_tnt_ToolPage_FooterHeight;
-  overflow: hidden;
-}
-
-/* Compact size */
-.sapUiSizeCompact {
-
-  .sapTntToolPageHeader {
-    height: @_sap_tnt_ToolPage_CompactHeaderHeight;
-  }
-
-  .sapTntToolPageAsideFooter {
-    height: @_sap_tnt_ToolPage_CompactFooterHeight;
-  }
-
-  .sapTntToolPageMainFooter {
-    height: @_sap_tnt_ToolPage_CompactFooterHeight;
-  }
-}
-
-.sap-desktop .sapUiSizeCompact,
-.sap-tablet .sapUiSizeCompact {
-  .sapTntToolPageAside {
-    width: @_sap_tnt_ToolPage_CompactAsideWidth;
-  }
-
-  .sapTntToolPageAside + .sapTntToolPageMain {
-    padding-left: @_sap_tnt_ToolPage_CompactAsideWidth;
-  }
-}
-
-.sap-desktop .sapUiSizeCompact,
-.sap-tablet .sapUiSizeCompact {
-  .sapTntToolPageAsideCollapsed {
-    .sapTntToolPageAside {
-      width: @_sap_tnt_ToolPage_CompactAsideWidthOnTablet;
-    }
-
-    .sapTntToolPageAside + .sapTntToolPageMain {
-      padding-left: @_sap_tnt_ToolPage_CompactAsideWidthOnTablet;
-    }
-  }
-}
-
-.sap-phone .sapUiSizeCompact {
-
-  .sapTntToolPageAside {
-    width: @_sap_tnt_ToolPage_CompactAsideWidth;
-  }
-
-  .sapTntToolPageMain {
-    transform: translateX(@_sap_tnt_ToolPage_CompactAsideWidth);
-  }
-
-  .sapTntToolPageAsideCollapsed {
-    .sapTntToolPageAside {
-      transform: translateX(-@_sap_tnt_ToolPage_CompactAsideWidth);
-    }
-    .sapTntToolPageMain {
-      transform: translateX(0);
-    }
-  }
-}
-
 /* ==========================================================================
    RTL
    ========================================================================== */
@@ -243,19 +166,4 @@ html[dir=rtl] {
       }
     }
   }
-
-  &.sap-phone .sapUiSizeCompact {
-    .sapTntToolPageMain {
-      transform: translateX(-@_sap_tnt_ToolPage_CompactAsideWidth);
-    }
-
-    .sapTntToolPageAsideCollapsed {
-      .sapTntToolPageAside {
-        transform: translateX(@_sap_tnt_ToolPage_CompactAsideWidth);
-      }
-      .sapTntToolPageMain {
-        transform: translateX(0);
-      }
-    }
-  }
 }