@openui5/themelib_sap_belize 1.101.0 → 1.102.0

package/THIRDPARTY.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.38
+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/themelib_sap_belize",
-  "version": "1.101.0",
+  "version": "1.102.0",
   "description": "OpenUI5 Theme Library sap_belize",
   "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.101.0",
-    "@openui5/sap.m": "1.101.0",
-    "@openui5/sap.tnt": "1.101.0",
-    "@openui5/sap.ui.codeeditor": "1.101.0",
-    "@openui5/sap.ui.commons": "1.101.0",
-    "@openui5/sap.ui.core": "1.101.0",
-    "@openui5/sap.ui.dt": "1.101.0",
-    "@openui5/sap.ui.fl": "1.101.0",
-    "@openui5/sap.ui.mdc": "1.101.0",
-    "@openui5/sap.ui.integration": "1.101.0",
-    "@openui5/sap.ui.layout": "1.101.0",
-    "@openui5/sap.ui.rta": "1.101.0",
-    "@openui5/sap.ui.suite": "1.101.0",
-    "@openui5/sap.ui.table": "1.101.0",
-    "@openui5/sap.ui.unified": "1.101.0",
-    "@openui5/sap.ui.ux3": "1.101.0",
-    "@openui5/sap.uxap": "1.101.0"
+    "@openui5/sap.f": "1.102.0",
+    "@openui5/sap.m": "1.102.0",
+    "@openui5/sap.tnt": "1.102.0",
+    "@openui5/sap.ui.codeeditor": "1.102.0",
+    "@openui5/sap.ui.commons": "1.102.0",
+    "@openui5/sap.ui.core": "1.102.0",
+    "@openui5/sap.ui.dt": "1.102.0",
+    "@openui5/sap.ui.fl": "1.102.0",
+    "@openui5/sap.ui.mdc": "1.102.0",
+    "@openui5/sap.ui.integration": "1.102.0",
+    "@openui5/sap.ui.layout": "1.102.0",
+    "@openui5/sap.ui.rta": "1.102.0",
+    "@openui5/sap.ui.suite": "1.102.0",
+    "@openui5/sap.ui.table": "1.102.0",
+    "@openui5/sap.ui.unified": "1.102.0",
+    "@openui5/sap.ui.ux3": "1.102.0",
+    "@openui5/sap.uxap": "1.102.0"
   }
 }

package/src/sap/m/themes/sap_belize/Carousel.less

@@ -1,77 +1,4 @@
 /* =============================== */
 /* CSS for control sap.m/Carousel  */
 /* Belize theme                    */
-/* =============================== */
-
-/* Carousel controls: HUD */
-.sapMCrslHud a {
-	opacity: 0.5;
-	box-shadow: @sapUiShadowLevel1;
-}
-
-.sapMCrsl .sapMCrslHud a:hover,
-.sapMCrsl .sapMCrslHud a:focus {
-	box-shadow: @sapUiShadowLevel1;
-	border: 1px solid @sapUiButtonBorderColor;
-}
-
-.sapMCrsl .sapMCrslHud a:active {
-	box-shadow: @sapUiShadowLevel1;
-}
-
-.sapMCrsl:focus {
-	&:before {
-		border: 1px solid @sapUiContentFocusColor;
-		position: absolute;
-		content: " ";
-		top: 0;
-		right: 0;
-		bottom: 0;
-		left: 0;
-		z-index: 2;
-		pointer-events: none;
-	}
-
-	&:after {
-		border: 1px dotted @sapUiContentContrastFocusColor;
-		position: absolute;
-		content: " ";
-		top: 0;
-		right: 0;
-		bottom: 0;
-		left: 0;
-		z-index: 2;
-		pointer-events: none;
-	}
-}
-
-.sapMCrslPrev:focus,
-.sapMCrslNext:focus,
-.sapMCrslPrev .sapUiIcon:focus,
-.sapMCrslNext .sapUiIcon:focus {
-  outline: none;
-}
-
-html.sap-desktop .sapMCrslHud .sapMCrslPrev:focus,
-html.sap-desktop .sapMCrslHud .sapMCrslNext:focus {
-  	&::before {
-		content: "";
-		position: absolute;
-		top: -0.125rem;
-		right: -0.125rem;
-		bottom: -0.125rem;
-		left: -0.125rem;
-		pointer-events: none;
-	}
-
-  	&::after {
-		content: "";
-		position: absolute;
-		top: -0.125rem;
-		right: -0.125rem;
-		bottom: -0.125rem;
-		left: -0.125rem;
-		pointer-events: none;
-		border: 1px dotted @sapUiContentFocusColor;
-	}
-}
+/* =============================== */

package/src/sap/m/themes/sap_belize/Dialog.less

@@ -4,6 +4,7 @@
 /* ============================= */
 
 @_sap_m_Dialog_NoStateHeaderShadow: inset 0 -0.0625rem darken(@sapUiGroupContentBackground, 8);
+@_sap_m_Dialog_InformationHeaderShadow: inset 0 -0.125rem @sapUiNeutralBorder;
 
 // This parameter is used in sap.m.Select. TODO: remove it when it is removed from there.
 @_sap_m_Dialog_HeaderShadowColor: darken(@sapUiGroupContentBackground, 8);
@@ -13,7 +14,7 @@
 	background-color: @sapUiGroupContentBackground;
 }
 
-.sapMDialog.sapMMessageDialog > .sapMDialogTitle .sapMIBar {
+.sapMDialog.sapMMessageDialog:not(.sapMDialogError):not(.sapMDialogWarning):not(.sapMDialogSuccess):not(.sapMDialogInformation):not(.sapMMessageBoxError):not(.sapMMessageBoxWarning):not(.sapMMessageBoxSuccess):not(.sapMMessageBoxInfo):not(.sapMMessageBoxQuestion) > .sapMDialogTitle .sapMIBar {
 	box-shadow: inset 0 -0.125rem darken(@sapUiGroupContentBackground, 8);
 }
 
@@ -21,6 +22,13 @@
 	font-size: 1rem;
 }
 
+.sapMDialogInformation > header {
+
+	&.sapMDialogTitle .sapMDialogIcon.sapUiIcon {
+		color: @sapUiNeutralElement;
+	}
+}
+
 .sapMDialogResizeHandler::before {
 	content: attr(data-sap-ui-icon-content);
 	color: @sapUiButtonEmphasizedBackground;

package/src/sap/m/themes/sap_belize/GenericTile.less

@@ -13,11 +13,47 @@
 	color: @sapUiContentContrastTextColor;
 }
 
+.sapMGT.sapMGTScopeActions{
+	.sapMBtnBase.sapMGTMoreIcon{
+		.sapMBtnIcon{
+			font-size: 1rem;
+			bottom: 0.7rem;
+			left: 0.5rem
+		}
+	}
+}
+
+html.sap-desktop .sapMGTActionButtonPress.sapMGT:focus
+{
+		.sapMGTFocusDiv{
+			border: none;
+		}
+}
+
+html.sap-desktop .sapMGTActionButtonPress.sapMGT:active
+{
+	.sapMGTFocusDiv{
+		border: none;
+	}
+}
+
+html.sap-desktop .sapMGTActionButtonPress.sapMGT:focus-visible
+{
+	.sapMGTFocusDiv{
+	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	}
+}
+
 /************************ LINE MODE LIST VIEW ********************/
 
 .sapMGT.sapMGTLineMode {
 	transition: background 0.2s;
 	background: transparent;
+	.sapMBtnBase.sapMGTMoreIcon{
+		.sapMBtnIcon{
+			bottom: 0.7rem;
+		}
+	}
 }
 
 .sap-desktop .sapMGT.sapMGTLineMode:not(.sapMGTDisabled) {
@@ -220,3 +256,43 @@ html.sap-desktop .sapMGT.sapMGTBackgroundImage:active .sapMGTFocusDiv {
 		z-index: 0;
 	}
 }
+
+.sapMGT.sapMGTScopeActions.TwoByHalf.sapMGTIconMode {
+	.sapMBtn.sapMGTMoreIcon{
+		.sapMBtnInner{
+			height: 2.25rem;
+			min-width: 0;
+		}
+	}
+}
+
+.sapUiSizeCompact{
+	.sapMGT.sapMGTScopeActions.TwoByHalf.sapMGTIconMode {
+		.sapMBtn.sapMGTMoreIcon{
+			.sapMBtnInner{
+				height: 1.625rem;
+				min-width: 0;
+			}
+		}
+	}
+}
+
+.sapUiMedia-GenericTileDeviceSet-large{
+	.sapMGT.sapMGTScopeActions.sapMGTLineMode{
+		.sapMBtnBase.sapMGTMoreIcon{
+			.sapMBtnIcon{
+				left: -0.5rem;
+			}
+		}
+	}
+}
+
+.sapUiMedia-GenericTileDeviceSet-large{
+	.sapMGT.sapMGTScopeSingleAction.sapMGTLineMode{
+		.sapMBtnBase.sapMGTMoreIcon{
+			.sapMBtnIcon{
+				left: 0.5rem;
+			}
+		}
+	}
+}

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

@@ -12,17 +12,10 @@
 
 /* Header Container */
 
-.sapMITH .sapMITBHead {
+.sapMITH:not(.sapMITBTextOnly) .sapMITBHead {
 	padding-top: 1rem;
 }
 
-.sapMITH.sapMITBTextOnly {
-	.sapMITHStartOverflow,
-	.sapMITHEndOverflow {
-		margin-top: 1rem;
-	}
-}
-
 .sapUiSizeCompact .sapMITH,
 .sapUiSizeCompact.sapMITH {
 	&.sapMITBTextOnly {

package/src/sap/m/themes/sap_belize/MessageBox.less

@@ -0,0 +1,7 @@
+/* ================================= */
+/* CSS for control sap.m/MessageBox  */
+/* Belize theme                     */
+/* ================================= */
+
+@_sap_m_MessageBox_InformationShadow: @_sap_m_MessageBox_HeaderShadow @sapUiNeutralBorder;
+@_sap_m_MessageBox_QuestionShadow: @_sap_m_MessageBox_HeaderShadow @sapUiNeutralBorder;

package/src/sap/m/themes/sap_belize/SlideTile.less

@@ -9,7 +9,12 @@ html.sap-desktop .sapMST:active .sapMSTFocusDiv {
 }
 
 .sapMST.sapMSTScopeActions.sapMSTDarkBackground .sapMSTMoreIcon {
-	color: @sapUiContentContrastTextColor;
+	.sapMBtnIcon{
+		color: @sapUiContentContrastTextColor;
+		font-size: 1rem;
+		left: 0.6rem;
+		bottom: 0.7rem;
+	}
 }
 
 /* This part is used to achieve dotted white black interlace border*/

package/src/sap/m/themes/sap_belize/Slider.less

@@ -12,6 +12,12 @@
 	background: @_sap_m_Slider_Background;
 }
 
+.sapMSliderInner,
+.sapMSliderProgress {
+	height: 0.1875rem;
+	border-radius: 0;
+}
+
 /* slider handle */
 .sapMSliderHandle {
 	background: fade(@sapUiFieldBackground, 10);

package/src/sap/m/themes/sap_belize/SplitButton.less

@@ -9,11 +9,11 @@
 }
 
 .sapMSB .sapMSBText .sapMBtnInner.sapMBtnIconFirst {
-	padding-left: 0.625rem;
+	padding-left: 0.5rem;
 }
 
 .sapUiSizeCompact {
 	.sapMSB .sapMSBText .sapMBtnInner.sapMBtnIconFirst {
-		padding-left: 0.5rem;
+		padding-left: 0.425rem;
 	}
 }

package/src/sap/m/themes/sap_belize/Table.less

@@ -23,15 +23,31 @@
 	border-top-color: transparent;
 }
 
-/* Moved due to new default vertical-align regardless of density */
+/* moved due to new default vertical-align regardless of density */
+.sapMListTblSelCol,
 .sapMListTblNavCol,
 .sapMListTblCell {
   vertical-align: top;
 }
 
+/* vertical alignment is middle for the compact */
 .sapUiSizeCompact{
-  .sapMListTblNavCol,
-  .sapMListTblCell {
-    vertical-align: middle;
-  }
+	.sapMListTblSelCol,
+	.sapMListTblNavCol,
+	.sapMListTblCell {
+		vertical-align: middle;
+	}
+}
+
+/* default padding of the data cells */
+.sapMListTblCell {
+	padding-top: .875rem;
+	padding-bottom: .875rem;
+}
+
+/* reduced padding for compact and vAlign=Middle */
+.sapUiSizeCompact .sapMListTblCell,
+.sapMListTblRowMiddle > .sapMListTblCell {
+	padding-top: .25rem;
+	padding-bottom: .25rem;
 }

package/src/sap/m/themes/sap_belize/Token.less

@@ -14,7 +14,7 @@
 	}
 }
 
-html.sap-desktop .sapMToken:hover {
+html.sap-desktop .sapMToken:not(.sapMTokenReadOnly):hover {
 	border: 1px solid @_sap_m_Token_HoverBorderColor;
 }
 

package/src/sap/m/themes/sap_belize/Tokenizer.less

@@ -22,6 +22,7 @@
   &.sapMToken:hover,
   &.sapMToken:focus,
   &.sapMTokenSelected,
+  &.sapMToken.sapMTokenSelected:hover,
   &.sapMToken .sapMTokenIcon {
     background: @sapUiButtonBackground;
     cursor: default;

package/src/sap/m/themes/sap_belize/library.source.less

@@ -20,6 +20,7 @@
 @import "ColorPalette.less";
 @import "CustomTile.less";
 @import "Dialog.less";
+@import "MessageBox.less";
 @import "MessagePage.less";
 @import "GenericTag.less";
 @import "GenericTile.less";

package/src/sap/m/themes/sap_belize_hcb/Carousel.less

@@ -11,67 +11,5 @@
 @_sap_m_Carousel_BulletInactiveWidth: 0.5rem;
 @_sap_m_Carousel_BulletInactiveMargin: 0 0.25rem;
 
-/* Carousel controls: HUD */
-.sapMCrsl {
-    border: 0.125rem solid transparent;
-}
-
-.sapMCrsl:focus {
-    outline: none;
-    border: 0.125rem dotted @sapUiContentFocusColor;
-}
-
-.sapMCrsl .sapMCrslHud,
-.sapMCrsl .sapMCrslHud {
-	border: 3px solid @sapUiButtonBorderColor;
-}
-
-.sapMCrsl .sapMCrslHud a:hover,
-.sapMCrsl .sapMCrslHud a:focus {
-	background-color: @sapUiButtonActiveBackground;
-}
-
-/* extra bits */
-
-/* HCB Additional Styles */
-.sapMCrslHud .sapMCrslPrev,
-.sapMCrslHud .sapMCrslNext {
-	border: 2px solid @sapUiButtonBorderColor;
-}
-
-.sapMCrslControls .sapMCrslPrev,
-.sapMCrslControls .sapMCrslNext {
-	border: 2px solid @sapUiButtonBorderColor;
-}
-
-.sapMCrslPrev:focus,
-.sapMCrslNext:focus,
-.sapMCrslPrev .sapUiIcon:focus,
-.sapMCrslNext .sapUiIcon:focus {
-	outline: none;
-}
-
-html.sap-desktop .sapMCrslHud .sapMCrslPrev:focus,
-html.sap-desktop .sapMCrslHud .sapMCrslNext:focus {
-	&::before {
-		content: "";
-		position: absolute;
-		top: -0.25rem;
-		right: -0.25rem;
-		bottom: -0.25rem;
-		left: -0.25rem;
-		pointer-events: none;
-		border: 2px solid @sapUiContentContrastFocusColor;
-	}
-
-	&::after {
-		content: "";
-		position: absolute;
-		top: -0.25rem;
-		right: -0.25rem;
-		bottom: -0.25rem;
-		left: -0.25rem;
-		pointer-events: none;
-		border: 2px dotted @sapUiBaseBG;
-	}
-}
+@_sap_m_Carousel_FocusBorderOffsetArrow: -0.25rem;
+@_sap_m_Carousel_ContrastFocusBorder: @sapUiContentFocusWidth solid @sapUiBaseBG;

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

@@ -13,7 +13,7 @@
 
 /* Head Container */
 
-.sapMITH .sapMITBHead {
+.sapMITH:not(.sapMITBTextOnly) .sapMITBHead {
 	padding: 1.125rem 0 0 0.125rem;
 }
 

package/src/sap/m/themes/sap_belize_hcb/LightBox.less

@@ -6,7 +6,4 @@
 /* ==========================================================================
    Overlay
   ========================================================================== */
-.sapMLightBox + .sapUiBLy {
-	background: @sapUiBlockLayerBackground;
-	opacity: 0.3;
-}
+@_sap_m_LightBox_OverlayOpacity: 0.3;

package/src/sap/m/themes/sap_belize_hcb/MessageBox.less

@@ -0,0 +1,7 @@
+/* ================================= */
+/* CSS for control sap.m/MessageBox  */
+/* Belize theme                     */
+/* ================================= */
+
+@_sap_m_MessageBox_InformationShadow: @_sap_m_MessageBox_HeaderShadow @sapUiNeutralBorder;
+@_sap_m_MessageBox_QuestionShadow: @_sap_m_MessageBox_HeaderShadow @sapUiNeutralBorder;

package/src/sap/m/themes/sap_belize_hcb/Slider.less

@@ -7,6 +7,11 @@
 .sapMSliderInner {
 	border: 1px solid @sapUiFieldBorderColor;
 	background: @sapUiFieldBackground;
+}
+
+.sapMSliderInner,
+.sapMSliderProgress {
+	height: 0.1875rem;
 	border-radius: 0.125rem;
 }
 
@@ -14,6 +19,12 @@
 .sapMSliderHandle {
 	background: transparent;
 	border: 0.125rem solid @sapUiFieldBorderColor;
+	&:focus:before {
+		top: -5px;
+		bottom: -5px;
+		left: -5px;
+		right: -5px;
+	}
 }
 
 /* hover */

package/src/sap/m/themes/sap_belize_hcb/SplitButton.less

@@ -31,11 +31,11 @@
 }
 
 .sapMSB .sapMSBText .sapMBtnInner.sapMBtnIconFirst {
-	padding-left: 0.625rem;
+	padding-left: 0.5rem;
 }
 
 .sapUiSizeCompact {
 	.sapMSB .sapMSBText .sapMBtnInner.sapMBtnIconFirst {
-		padding-left: 0.5rem;
+		padding-left: 0.425rem;
 	}
 }

package/src/sap/m/themes/sap_belize_hcb/Table.less

@@ -46,15 +46,31 @@
 	border-top: 0.125rem solid @sapUiListTableFooterBorder;
 }
 
-/* Moved due to new default vertical-align regardless of density */
+/* moved due to new default vertical-align regardless of density */
+.sapMListTblSelCol,
 .sapMListTblNavCol,
 .sapMListTblCell {
   vertical-align: top;
 }
 
+/* vertical alignment is middle for the compact */
 .sapUiSizeCompact{
-  .sapMListTblNavCol,
-  .sapMListTblCell {
-    vertical-align: middle;
-  }
+	.sapMListTblSelCol,
+	.sapMListTblNavCol,
+	.sapMListTblCell {
+		vertical-align: middle;
+	}
+}
+
+/* default padding of the data cells */
+.sapMListTblCell {
+	padding-top: .875rem;
+	padding-bottom: .875rem;
+}
+
+/* reduced padding for compact and vAlign=Middle */
+.sapUiSizeCompact .sapMListTblCell,
+.sapMListTblRowMiddle > .sapMListTblCell {
+	padding-top: .25rem;
+	padding-bottom: .25rem;
 }

package/src/sap/m/themes/sap_belize_hcb/Tokenizer.less

@@ -15,6 +15,7 @@ html.sap-desktop .sapMTokenizer:focus{
   &.sapMToken:hover,
   &.sapMToken:focus,
   &.sapMTokenSelected,
+  &.sapMToken.sapMTokenSelected:hover,
   &.sapMToken .sapMTokenIcon {
     background: @sapUiButtonBackground;
     cursor: default;

package/src/sap/m/themes/sap_belize_hcb/library.source.less

@@ -34,6 +34,7 @@
 @import "ImageContent.less";
 @import "Input.less";
 @import "InputBase.less";
+@import "MessageBox.less";
 
 /* note: the following three files are not in alphabetical order and should be imported after InputBase.less */
 @import "ComboBoxTextField.less";

package/src/sap/m/themes/sap_belize_hcw/Carousel.less

@@ -11,67 +11,5 @@
 @_sap_m_Carousel_BulletInactiveWidth: 0.5rem;
 @_sap_m_Carousel_BulletInactiveMargin: 0 0.25rem;
 
-/* Carousel controls: HUD */
-.sapMCrsl {
-    border: 0.125rem solid transparent;
-}
-
-.sapMCrsl:focus {
-    outline: none;
-    border: 0.125rem dotted @sapUiContentFocusColor;
-}
-
-.sapMCrsl .sapMCrslHud,
-.sapMCrsl .sapMCrslHud {
-	border: 3px solid @sapUiButtonBorderColor;
-}
-
-.sapMCrsl .sapMCrslHud a:hover,
-.sapMCrsl .sapMCrslHud a:focus {
-	background-color: @sapUiButtonActiveBackground;
-}
-
-/* extra bits */
-
-/* HCB Additional Styles */
-.sapMCrslHud .sapMCrslPrev,
-.sapMCrslHud .sapMCrslNext {
-	border: 2px solid @sapUiButtonBorderColor;
-}
-
-.sapMCrslControls .sapMCrslPrev,
-.sapMCrslControls .sapMCrslNext {
-	border: 2px solid @sapUiButtonBorderColor;
-}
-
-.sapMCrslPrev:focus,
-.sapMCrslNext:focus,
-.sapMCrslPrev .sapUiIcon:focus,
-.sapMCrslNext .sapUiIcon:focus {
-	outline: none;
-}
-
-html.sap-desktop .sapMCrslHud .sapMCrslPrev:focus,
-html.sap-desktop .sapMCrslHud .sapMCrslNext:focus {
-	&::before {
-		content: "";
-		position: absolute;
-		top: -0.25rem;
-		right: -0.25rem;
-		bottom: -0.25rem;
-		left: -0.25rem;
-		pointer-events: none;
-		border: 2px solid @sapUiContentContrastFocusColor;
-	}
-
-	&::after {
-		content: "";
-		position: absolute;
-		top: -0.25rem;
-		right: -0.25rem;
-		bottom: -0.25rem;
-		left: -0.25rem;
-		pointer-events: none;
-		border: 2px dotted @sapUiBaseBG;
-	}
-}
+@_sap_m_Carousel_FocusBorderOffsetArrow: -0.25rem;
+@_sap_m_Carousel_ContrastFocusBorder: @sapUiContentFocusWidth solid @sapUiBaseBG;

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

@@ -13,7 +13,7 @@
 
 /* Head Container */
 
-.sapMITH .sapMITBHead {
+.sapMITH:not(.sapMITBTextOnly) .sapMITBHead {
 	padding: 1.125rem 0 0 0.125rem;
 }
 

package/src/sap/m/themes/sap_belize_hcw/LightBox.less

@@ -6,7 +6,4 @@
 /* ==========================================================================
    Overlay
   ========================================================================== */
-.sapMLightBox + .sapUiBLy {
-	background: @sapUiBlockLayerBackground;
-	opacity: 0.3;
-}
+@_sap_m_LightBox_OverlayOpacity: 0.3;