@openui5/themelib_sap_fiori_3 1.134.0 → 1.135.0

package/THIRDPARTY.txt

@@ -6,7 +6,7 @@ The full text of all referenced licenses is appended at the end of this file.
 
 Library: sap.m:
 
-Component: purify.js, version: 3.1.7
+Component: purify.js, version: 3.2.4
 Copyright: Mario Heiderich
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
@@ -462,7 +462,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.24.0
+Component: SAP Theming Base Content, version: 11.28.2
 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/themelib_sap_fiori_3",
-  "version": "1.134.0",
+  "version": "1.135.0",
   "description": "OpenUI5 Theme Library sap_fiori_3",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -14,22 +14,22 @@
     "url": "https://github.com/SAP/openui5.git"
   },
   "devDependencies": {
-    "@openui5/sap.f": "1.134.0",
-    "@openui5/sap.m": "1.134.0",
-    "@openui5/sap.tnt": "1.134.0",
-    "@openui5/sap.ui.codeeditor": "1.134.0",
-    "@openui5/sap.ui.commons": "1.134.0",
-    "@openui5/sap.ui.core": "1.134.0",
-    "@openui5/sap.ui.dt": "1.134.0",
-    "@openui5/sap.ui.fl": "1.134.0",
-    "@openui5/sap.ui.mdc": "1.134.0",
-    "@openui5/sap.ui.integration": "1.134.0",
-    "@openui5/sap.ui.layout": "1.134.0",
-    "@openui5/sap.ui.rta": "1.134.0",
-    "@openui5/sap.ui.suite": "1.134.0",
-    "@openui5/sap.ui.table": "1.134.0",
-    "@openui5/sap.ui.unified": "1.134.0",
-    "@openui5/sap.ui.ux3": "1.134.0",
-    "@openui5/sap.uxap": "1.134.0"
+    "@openui5/sap.f": "1.135.0",
+    "@openui5/sap.m": "1.135.0",
+    "@openui5/sap.tnt": "1.135.0",
+    "@openui5/sap.ui.codeeditor": "1.135.0",
+    "@openui5/sap.ui.commons": "1.135.0",
+    "@openui5/sap.ui.core": "1.135.0",
+    "@openui5/sap.ui.dt": "1.135.0",
+    "@openui5/sap.ui.fl": "1.135.0",
+    "@openui5/sap.ui.mdc": "1.135.0",
+    "@openui5/sap.ui.integration": "1.135.0",
+    "@openui5/sap.ui.layout": "1.135.0",
+    "@openui5/sap.ui.rta": "1.135.0",
+    "@openui5/sap.ui.suite": "1.135.0",
+    "@openui5/sap.ui.table": "1.135.0",
+    "@openui5/sap.ui.unified": "1.135.0",
+    "@openui5/sap.ui.ux3": "1.135.0",
+    "@openui5/sap.uxap": "1.135.0"
   }
 }

package/src/sap/f/themes/sap_fiori_3/GridListItem.less

@@ -1,7 +1,7 @@
 /* =================================== */
 /* CSS for control sap.f/GridListItem  */
-/* Fiori 3 theme                       */
+/* Quartz Light theme                  */
 /* =================================== */
 
-@_sap_f_GridListItem_HeaderBoxShadow: 0 0 0.25rem 0 fade(@sapUiContentShadowColor, 15), inset 0 -0.0625rem 0 0 @sapUiPageHeaderBorderColor;
-@_sap_f_GridListItem_HeaderHeight: 2.75rem;
+@_sap_f_GridListItem_HeaderBoxShadow: 0 0 0.25rem 0 fade(@sapUiContentShadowColor, 15), inset 0 -0.0625rem 0 0 var(--sapPageHeader_BorderColor);
+@_sap_f_GridListItem_HeaderHeight: 2.75rem;

package/src/sap/f/themes/sap_fiori_3_dark/CardLoading.less

@@ -1,7 +1,7 @@
 /* ================================== */
 /* CSS for control sap.f/CardLoading  */
-/* FIORI 3 Dark theme          */
+/* Quartz Dark theme                  */
 /* ================================== */
 
-@_sap_f_Card_Background_Placeholder_Color: @sapUiContentPlaceholderloadingBackground;
-@_sap_f_Card_Placeholder_Gradient: linear-gradient(to right, @sapUiContentPlaceholderloadingBackground 0%, @sapUiContentPlaceholderloadingBackground 35%, lighten(@sapUiContentPlaceholderloadingBackground, 5) 50%, @sapUiContentPlaceholderloadingBackground 65%, @sapUiContentPlaceholderloadingBackground 100%);
+@_sap_f_Card_Background_Placeholder_Color: var(--sapContent_Placeholderloading_Background);
+@_sap_f_Card_Placeholder_Gradient: linear-gradient(to right, var(--sapContent_Placeholderloading_Background) 0%, var(--sapContent_Placeholderloading_Background) 35%, lighten(@sapUiContentPlaceholderloadingBackground, 5) 50%, var(--sapContent_Placeholderloading_Background) 65%, var(--sapContent_Placeholderloading_Background) 100%);

package/src/sap/f/themes/sap_fiori_3_dark/GridListItem.less

@@ -3,5 +3,5 @@
 /* Quartz Dark theme                   */
 /* =================================== */
 
-@_sap_f_GridListItem_HeaderBoxShadow: 0 0 0.25rem 0 fade(@sapUiContentShadowColor, 15), inset 0 -0.0625rem 0 0 @sapUiPageHeaderBorderColor;
-@_sap_f_GridListItem_HeaderHeight: 2.75rem;
+@_sap_f_GridListItem_HeaderBoxShadow: 0 0 0.25rem 0 fade(@sapUiContentShadowColor, 15), inset 0 -0.0625rem 0 0 var(--sapPageHeader_BorderColor);
+@_sap_f_GridListItem_HeaderHeight: 2.75rem;

package/src/sap/f/themes/sap_fiori_3_hcb/CardLoading.less

@@ -1,8 +1,7 @@
 /* ================================== */
 /* CSS for control sap.f/CardLoading  */
-/* Quartz High Contrast Black theme          */
+/* Quartz High Contrast Black theme   */
 /* ================================== */
 
 @_sap_f_Card_Background_Placeholder_Color: @sapUiHcReducedForeground;
-@_sap_f_Card_Placeholder_Gradient: linear-gradient(to right, @sapUiHcReducedForeground 0%, @sapUiHcReducedForeground 35%, @sapUiHcReducedAltForeground 50%, @sapUiHcReducedForeground 65%, @sapUiHcReducedForeground 100%);
-
+@_sap_f_Card_Placeholder_Gradient: linear-gradient(to right, @sapUiHcReducedForeground 0%, @sapUiHcReducedForeground 35%, @sapUiHcReducedAltForeground 50%, @sapUiHcReducedForeground 65%, @sapUiHcReducedForeground 100%);

package/src/sap/f/themes/sap_fiori_3_hcb/GridContainer.less

@@ -1,6 +1,6 @@
-/* =================================== */
-/* CSS for control sap.f/GridContainer */
-/* Quartz High Contrast Black theme    */
-/* =================================== */
+/* ==================================== */
+/* CSS for control sap.f/GridContainer  */
+/* Quartz High Contrast Black theme     */
+/* ==================================== */
 
 @_sap_f_GridContainer_FocusBorderOffset: -2px;

package/src/sap/f/themes/sap_fiori_3_hcb/GridListItem.less

@@ -1,7 +1,7 @@
 /* =================================== */
 /* CSS for control sap.f/GridListItem  */
-/* Fiori 3 theme                       */
+/* Quartz High Contrast Black theme    */
 /* =================================== */
 
-@_sap_f_GridListItem_HeaderBoxShadow: 0 0 0.25rem 0 fade(@sapUiContentShadowColor, 15), inset 0 -0.0625rem 0 0 @sapUiPageHeaderBorderColor;
-@_sap_f_GridListItem_HeaderHeight: 2.75rem;
+@_sap_f_GridListItem_HeaderBoxShadow: 0 0 0.25rem 0 fade(@sapUiContentShadowColor, 15), inset 0 -0.0625rem 0 0 var(--sapPageHeader_BorderColor);
+@_sap_f_GridListItem_HeaderHeight: 2.75rem;

package/src/sap/f/themes/sap_fiori_3_hcw/CardLoading.less

@@ -1,8 +1,7 @@
 /* ================================== */
 /* CSS for control sap.f/CardLoading  */
-/* Quartz High Contrast White theme         */
+/* Quartz High Contrast White theme   */
 /* ================================== */
 
 @_sap_f_Card_Background_Placeholder_Color: @sapUiHcReducedForeground;
-@_sap_f_Card_Placeholder_Gradient: linear-gradient(to right, @sapUiHcReducedForeground 0%, @sapUiHcReducedForeground 35%, @sapUiHcReducedForeground 50%, @sapUiHcReducedForeground 65%, @sapUiHcReducedForeground 100%);
-
+@_sap_f_Card_Placeholder_Gradient: linear-gradient(to right, @sapUiHcReducedForeground 0%, @sapUiHcReducedForeground 35%, @sapUiHcReducedForeground 50%, @sapUiHcReducedForeground 65%, @sapUiHcReducedForeground 100%);

package/src/sap/f/themes/sap_fiori_3_hcw/GridContainer.less

@@ -1,6 +1,6 @@
-/* =================================== */
-/* CSS for control sap.f/GridContainer */
-/* Quartz High Contrast White theme    */
-/* =================================== */
+/* ==================================== */
+/* CSS for control sap.f/GridContainer  */
+/* Quartz High Contrast White theme     */
+/* ==================================== */
 
 @_sap_f_GridContainer_FocusBorderOffset: -2px;

package/src/sap/f/themes/sap_fiori_3_hcw/GridListItem.less

@@ -1,7 +1,7 @@
 /* =================================== */
 /* CSS for control sap.f/GridListItem  */
-/* Fiori 3 theme                       */
+/* Quartz High Contrast White theme    */
 /* =================================== */
 
-@_sap_f_GridListItem_HeaderBoxShadow: 0 0 0.25rem 0 fade(@sapUiContentShadowColor, 15), inset 0 -0.0625rem 0 0 @sapUiPageHeaderBorderColor;
-@_sap_f_GridListItem_HeaderHeight: 2.75rem;
+@_sap_f_GridListItem_HeaderBoxShadow: 0 0 0.25rem 0 fade(@sapUiContentShadowColor, 15), inset 0 -0.0625rem 0 0 var(--sapPageHeader_BorderColor);
+@_sap_f_GridListItem_HeaderHeight: 2.75rem;

package/src/sap/m/themes/sap_fiori_3/IconTabBar.less

@@ -14,7 +14,6 @@
 /* ==================== Cozy size ==================== */
 
 /* Content arrow */
-@_sap_m_IconTabBar_ContentArrowBorderWidth: 0.1875rem;
 @_sap_m_IconTabBar_ContentArrowHeight: 0.875rem;
 
 /* Inline mode */
@@ -225,7 +224,6 @@
 }
 
 .sapMITBContentArrow {
-	border-bottom: none;
 	position: relative;
 
 	/* creates border bottom with rounded top corners */
@@ -235,7 +233,6 @@
 		bottom: 0;
 		left: 0;
 		right: 0;
-		height: @_sap_m_IconTabBar_ContentArrowBorderWidth;
 		border-radius: 0.125rem 0.125rem 0 0;
 	}
 }

package/src/sap/m/themes/sap_fiori_3/MessageStrip.less

@@ -3,9 +3,6 @@
 /* Fiori 3 theme                       */
 /* =================================== */
 
-.sapMMsgStrip {
-	border-radius: var(--sapElement_BorderCornerRadius);
-}
 
 .sapMMsgStripInformation {
 	background-color: var(--sapInformationBackground);

package/src/sap/m/themes/sap_fiori_3/RadioButton.less

@@ -104,6 +104,14 @@
 	opacity: var(--sapContent_DisabledOpacity);
 }
 
+/* Read Only */
+.sapMRb.sapMRbRo {
+
+	.sapMRbBOut {
+		stroke-dasharray: 4,2;
+	}
+}
+
 /* Value states */
 
 .sapMRbErr.sapMRbSel,

package/src/sap/m/themes/sap_fiori_3/TimePicker.less

@@ -3,6 +3,6 @@
 /* Fiori 3 theme                     */
 /* ================================= */
 
-@_sap_m_TimePicker_ItemColor: @sapUiLegendWorkingBackground;
-@_sap_m_TimePicker_ItemHoverColor: @sapUiListHoverBackground;
-@_sap_m_TimePicker_ItemBorderColor: @sapUiListBackground;
+@_sap_m_TimePicker_ItemColor: var(--sapLegend_WorkingBackground);
+@_sap_m_TimePicker_ItemHoverColor: var(--sapList_Hover_Background);
+@_sap_m_TimePicker_ItemBorderColor: var(--sapList_Background);

package/src/sap/m/themes/sap_fiori_3/TimePickerSliders.less

@@ -3,16 +3,16 @@
 /* Fiori 3 theme                            */
 /* ======================================== */
 
-/* ======================================== */
-/* TimePicker Dropdown                      */
-/* ======================================== */
+/* TimePicker Dropdown */
 .sapMTimePickerSlider {
+
 	.sapMTimePickerItem {
-		border-radius: @sapUiButtonBorderCornerRadius;
+		border-radius: var(--sapButton_BorderCornerRadius);
 	}
 }
 
 .sapMTimePickerContainer {
+
 	.sapMTPColumn:not(:last-child),
 	.sapMTPColumn.sapMTPSliderExpanded:not(:last-child) {
 		margin-right: 0.5rem;
@@ -20,74 +20,95 @@
 }
 
 .sapMTimePickerContainer .sapMTPColumn {
+
 	.sapMTimePickerSlider,
 	.sapMTimePickerLabel,
 	.sapMTimePickerSlider {
+
 		.sapMTimePickerItem,
 		.sapMTPPickerSelectionFrame,
 		.sapMTPSliderExpanded {
 			width: 3rem;
 			height: 2.875rem;
 		}
+
 		width: 3rem;
 		height: 2.875rem;
 	}
 }
 
 .sapUiSizeCompact .sapMTimePickerContainer .sapMTPColumn {
+
 	.sapMTimePickerSlider,
 	.sapMTimePickerLabel,
 	.sapMTimePickerSlider {
+
 		.sapMTimePickerItem,
 		.sapMTPPickerSelectionFrame,
 		.sapMTPSliderExpanded {
 			width: 3rem;
 		}
+
 		width: 3rem;
 		height: 2rem;
 	}
 }
 
 .sapMTimePickerContainer {
+
 	.sapMTPColumn {
+
 		.sapMTimePickerSlider {
+
 			.sapMTimePickerItem {
-				background: @sapUiContentSelectedBackground;
-				border: 1px solid @sapUiListBackground;;
+				background: var(--sapContent_Selected_Background);
+				border: 1px solid var(--sapList_Background);
+
 				&:hover {
-					background: @sapUiContentSelectedHoverBackground;
+					background: var(--sapContent_Selected_Hover_Background);
 				}
 			}
 		}
+
 		&.sapMTPSliderExpanded {
+
 			.sapMTimePickerSlider {
+
 				.sapMTimePickerItem {
-					background: @sapUiLegendWorkingBackground;
-					border: 0.0625rem solid @sapUiListBackground;;
+					background: var(--sapLegend_WorkingBackground);
+					border: 0.0625rem solid var(--sapList_Background);
+
 					&:hover {
-						background: @sapUiListHoverBackground;
+						background: var(--sapList_Hover_Background);
 					}
+
 					&:active {
-						background: @sapUiContentSelectedBackground;
-						color: @sapUiContentSelectedTextColor;
+						background: var(--sapContent_Selected_Background);
+						color: var(--sapContent_Selected_TextColor);
 					}
-					&.sapMTimePickerItemSelected{
-						background: @sapUiListBackground
+
+	 				&.sapMTimePickerItemSelected {
+						background: var(--sapList_Background)
 					}
 				}
+
 				.sapMTPPickerSelectionFrame {
-					border: 0.0625rem solid @sapUiListSelectionBorderColor;
-					border-radius: @sapUiButtonBorderCornerRadius;
+					border: 0.0625rem solid var(--sapList_SelectionBorderColor);
+					border-radius: var(--sapButton_BorderCornerRadius);
 					outline:none;
+
 					&:hover {
+
 						+ ul > li.sapMTimePickerItem.sapMTimePickerItemSelected {
-							background: @sapUiListHoverBackground;
+							background: var(--sapList_Hover_Background);
 						}
 					}
+
 					&:active {
+
 						& + ul > li.sapMTimePickerItem.sapMTimePickerItemSelected {
-							background: @sapUiContentSelectedBackground;
-							color: @sapUiContentSelectedTextColor;
+							background: var(--sapContent_Selected_Background);
+							color: var(--sapContent_Selected_TextColor);
 						}
 					}
 				}
@@ -100,41 +121,48 @@
 	}
 }
 
-
 /* PHONE STYLES */
 .sap-phone {
-	/* ======================================== */
-	/* TimePicker Dropdown                      */
-	/* ======================================== */
 
+	/* TimePicker Dropdown */
 	.sapMTimePickerContainer {
+
 		.sapMTPColumn {
+
 			.sapMTimePickerSlider,
 			.sapMTimePickerLabel,
 			.sapMTimePickerSlider {
+
 				.sapMTimePickerItem,
 				.sapMTPPickerSelectionFrame,
 				.sapMTPSliderExpanded {
 					width: 3rem;
 					height: 2.875rem;
 				}
+
 				width: 3rem;
 				height: 2.875rem;
 			}
+
 			.sapMTimePickerSlider {
+
 				.sapMTimePickerItem {
-					border: 1px solid @sapUiListBackground;;
+					border: 1px solid var(--sapList_Background);
 				}
 			}
+
 			&.sapMTPSliderExpanded {
+
 				.sapMTimePickerSlider {
+
 					.sapMTimePickerItem {
-						background: @sapUiLegendWorkingBackground;
-						border: 1px solid @sapUiListBackground;;
+						background: var(--sapLegend_WorkingBackground);
+						border: 1px solid var(--sapList_Background);
 						width: 3rem;
 					}
+
 					.sapMTPPickerSelectionFrame {
-						outline: 0.125rem solid @sapUiSelected;
+						outline: 0.125rem solid var(--sapSelectedColor);
 						outline-offset: -0.188rem;
 					}
 				}

package/src/sap/m/themes/sap_fiori_3_dark/IconTabBar.less

@@ -14,7 +14,6 @@
 /* ==================== Cozy size ==================== */
 
 /* Content arrow */
-@_sap_m_IconTabBar_ContentArrowBorderWidth: 0.1875rem;
 @_sap_m_IconTabBar_ContentArrowHeight: 0.875rem;
 
 /* Inline mode */
@@ -226,7 +225,6 @@
 }
 
 .sapMITBContentArrow {
-	border-bottom: none;
 	position: relative;
 
 	/* creates border bottom with rounded top corners */
@@ -236,7 +234,6 @@
 		bottom: 0;
 		left: 0;
 		right: 0;
-		height: @_sap_m_IconTabBar_ContentArrowBorderWidth;
 		border-radius: 0.125rem 0.125rem 0 0;
 	}
 }

package/src/sap/m/themes/sap_fiori_3_dark/MessageStrip.less

@@ -3,10 +3,6 @@
 /* Quartz Dark theme                   */
 /* =================================== */
 
-.sapMMsgStrip {
-	border-radius: var(--sapElement_BorderCornerRadius);
-}
-
 .sapMMsgStripInformation {
 	background-color: var(--sapInformationBackground);
 	border-color: var(--sapInformationBorderColor);

package/src/sap/m/themes/sap_fiori_3_dark/RadioButton.less

@@ -104,6 +104,14 @@
 	opacity: var(--sapContent_DisabledOpacity);
 }
 
+/* Read Only */
+.sapMRb.sapMRbRo {
+
+	.sapMRbBOut {
+		stroke-dasharray: 4,2;
+	}
+}
+
 /* Value states */
 
 .sapMRbErr.sapMRbSel,

package/src/sap/m/themes/sap_fiori_3_dark/TimePicker.less

@@ -3,6 +3,6 @@
 /* Quartz Dark theme                 */
 /* ================================= */
 
-@_sap_m_TimePicker_ItemColor: @sapUiLegendWorkingBackground;
-@_sap_m_TimePicker_ItemHoverColor: @sapUiListHoverBackground;
-@_sap_m_TimePicker_ItemBorderColor: @sapUiListBackground;
+@_sap_m_TimePicker_ItemColor: var(--sapLegend_WorkingBackground);
+@_sap_m_TimePicker_ItemHoverColor: var(--sapList_Hover_Background);
+@_sap_m_TimePicker_ItemBorderColor: var(--sapList_Background);