@openui5/themelib_sap_horizon 1.136.1 → 1.138.0

package/src/sap/ui/dt/themes/sap_horizon_dark/ContextMenu.less

@@ -3,19 +3,19 @@
 *******************************************************************/
 @_sap_ui_dt_ContextMenu_BorderRadius: @sapUiFieldBorderCornerRadius; // 0.25rem
 
-.sapUiDtContextMenu {
-	.sapUiMnuLst {
-		.sapUiMnuItm {
+.sapUiDtContextMenu.sapMMenu {
+	.sapMMenuList {
+		.sapMMenuItem {
 			margin: 0.0625rem;
 			border-radius: @_sap_ui_dt_ContextMenu_BorderRadius;
 
 			&:focus {
 				outline-offset: -0.125rem;
-				&.sapUiMnuItmDsbl{
+				&.sapMMenuItemDisabled{
 					outline: none;
 				}
 			}
-			&.sapUiMnuItmSubMnuOpen {
+			&.sapMMenuItemSubMenuOpen {
 				border-bottom: none !important; //1px
 			}
 		}

package/src/sap/ui/dt/themes/sap_horizon_hcb/ContextMenu.less

@@ -4,11 +4,20 @@
 @_sap_ui_dt_ContextMenu_BorderRadius: @sapUiButtonBorderCornerRadius; // 0.375rem
 @_sap_ui_dt_ContextMenu_OpenSubMenuBackgroundColor: @sapUiSelected; //#0f5c93
 
-.sapUiDtContextMenu {
-	.sapUiMnuLst {
-		.sapUiMnuItm {
+.sapUiDtContextMenu.sapMMenu {
+	.sapMMenuList {
+		.sapMMenuItem {
 
-			&.sapUiMnuItmDsbl {
+			.sapMMenuEndContent{
+				.sapMBtn {
+					&:focus-visible > .sapMFocusable,
+					&:focus > .sapMFocusable{
+						outline: none;
+					}
+				}
+			}
+
+			&.sapMMenuItemDisabled {
 				opacity: 1;
 			}
 
@@ -16,11 +25,11 @@
 				border-radius: @_sap_ui_dt_ContextMenu_BorderRadius;
 			}
 
-			&.sapUiMnuItmSubMnuOpen {
+			&.sapMMenuItemSubMenuOpen {
 				border-bottom: 0.0625rem solid transparent !important; //remove border
 				border-radius: @_sap_ui_dt_ContextMenu_BorderRadius;
 
-				&:not(.sapUiMnuItmHov) {
+				&:not(:hover) {
 					background-color: @_sap_ui_dt_ContextMenu_OpenSubMenuBackgroundColor;
 				}
 			}

package/src/sap/ui/dt/themes/sap_horizon_hcw/ContextMenu.less

@@ -4,19 +4,28 @@
 @_sap_ui_dt_ContextMenu_BorderRadius: @sapUiButtonBorderCornerRadius; // .375rem
 @_sap_ui_dt_ContextMenu_OpenSubMenuBackgroundColor: @sapUiButtonSelectedBackground; //#5c93ff
 
-.sapUiDtContextMenu {
-	.sapUiMnuLst {
-		.sapUiMnuItm {
+.sapUiDtContextMenu.sapMMenu {
+	.sapMMenuList {
+		.sapMMenuItem {
+
+			.sapMMenuEndContent{
+				.sapMBtn {
+					&:focus-visible > .sapMFocusable,
+					&:focus > .sapMFocusable{
+						outline: none;
+					}
+				}
+			}
 
 			&:focus {
 				border-radius: @_sap_ui_dt_ContextMenu_BorderRadius;
 			}
 
-			&.sapUiMnuItmSubMnuOpen {
+			&.sapMMenuItemSubMenuOpen {
 				border-bottom: 0.0625rem solid transparent !important; //1px
 				border-radius: @_sap_ui_dt_ContextMenu_BorderRadius;
 
-				&:not(.sapUiMnuItmHov) {
+				&:not(:hover) {
 					background-color: @_sap_ui_dt_ContextMenu_OpenSubMenuBackgroundColor;
 				}
 			}

package/src/sap/ui/mdc/themes/sap_horizon/Chart.less

@@ -1,6 +1,6 @@
-/* =================================== */
-/* CSS for control sap.ui.mdc/Chart    */
-/* Horizon theme                       */
-/* =================================== */
+/* ================================= */
+/* CSS for control sap.ui.mdc/Chart  */
+/* Morning Horizon theme             */
+/* ================================= */
 
-@_sap_ui_mdc_Chart_ToolbarDesign: ~"Solid";
+@_sap_ui_mdc_Chart_ToolbarDesign: ~"Solid";

package/src/sap/ui/mdc/themes/sap_horizon_dark/Chart.less

@@ -1,6 +1,6 @@
-/* =================================== */
-/* CSS for control sap.ui.mdc/Chart    */
-/* Evening Horizon theme               */
-/* =================================== */
+/* ================================= */
+/* CSS for control sap.ui.mdc/Chart  */
+/* Evening Horizon theme             */
+/* ================================= */
 
-@_sap_ui_mdc_Chart_ToolbarDesign: ~"Solid";
+@_sap_ui_mdc_Chart_ToolbarDesign: ~"Solid";

package/src/sap/ui/mdc/themes/sap_horizon_hcb/Chart.less

@@ -1,6 +1,6 @@
-/* =================================== */
-/* CSS for control sap.ui.mdc/Chart    */
-/* Horizon High Contrast Black theme   */
-/* =================================== */
+/* ================================== */
+/* CSS for control sap.ui.mdc/Chart   */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
 
-@_sap_ui_mdc_Chart_ToolbarDesign: ~"Solid";
+@_sap_ui_mdc_Chart_ToolbarDesign: ~"Solid";

package/src/sap/ui/mdc/themes/sap_horizon_hcw/Chart.less

@@ -1,6 +1,6 @@
-/* =================================== */
-/* CSS for control sap.ui.mdc/Chart    */
-/* Horizon High Contrast White theme   */
-/* =================================== */
+/* ================================== */
+/* CSS for control sap.ui.mdc/Chart   */
+/* Horizon High Contrast White theme  */
+/* ================================== */
 
-@_sap_ui_mdc_Chart_ToolbarDesign: ~"Solid";
+@_sap_ui_mdc_Chart_ToolbarDesign: ~"Solid";

package/src/sap/ui/rta/themes/sap_horizon_hcb/ContextMenu.less

@@ -21,11 +21,11 @@
 	}
 }
 
-.sapUiDtContextMenu {
-	.sapUiMnuLst {
-		.sapUiMnuItm {
+.sapUiDtContextMenu.sapMMenu {
+	.sapMMenuList {
+		.sapMMenuItem {
 			&:focus {
-				&.sapUiMnuItmDsbl{
+				&.sapMMenuItemDisabled{
 					outline: none;
 				}
 			}

package/src/sap/ui/rta/themes/sap_horizon_hcw/ContextMenu.less

@@ -17,11 +17,11 @@
 	}
 }
 
-.sapUiDtContextMenu {
-	.sapUiMnuLst {
-		.sapUiMnuItm {
+.sapUiDtContextMenu.sapMMenu {
+	.sapMMenuList {
+		.sapMMenuItem {
 			&:focus {
-				&.sapUiMnuItmDsbl{
+				&.sapMMenuItemDisabled{
 					outline: none;
 				}
 			}

package/src/sap/ui/unified/themes/sap_horizon/Calendar.less

@@ -696,7 +696,7 @@ html.sap-desktop .sapUiCalItemOtherMonth:not(.sapUiCalItemSel) :not(.sapUiCalWee
 
 .sapUiCalMonthSecType {
 	.sapUiCalItem {
-		border-radius: 0.375rem;
+		border-radius: var(--sapButton_BorderCornerRadius);
 
 		.sapUiCalItemSecText {
 			width: 60%;

package/src/sap/ui/unified/themes/sap_horizon/CalendarRow.less

@@ -60,31 +60,6 @@ html.sap-desktop .sapUiCalendarApp.sapUiCalendarAppSel:focus:not(:active) > .sap
 	background-color: @sapUiContentSelectedBackground;
 }
 
-.sapMListTblRow.sapMLIBFocusable:focus {
-	.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
-		position: absolute;
-		top: 0px;
-		left: -1px;
-		right: 1px;
-		bottom: 0px;
-		content: "";
-		border: 0.195rem solid @sapUiContentFocusColor;
-		border-left: none;
-		pointer-events: none;
-	}
-
-	.sapUiCalendarRowAppsIntNoHead.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
-		position: absolute;
-		top: 0px;
-		left: -1px;
-		right: 1px;
-		bottom: 1px;
-		content: "";
-		border: 0.0625rem dotted @sapUiContentFocusColor;
-		pointer-events: none;
-	}
-}
-
 html[data-sap-ui-browser ^= "ie"], html[data-sap-ui-browser^="ed"] {
 	.sapUiCalendarApp:focus > .sapUiCalendarAppCont:after{
 		border-style: dashed;

package/src/sap/ui/unified/themes/sap_horizon_dark/CalendarRow.less

@@ -60,31 +60,6 @@ html.sap-desktop .sapUiCalendarApp.sapUiCalendarAppSel:focus:not(:active) > .sap
 	background-color: @sapUiContentSelectedBackground;
 }
 
-.sapMListTblRow.sapMLIBFocusable:focus {
-	.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
-		position: absolute;
-		top: 0px;
-		left: -1px;
-		right: 1px;
-		bottom: 0px;
-		content: "";
-		border: 0.195rem solid @sapUiContentFocusColor;
-		border-left: none;
-		pointer-events: none;
-	}
-
-	.sapUiCalendarRowAppsIntNoHead.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
-		position: absolute;
-		top: 0px;
-		left: -1px;
-		right: 1px;
-		bottom: 1px;
-		content: "";
-		border: 0.0625rem dotted @sapUiContentFocusColor;
-		pointer-events: none;
-	}
-}
-
 html[data-sap-ui-browser ^= "ie"], html[data-sap-ui-browser^="ed"] {
 	.sapUiCalendarApp:focus > .sapUiCalendarAppCont:after{
 		border-style: dashed;

package/src/sap/ui/unified/themes/sap_horizon_hcb/CalendarRow.less

@@ -51,30 +51,6 @@ html.sap-desktop .sapUiCalendarApp:hover:not(:active) > .sapUiCalendarAppCont {
 	background-color: @sapUiListHoverBackground;
 }
 
-.sapMListTblRow.sapMLIBFocusable:focus {
-	.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
-		position: absolute;
-		top: 0px;
-		left: -1px;
-		right: 1px;
-		bottom: 0px;
-		content: "";
-		border: 0.0625rem dotted @sapUiContentFocusColor;
-		pointer-events: none;
-	}
-
-	.sapUiCalendarRowAppsIntNoHead.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
-		position: absolute;
-		top: 0px;
-		left: -1px;
-		right: 1px;
-		bottom: 1px;
-		content: "";
-		border: 0.0625rem dotted @sapUiContentFocusColor;
-		pointer-events: none;
-	}
-}
-
 html[data-sap-ui-browser ^= "ie"], html[data-sap-ui-browser^="ed"] {
 	.sapUiCalendarApp:focus > .sapUiCalendarAppCont:after{
 		border-style: dashed;

package/src/sap/ui/unified/themes/sap_horizon_hcw/CalendarRow.less

@@ -51,30 +51,6 @@ html.sap-desktop .sapUiCalendarApp:hover:not(:active) > .sapUiCalendarAppCont {
 	background-color: @sapUiListHoverBackground;
 }
 
-.sapMListTblRow.sapMLIBFocusable:focus {
-	.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
-		position: absolute;
-		top: 0px;
-		left: -1px;
-		right: 1px;
-		bottom: 0px;
-		content: "";
-		border: 0.0625rem dotted @sapUiContentFocusColor;
-		pointer-events: none;
-	}
-
-	.sapUiCalendarRowAppsIntNoHead.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
-		position: absolute;
-		top: 0px;
-		left: -1px;
-		right: 1px;
-		bottom: 1px;
-		content: "";
-		border: 0.0625rem dotted @sapUiContentFocusColor;
-		pointer-events: none;
-	}
-}
-
 html[data-sap-ui-browser ^= "ie"], html[data-sap-ui-browser^="ed"] {
 	.sapUiCalendarApp:focus > .sapUiCalendarAppCont:after{
 		border-style: dashed;

package/src/sap/uxap/themes/sap_horizon/ObjectPageSection.less

@@ -15,8 +15,8 @@
 }
 
 .sapUxAPObjectPageLayout-Std-Desktop .sapUxAPObjectPageSubSectionHeader {
-	padding-left: 2rem;
-	padding-right: 2rem;
+	padding-left: 1rem;
+	padding-right: 1.25rem;
 }
 
 .sapUiSizeCompact .sapUxAPObjectPageSectionHeader,
@@ -71,10 +71,18 @@
     border-radius: @sapUiElementBorderCornerRadius;
 }
 
-// Page Section Focus - Experimental
-.sapUxAPObjectPageSection:focus {
-	outline: 2px solid @sapUiContentFocusColor;
-    outline-offset: -0.1875rem;
+// Page Section Focus
+.sapUxAPObjectPageSection:focus::before {
+	content: '';
+	position: absolute;
+	display: block;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	z-index: 6;
+	pointer-events: none;
 }
 
 // Styles suporting Table inside ObjectPageSubSection scenario

package/src/sap/uxap/themes/sap_horizon/ObjectPageSubSection.less

@@ -34,10 +34,15 @@
 // Delta Styles for Horizon
 // =====================================
 
-// Page Sub Section Focus - Experimental
-.sapUxAPObjectPageSubSectionFocusable:focus {
-	outline: 2px solid @sapUiContentFocusColor;
-    outline-offset: -0.1875rem;
+// Page Sub Section Focus
+.sapUxAPObjectPageSubSectionFocusable:focus .sapUxAPObjectPageSubSectionFocusSpan {
+	content: '';
+	position: absolute;
+	display: block;
+	inset: 0;
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	z-index: 6;
+	pointer-events: none;
 }
 
 .sapUxAPObjectPageLayout-Std-Phone .sapUxAPObjectPageSubSection .sapUiRespGrid.sapUiRespGridHSpace1 {
@@ -68,4 +73,4 @@ div[class^="sapUiRespGrid"]:first-child > .sapUxAPObjectPageSubSection:not(.sapU
 
 .sapUxAPBlockContainer .sapUxAPObjectPageSubSectionAlignContent {
 	padding: 0 1rem;
-}
+}

package/src/sap/uxap/themes/sap_horizon_dark/ObjectPageSection.less

@@ -15,8 +15,8 @@
 }
 
 .sapUxAPObjectPageLayout-Std-Desktop .sapUxAPObjectPageSubSectionHeader {
-	padding-left: 2rem;
-	padding-right: 2rem;
+	padding-left: 1rem;
+	padding-right: 1.25rem;
 }
 
 .sapUiSizeCompact .sapUxAPObjectPageSectionHeader,
@@ -77,10 +77,18 @@
     border-radius: @sapUiElementBorderCornerRadius;
 }
 
-// Page Section Focus - Experimental
-.sapUxAPObjectPageSection:focus {
-	outline: 2px solid @sapUiContentFocusColor;
-    outline-offset: -0.1875rem;
+// Page Section Focus
+.sapUxAPObjectPageSection:focus::before {
+	content: '';
+	position: absolute;
+	display: block;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	z-index: 6;
+	pointer-events: none;
 }
 
 .sapUiSizeCompact .sapUxAPObjectPageSectionTitle {

package/src/sap/uxap/themes/sap_horizon_dark/ObjectPageSubSection.less

@@ -45,10 +45,15 @@
 // Delta Styles for Horizon
 // =====================================
 
-// Page Sub Section Focus - Experimental
-.sapUxAPObjectPageSubSectionFocusable:focus {
-    outline: 2px solid @sapUiContentFocusColor;
-    outline-offset: -0.1875rem;
+// Page Sub Section Focus
+.sapUxAPObjectPageSubSectionFocusable:focus .sapUxAPObjectPageSubSectionFocusSpan {
+	content: '';
+	position: absolute;
+	display: block;
+	inset: 0;
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	z-index: 6;
+	pointer-events: none;
 }
 
 .sapUxAPObjectPageLayout-Std-Phone .sapUxAPObjectPageSubSection .sapUiRespGrid.sapUiRespGridHSpace1 {
@@ -79,4 +84,4 @@ div[class^="sapUiRespGrid"]:first-child > .sapUxAPObjectPageSubSection:not(.sapU
 
 .sapUxAPBlockContainer .sapUxAPObjectPageSubSectionAlignContent {
 	padding: 0 1rem;
-}
+}

package/src/sap/uxap/themes/sap_horizon_hcb/ObjectPageSection.less

@@ -15,8 +15,8 @@
 }
 
 .sapUxAPObjectPageLayout-Std-Desktop .sapUxAPObjectPageSubSectionHeader {
-	padding-left: 2rem;
-	padding-right: 2rem;
+	padding-left: 1rem;
+	padding-right: 1.25rem;
 }
 
 .sapUxAPObjectPageSection {
@@ -39,9 +39,18 @@
 	line-height: 2.25rem;
 }
 
-.sapUxAPObjectPageSection:focus {
-	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
-	outline-offset: -0.1875rem;
+// Page Section Focus
+.sapUxAPObjectPageSection:focus::before {
+	content: '';
+	position: absolute;
+	display: block;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	z-index: 6;
+	pointer-events: none;
 }
 
 .sapUxAPObjectPageSectionHeader,

package/src/sap/uxap/themes/sap_horizon_hcb/ObjectPageSubSection.less

@@ -7,9 +7,15 @@
 	text-transform: uppercase;
 }
 
-.sapUxAPObjectPageSubSectionFocusable:focus {
-	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
-	outline-offset: -0.1875rem;
+// Page Sub Section Focus
+.sapUxAPObjectPageSubSectionFocusable:focus .sapUxAPObjectPageSubSectionFocusSpan {
+	content: '';
+	position: absolute;
+	display: block;
+	inset: 0;
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	z-index: 6;
+	pointer-events: none;
 }
 
 .sapUiSizeCompact .sapMTB.sapUxAPObjectPageSubSectionHeaderToolbar,

package/src/sap/uxap/themes/sap_horizon_hcw/ObjectPageSection.less

@@ -15,8 +15,8 @@
 }
 
 .sapUxAPObjectPageLayout-Std-Desktop .sapUxAPObjectPageSubSectionHeader {
-	padding-left: 2rem;
-	padding-right: 2rem;
+	padding-left: 1rem;
+	padding-right: 1.25rem;
 }
 
 .sapUxAPObjectPageSection {
@@ -33,9 +33,18 @@
 	border-top: 0;
 }
 
-.sapUxAPObjectPageSection:focus {
-	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
-	outline-offset: -0.1875rem;
+// Page Section Focus
+.sapUxAPObjectPageSection:focus::before {
+	content: '';
+	position: absolute;
+	display: block;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	z-index: 6;
+	pointer-events: none;
 }
 
 .sapUxAPObjectPageSectionHeader,

package/src/sap/uxap/themes/sap_horizon_hcw/ObjectPageSubSection.less

@@ -7,9 +7,15 @@
 	text-transform: uppercase;
 }
 
-.sapUxAPObjectPageSubSectionFocusable:focus {
-	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
-	outline-offset: -0.1875rem;
+// Page Sub Section Focus
+.sapUxAPObjectPageSubSectionFocusable:focus .sapUxAPObjectPageSubSectionFocusSpan {
+	content: '';
+	position: absolute;
+	display: block;
+	inset: 0;
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	z-index: 6;
+	pointer-events: none;
 }
 
 .sapUiSizeCompact .sapMTB.sapUxAPObjectPageSubSectionHeaderToolbar,

package/src/sap/f/themes/sap_horizon/ProductSwitchItem.less

@@ -1,4 +0,0 @@
-/* ======================================== */
-/* CSS for control sap.f/ProductSwitchItem  */
-/* Horizon theme                            */
-/* ======================================== */

package/src/sap/f/themes/sap_horizon_dark/ProductSwitchItem.less

@@ -1,4 +0,0 @@
-/* ======================================== */
-/* CSS for control sap.f/ProductSwitchItem  */
-/* Evening Horizon theme                    */
-/* ======================================== */

package/src/sap/f/themes/sap_horizon_hcb/ProductSwitchItem.less

@@ -1,8 +0,0 @@
-/* ==================================== */
-/* CSS for control sap.f.ProductSwitch  */
-/* Horizon High Contrast Black theme    */
-/* ==================================== */
-
-.sapFPSItemContainer {
-    box-shadow: @sapUiShadowLevel0;
-}

package/src/sap/f/themes/sap_horizon_hcw/ProductSwitchItem.less

@@ -1,8 +0,0 @@
-/* ==================================== */
-/* CSS for control sap.f.ProductSwitch  */
-/* Horizon High Contrast White theme    */
-/* ==================================== */
-
-.sapFPSItemContainer {
-    box-shadow: @sapUiShadowLevel0;
-}