@openui5/sap.ui.mdc 1.135.0 → 1.136.0

package/src/sap/ui/mdc/table/RowSettings.js

@@ -1,6 +1,6 @@
 /*!
  * OpenUI5
- * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
+ * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 
@@ -21,7 +21,7 @@ sap.ui.define([
 	 * The <code>RowSettings</code> control is used to configure a row.
 	 * This control can only be used in the context of the <code>sap.ui.mdc.Table</code> control to define row settings.
 	 * @extends sap.ui.core.Element
-	 * @version 1.135.0
+	 * @version 1.136.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/mdc/table/TableSettings.js

@@ -1,6 +1,6 @@
 /*!
  * OpenUI5
- * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
+ * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 

package/src/sap/ui/mdc/table/TableTypeBase.js

@@ -1,6 +1,6 @@
 /*!
  * OpenUI5
- * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
+ * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 

package/src/sap/ui/mdc/table/TreeTableType.js

@@ -1,6 +1,6 @@
 /*!
  * OpenUI5
- * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
+ * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 

package/src/sap/ui/mdc/table/V4AnalyticsPropertyHelper.js

@@ -1,6 +1,6 @@
 /*!
  * OpenUI5
- * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
+ * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 
@@ -25,7 +25,7 @@ sap.ui.define([
 	 * @extends sap.ui.mdc.table.PropertyHelper
 	 *
 	 * @author SAP SE
-	 * @version 1.135.0
+	 * @version 1.136.0
 	 *
 	 * @private
 	 * @since 1.85

package/src/sap/ui/mdc/table/menu/GroupHeaderRowContextMenu.js

@@ -1,6 +1,6 @@
 /*!
  * OpenUI5
- * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
+ * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 

package/src/sap/ui/mdc/table/menu/QuickActionContainer.js

@@ -1,6 +1,6 @@
 /*!
  * OpenUI5
- * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
+ * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 sap.ui.define([

package/src/sap/ui/mdc/table/utils/Personalization.js

@@ -1,6 +1,6 @@
 /*!
  * OpenUI5
- * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
+ * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 
@@ -17,7 +17,7 @@ sap.ui.define([
 	 * P13n utilities.
 	 *
 	 * @author SAP SE
-	 * @version 1.135.0
+	 * @version 1.136.0
 	 * @namespace
 	 * @alias sap.ui.mdc.table.utils.Personalization
 	 * @private
@@ -286,5 +286,23 @@ sap.ui.define([
 		});
 	};
 
+	/**
+	 * Creates a fixed column count change and applies it to the table.
+	 * @param {sap.ui.mdc.Table} oTable The table for which to create the change
+	 * @param {object} mSettings The change details
+	 * @param {boolean} mSettings.fixedColumnCount The new fixed column count
+	 */
+	PersonalizationUtils.createFixedColumnCountChange = function(oTable, mSettings) {
+		oTable.getEngine().createChanges({
+			control: oTable,
+			key: "ColumnFreeze",
+			state: [{
+				name: "GridTable",
+				fixedColumnCount: mSettings.fixedColumnCount
+			}],
+			applyAbsolute: true
+		});
+	};
+
 	return PersonalizationUtils;
 });

package/src/sap/ui/mdc/themes/base/AdaptFiltersPanel.less

@@ -1,27 +1,32 @@
+/* ============================================= */
+/* CSS for control sap.ui.mdc/AdaptFiltersPanel  */
+/* Base theme                                    */
+/* ============================================= */
+
 .sapUiMDCAdaptFiltersPanel >div>section {
-    margin-top: 0.25rem;
+	margin-top: 0.25rem;
 }
 
 //Change background color for the container control
 .sapUiMDCAdaptFiltersPanel .sapMPageBgStandard {
-    background: @sapUiListBackground;
+	background: var(--sapUiListBackground);
 }
 
 
 .sapUiMDCAdaptFiltersPanel .sapUiMDCPanelPadding{
-    padding-left: 1rem;
-    padding-right: 0.75rem;
+	padding-left: 1rem;
+	padding-right: 0.75rem;
 }
 
 .sapUiMDCAdaptFiltersPanel .sapUiMDCPaddingPanelLeft {
-    padding-left: 1.5rem;
+	padding-left: 1.5rem;
 }
 
 .sapUiMDCAdaptFiltersPanel .sapMBar-CTX {
-    border: none;
-    box-shadow: none;
+	border: none;
+	box-shadow: none;
 }
 
 .sapUiMDCAdaptFiltersSearchBar {
-    padding-bottom: 0.25rem;
+	padding-bottom: 0.25rem;
 }

package/src/sap/ui/mdc/themes/base/AdaptationFilterBar.less

@@ -1,6 +1,11 @@
+/* =============================================== */
+/* CSS for control sap.ui.mdc/AdaptationFilterBar  */
+/* Base theme                                      */
+/* =============================================== */
+
 .sapUIAdaptationFilterBar {
-    height: 100%
+	height: 100%
 }
 .sapUIAdaptationFilterBar .sapUiMdcFieldBase {
-    width: 100%
+	width: 100%
 }

package/src/sap/ui/mdc/themes/base/FieldBase.less

@@ -1,3 +1,8 @@
+/* ===================================== */
+/* CSS for control sap.ui.mdc/FieldBase  */
+/* Base theme                            */
+/* ===================================== */
+
 .sapUiMdcFieldBase {
 	display: inline-block;
 	box-sizing: border-box;
@@ -19,27 +24,28 @@
 	min-width: calc(@_InputBase_Control_MinWidth ~" + 0.5rem + " @sap_ui_mdc_Field_UnitMinWidth); /* to avoid wrapping of inner controls */
 }
 
-.sapUiMdcFieldBaseMoreFields > *:first-child{
+.sapUiMdcFieldBaseMoreFields > *:first-child {
 	max-width: calc(~"100% - 0.5rem - " @sap_ui_mdc_Field_UnitMinWidth); /* as input has a min-width, to not cut off unit */
 	min-width: @_InputBase_Control_MinWidth; /* as inner input has this min-width */
 }
 
-.sapUiMdcFieldBaseMoreFields > *:last-child{
+.sapUiMdcFieldBaseMoreFields > *:last-child {
 	padding-left: 0.5rem;
 	min-width: calc(~"0.5rem + " @sap_ui_mdc_Field_UnitMinWidth); /* As input has a min-width + padding */
 }
 
 .sapUiSizeCompact {
-	.sapUiMdcFieldBaseMoreFields{
+
+	.sapUiMdcFieldBaseMoreFields {
 		min-width: calc(@_InputBase_Control_MinWidth_Compact ~" + 0.5rem + " @sap_ui_mdc_Field_UnitMinWidth_Compact); /* to avoid wrapping of inner controls */
 	}
 
-	.sapUiMdcFieldBaseMoreFields > *:first-child{
+	.sapUiMdcFieldBaseMoreFields > *:first-child {
 		max-width: calc(~"100% - 0.5rem - " @sap_ui_mdc_Field_UnitMinWidth_Compact); /* as input has a min-width, to not cut off unit */
 		min-width: @_InputBase_Control_MinWidth_Compact; /* as inner input has this min-width */
 	}
 
-	.sapUiMdcFieldBaseMoreFields > *:last-child{
+	.sapUiMdcFieldBaseMoreFields > *:last-child {
 		min-width: calc(~"0.5rem + " @sap_ui_mdc_Field_UnitMinWidth_Compact); /* As input has a min-width + padding */
 	}
 }

package/src/sap/ui/mdc/themes/base/FilterBar.less

@@ -1,5 +1,7 @@
-.sapUiMdcFilterBarBase {
-}
+/* ===================================== */
+/* CSS for control sap.ui.mdc/FilterBar  */
+/* Base theme                            */
+/* ===================================== */
 
 .sapUiMdcFilterBarBaseAFLayout.sapUiAFLayout {
 	margin-left: -0.5rem;
@@ -46,4 +48,4 @@ html[dir='rtl'] .sapUiMdcFilterBarBaseFloatLeft {
 .sapUiMdcFilterBarBaseAFLayout > .sapUiAFLayoutItem > div,
 .sapUiMdcFilterBarBaseAFLayout > .sapUiAFLayoutItem .sapUiMdcFieldBase {
 	width: 100%;
-}
+}

package/src/sap/ui/mdc/themes/base/GroupView.less

@@ -1,56 +1,61 @@
-//Remove border for panels
-.sapUiMDCGroupView .sapMPanelWrappingDivTb{
-    border: none;
+/* ===================================== */
+/* CSS for control sap.ui.mdc/GroupView  */
+/* Base theme                            */
+/* ===================================== */
+
+/* Remove border for panels */
+.sapUiMDCGroupView .sapMPanelWrappingDivTb {
+	border: none;
 }
 
-//padding between list items in group view
+/* padding between list items in group view */
 .sapUiMDCGroupView .sapMLIBContent {
-    padding-bottom: 0.75rem;
-    padding-top: 0.5rem;
-    padding-right: 0.375rem
+	padding-bottom: 0.75rem;
+	padding-top: 0.5rem;
+	padding-right: 0.375rem
 }
 
-//remove highlighting in group view
+/* remove highlighting in group view */
 .sapUiMDCGroupView .sapMLIB .sapMLIBSelected {
 	border-color: transparent;
-	background: @sapUiListBackground;
+	background: var(--sapUiListBackground);
 }
 
-//Display ':' for Labels
+/* Display ':' for Labels */
 .sapUiMDCGroupView.sapUiMDCAFLabelMarking .sapMPanelContent .sapMLabelColonAndRequired::before {
 	content: attr(data-colon);
 }
 
-//Custom bar that should look like 'ListView' background (mock columnheader)
+/* Custom bar that should look like 'ListView' background (mock columnheader) */
 .sapUiMDCGroupView .sapMListInfoTBar {
-    color: @sapUiListTextColor;
-    background: @sapUiListHeaderBackground;
+	color: var(--sapList_TextColor);
+	background: var(--sapList_HeaderBackground);
 }
-//remove padding for infotoolbar in panel (mock columnheader)
-.sapUiMDCGroupView .sapMListInfoTBarContainer .sapMIBar.sapMTB.sapMTB-Info-CTX{
-    padding:0
+
+/* remove padding for infotoolbar in panel (mock columnheader) */
+.sapUiMDCGroupView .sapMListInfoTBarContainer .sapMIBar.sapMTB.sapMTB-Info-CTX {
+	padding:0
 }
-//remove padding for infotoolbar in panel + padding for first child (mock columnheader)
+
+/* remove padding for infotoolbar in panel + padding for first child (mock columnheader) */
 .sapUiMDCGroupView .sapMListInfoTBarContainer .sapMIBar.sapMTB .sapMBarChild:first-child {
-    margin-left:0;
-    padding-left: 2.5rem;
+	margin-left:0;
+	padding-left: 2.5rem;
 }
 
-
-//Checkbox alignment --> at the top
+/* Checkbox alignment --> at the top */
 .sapUiMDCGroupView li .sapMCLI {
-    align-items: start;
-}
-
-//Margin to display dotted focus outline properly
-.sapUiMDCGroupView .sapMPanel{
-    margin: 2px;
+	align-items: start;
 }
 
-//Adapt standard padding to use the whole content
-.sapUiMDCGroupView .sapMPanelContent{
-    overflow: visible;
-    border-bottom: none;
-    padding: 1rem 1rem 0 0;
+/* Margin to display dotted focus outline properly */
+.sapUiMDCGroupView .sapMPanel {
+	margin: 2px;
 }
 
+/* Adapt standard padding to use the whole content */
+.sapUiMDCGroupView .sapMPanelContent {
+	overflow: visible;
+	border-bottom: none;
+	padding: 1rem 1rem 0 0;
+}

package/src/sap/ui/mdc/themes/base/InfoPanel.less

@@ -1,6 +1,11 @@
-// ------------------------------------------------------------------------------
-// --------------- Header -------------------------------------------------------
-// ------------------------------------------------------------------------------
+/* ===================================== */
+/* CSS for control sap.ui.mdc/InfoPanel  */
+/* Base theme                            */
+/* ===================================== */
+
+/* ------------------------------------------------------------------------------
+--------------- Header ----------------------------------------------------------
+------------------------------------------------------------------------------ */
 
 .mdcbaseinfoPanel .sapUiFormTitle {
 	white-space: normal;
@@ -22,7 +27,7 @@
 
 .mdcbaseinfoPanelTitleH1 .sapMLnkDsbl {
 	opacity: 1;
-	color: @sapUiBaseText;
+	color: var(--sapTextColor);
 }
 
 .mdcbaseinfoPanelThumbnail .mdcbaseinfoPanelListItem .sapMImageContentImageIcon.sapUiIcon {
@@ -42,26 +47,26 @@
 	width: 3rem;
 }
 
-// ------------------------------------------------------------------------------
-// --------------- Additional Content -------------------------------------------
-// ------------------------------------------------------------------------------
+/* ------------------------------------------------------------------------------
+------------------ Additional Content -------------------------------------------
+------------------------------------------------------------------------------ */
 
 .mdcbaseinfoPanel .mdcbaseinfoPanelDefaultAdditionalContent .sapUiFormTitle {
-	color: @sapUiBaseText;
+	color: var(--sapTextColor);
 }
 
-// ------------------------------------------------------------------------------
-// --------------- Separator ----------------------------------------------------
-// ------------------------------------------------------------------------------
+/* ------------------------------------------------------------------------------
+------------------ Separator ----------------------------------------------------
+------------------------------------------------------------------------------ */
 
 .mdcbaseinfoPanel .mdcbaseinfoPanelSeparator {
 	border-bottom: 1px solid;
-	border-bottom-color: @sapUiToolbarSeparatorColor;
+	border-bottom-color: var(--sapToolbar_SeparatorColor);
 }
 
-// ------------------------------------------------------------------------------
-// --------------- Links --------------------------------------------------------
-// ------------------------------------------------------------------------------
+/* ------------------------------------------------------------------------------
+------------------ Links --------------------------------------------------------
+------------------------------------------------------------------------------ */
 
 /* Overwrite background of 'related apps' section */
 .mdcbaseinfoPanel .mdcbaseinfoPanelSectionLinks {
@@ -73,7 +78,7 @@
 	display: none;
 }
 
-.mdcbaseinfoPanelListItem .sapUiFormResLayout.sapUiFormBackgrTranslucent>div {
+.mdcbaseinfoPanelListItem .sapUiFormResLayout.sapUiFormBackgrTranslucent > div {
 	background-color: transparent;
 }
 
@@ -88,7 +93,7 @@
 	font-weight: normal;
 	font-size: 1.5rem;
 	line-height: 1.5rem;
-	padding-bottom: 0rem;
+	padding-bottom: 0;
 	color: @sapUiText;
 }
 
@@ -100,7 +105,7 @@
 .mdcbaseinfoPanelListItem .sapMImageContent {
 	width: auto;
 	height: auto;
-	margin-right: .75rem;
+	margin-right: 0.75rem;
 }
 
 .mdcbaseinfoPanelListItem .sapMImageContentImageIcon {
@@ -127,12 +132,13 @@
 }
 
 .mdcbaseinfoPanelListItem .mdcbaseinfoPanelItemsGroup .sapMText {
-	color: @sapUiContentLabelColor;
+	color: var(--sapContent_LabelColor);
 }
 
-// ------------------------------------------------------------------------------
-// --------------- Button -------------------------------------------------------
-// ------------------------------------------------------------------------------
+/* ------------------------------------------------------------------------------
+------------------ Button -------------------------------------------------------
+------------------------------------------------------------------------------ */
+
 .mdcbaseinfoPanel {
 	padding-top: 0;
 	padding-bottom: 1rem;

package/src/sap/ui/mdc/themes/base/ListView.less

@@ -1,32 +1,37 @@
-//Display ':' for Labels in the 'list' view
-.sapUiMDCListView.sapUiMDCAFLabelMarkingList tbody  .sapMLabel > .sapMLabelColonAndRequired::before{
+/* ==================================== */
+/* CSS for control sap.ui.mdc/ListView  */
+/* Base theme                           */
+/* ==================================== */
+
+/* Display ':' for Labels in the 'list' view */
+.sapUiMDCListView.sapUiMDCAFLabelMarkingList tbody  .sapMLabel > .sapMLabelColonAndRequired::before {
 	content: attr(data-colon);
 }
 
-//Display checkbox at the top for items in the ListView
+/* Display checkbox at the top for items in the ListView */
 .sapUiMDCListView tbody .sapMListTblSelCol {
-    vertical-align: top;
+	vertical-align: top;
 }
 
-//Remove padding for items in list view
+/* Remove padding for items in list view */
 .sapUiMDCListView.listViewHover .sapMListTblCell {
-    padding-top: 0;
-    padding-bottom: 0;
+	padding-top: 0;
+	padding-bottom: 0;
 }
 
 .sapUiMDCListView .sapMPanelContent li {
-    align-items: start; //Checkbox should not be centered
-    display: flex; //Is the default for Lists - only needs to be set as the parent is a Table
+	align-items: start; /* Checkbox should not be centered */
+	display: flex; /* Is the default for Lists - only needs to be set as the parent is a Table */
 }
 
-//Align inner rows with the outer controls
+/* Align inner rows with the outer controls */
 .sapUiMDCListView table {
-    tr > td {
-        padding-left: 0.5rem;
-    }
+	tr > td {
+		padding-left: 0.5rem;
+	}
 }
 
-//'Select All' should also be aligned correctly with the other controls in the panel
+/* 'Select All' should also be aligned correctly with the other controls in the panel */
 .sapUiMDCListView .sapMTableTH {
-    padding-left: 0.5rem;
+	padding-left: 0.5rem;
 }

package/src/sap/ui/mdc/themes/base/PersonalizationDialog.less

@@ -1,9 +1,7 @@
-@_sap_ui_mdc_PersonalizationDialog_Border_LightColor : @sapUiContentContrastFocusColor;  				//#fff
-@_sap_ui_mdc_PersonalizationDialog_Border_DarkColor : @sapUiContentFocusColor;
-
-.sapMP13nPopup {
-
-}
+/* ================================================= */
+/* CSS for control sap.ui.mdc/PersonalizationDialog  */
+/* Base theme                                        */
+/* ================================================= */
 
 .sapMP13nPopup .sapMMsgStrip {
 	margin: 10px;
@@ -13,15 +11,10 @@
 	overflow-y: initial;
 }
 
-// .sapMP13nPopup.sapUiRTABorder {
-// 	border: 3px solid @_sap_ui_mdc_PersonalizationDialog_Border_LightColor;
-// 	border-image: repeating-linear-gradient( -45deg, @_sap_ui_mdc_PersonalizationDialog_Border_DarkColor, @_sap_ui_mdc_PersonalizationDialog_Border_DarkColor 5px, @_sap_ui_mdc_PersonalizationDialog_Border_LightColor 5px, @_sap_ui_mdc_PersonalizationDialog_Border_LightColor 10px) 4;
-// }
-
-.sapMP13nPopup .sapMMenuBtn{
+.sapMP13nPopup .sapMMenuBtn {
     max-width: none;
 }
 
-.sapMP13nPopup.sapMDialog:not(.sapMDialogWithSubHeader) > header:first-of-type .sapUiMdcContainerBar{
+.sapMP13nPopup.sapMDialog:not(.sapMDialogWithSubHeader) > header:first-of-type .sapUiMdcContainerBar {
 	box-shadow: none;
 }

package/src/sap/ui/mdc/themes/base/QueryPanel.less

@@ -1,7 +1,8 @@
-.sapUiMDCP13nQueryPanel {
-
-}
+/* ====================================== */
+/* CSS for control sap.ui.mdc/QueryPanel  */
+/* Base theme                             */
+/* ====================================== */
 
 .sapUiMDCP13nQueryPanel .sapUiRespGrid.sapUiRespGridVSpace1 > div {
-    margin-bottom: 0;
+	margin-bottom: 0;
 }

package/src/sap/ui/mdc/themes/base/Table.less

@@ -1,8 +1,14 @@
+/* ================================= */
+/* CSS for control sap.ui.mdc/Table  */
+/* Base theme                        */
+/* ================================= */
+
 @_sap_ui_mdc_Table_ExportButtonType: ~"Ghost";
 @_sap_ui_mdc_Table_ToolbarDesign: ~"Transparent";
 @_sap_ui_mdc_Table_HeaderStyle: ~"H4";
 
 .sapUiMdcTable {
+
 	&.sapUiMdcTableFitContainer {
 		min-height: 100%;
 	}

package/src/sap/ui/mdc/themes/base/TokenDisplay.less

@@ -1,23 +1,27 @@
+/* ======================================== */
+/* CSS for control sap.ui.mdc/TokenDisplay  */
+/* Base theme                               */
+/* ======================================== */
+
 @mdctoken-large-line-height: 1.375rem;
 @mdctoken-small-line-height: 1rem;
 
-// hide Token border and background
+/* hide Token border and background */
 .sapUiMdcTokenizerDisplay .sapMToken {
-	border: 0px; // hide the border of a token
-	background-color: transparent; // remove background of Token
-	padding-left: 0px; // remove the left padding
+	border: 0; /* hide the border of a token */
+	background-color: transparent; /* remove background of Token */
+	padding-left: 0; /* remove the left padding */
 }
 
 .sapUiMdcTokenizerDisplay.sapMTokenizer.sapMTokenizerReadonly .sapMToken {
-	padding-left: 0px; // remove left padding of a token. The right padding will be used to show the delimiters
+	padding-left: 0; /* remove left padding of a token. The right padding will be used to show the delimiters */
 
-	// right margin and padding of the token (space for the delimiter)
+	/* right margin and padding of the token (space for the delimiter) */
 	padding-right: 0.375rem;
 	margin-right: 0.375rem;
-	margin-top: 0px;
-	margin-bottom: 0px;
-
-	color: @sapUiBaseText;
+	margin-top: 0;
+	margin-bottom: 0;
+	color: var(--sapTextColor);
 	height: @mdctoken-small-line-height;
 }
 
@@ -26,61 +30,55 @@
 }
 
 .sapUiSizeCozy .sapUiMdcTokenizerDisplay.sapMTokenizer.sapMTokenizerReadonly .sapMToken {
-	// right margin and padding of the token (space for the delimiter)
+	/* right margin and padding of the token (space for the delimiter) */
 	padding-right: 0.5rem;
 	margin-right: 0.5rem;
 }
 
-// delimiters between tokens
+/* delimiters between tokens */
 .sapUiMdcTokenizerDisplay .sapMToken::after {
 	content: attr(delimiter);
-	color: @sapUiBaseText;
-	font-family: @sapUiFontFamily;
+	color: var(--sapTextColor);
+	font-family: var(--sapFontFamily);
 	font-size: @sapMFontMediumSize;
 	font-weight: normal;
 	vertical-align: middle;
-	margin-left: 0.25rem; // space between tokens. the left margin of the delimiter and the right side of the token
+	margin-left: 0.25rem; /* space between tokens. the left margin of the delimiter and the right side of the token */
 	position: absolute;
 	line-height: @mdctoken-small-line-height;
 }
 
 .sapUiSizeCozy .sapUiMdcTokenizerDisplay .sapMToken::after {
-	margin-left: 0.4rem; // space between tokens. the left side margin of the token
+	margin-left: 0.4rem; /* space between tokens. the left side margin of the token */
 }
 
 .sapUiFormEdit .sapUiMdcTokenizerDisplay .sapMToken::after {
 	line-height: @mdctoken-large-line-height;
 }
 
-// no delimiter after the last token
-.sapUiMdcTokenizerDisplay .sapMToken:last-child:after {
+/* no delimiter after the last token */
+.sapUiMdcTokenizerDisplay .sapMToken:last-child::after {
 	content: none;
 }
 
-
-
-// make the token focus invisible
+/* make the token focus invisible */
 html.sap-desktop .sapUiMdcTokenizerDisplay .sapMToken:focus {
-	outline: 0px;
+	outline: 0;
 }
 
-// make the token hover invisible
+/* make the token hover invisible */
 html.sap-desktop .sapUiMdcTokenizerDisplay .sapMToken:hover {
 	background: transparent;
-	border: 0px;
+	border: 0;
 }
 
 .sapUiSizeCompact .sapUiMdcTokenizerDisplay.sapMTokenizer .sapMToken {
 	font-size: @sapMFontMediumSize;
 }
 
-
-
 .sapUiMdcTokenizerDisplay .sapMTokenText {
-	// enable selection of scrollcontainer
-	-webkit-user-select: text;
+	/* enable selection of scrollcontainer */
     user-select: text;
-
 	line-height: @mdctoken-small-line-height;
 }