@openui5/sap.m 1.100.0 → 1.102.1

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

@@ -177,6 +177,11 @@
 	align-items: center;
 	flex: 1 1 auto;
 
+	.sapMGTContentShimmerPlaceholderWithDescriptionTwoByHalfIconLoaded {
+		padding: 0rem;
+		flex: none;
+	}
+
 	&.sapMGTContentShimmerPlaceholderWithChart.sapMGTContentShimmerPlaceholderWithDescriptionTwoByHalf {
 		height: 6rem;
 	}
@@ -206,6 +211,11 @@
 	}
 }
 
+.sapMGTContentShimmerPlaceholderItemTwoByHalf.sapMGTContentShimmerPlaceholderWithDescriptionTwoByHalfIconLoaded {
+	padding: 0rem;
+	flex: none;
+}
+
 .sapMGTLoadingShimmer, .sapMTileCntLoadingShimmer{
 .sapMGTLoadingShimmerMixin();
 }
@@ -291,17 +301,82 @@ border-radius: 0.25rem;
 	height: 5.25rem;
 }
 
- .OneByOne.tileWithAppInfo {
+.sapMGT.sapMGTWidthForGridContainer.TwoByOne {
+	width: 23rem;
+}
+
+.sapMGT.sapMGTWidthForGridContainer.TwoByHalf {
+	width: 23rem;
+}
+
+.sapMTileSmallPhone.sapMGT.sapMGTWidthForGridContainer.TwoByOne{
+	width: 19.5rem;
+}
+
+.sapMTileSmallPhone.sapMGT.sapMGTWidthForGridContainer.TwoByHalf{
+	width: 19.5rem;
+}
+
+.tileWithAppInfo {
+	.sapMGTTInfoContainer {
+		display: flex;
+		align-items: flex-end;
+		justify-content: flex-end;
+	}
+	.sapMGTTInfo {
+		padding: 0.125rem 1rem 0.125rem 0.25rem;
+		text-transform: uppercase;
+		margin-bottom: 0.5rem;
+		border-radius: 0.125rem 0 0 0.125rem;
+		background-color: @sapInfobar_NonInteractive_Background;
+		width: fit-content;
+		.sapMText{
+			font-size: @sapMFontSmallSize ;
+			text-align: right !important;
+		}
+		.sapMGTSystemInfoText{
+			display: flex;
+			justify-content: flex-end;
+			.sapMText {
+				color: @sapUiTileTitleTextColor;
+				padding-left: 0.15rem;
+			}
+		}
+		.sapMGTMarginTop4px{
+			margin-top: 0.25rem;
+		}
+		.sapMGTAppAndSystemInfoDivider{
+			height: 0.25rem;
+		}
+		.sapMGTAppShortcutText {
+			display: flex;
+			justify-content: flex-end;
+			.sapMText {
+				color: @sapUiTileTextColor;
+			}
+		}
+	}
+}
+
+.OneByOne.tileWithAppInfo {
+	.sapMGTTInfo{
+		margin-bottom: 0.2rem;
+		max-width: 7rem;
+	}
 	.sapMGTContent.appInfoWithFooter {
-		height: 3.5rem;
 		.sapMTileCnt {
+			height: 3.5rem;
+			width: 100%;
 			.sapMTileCntContent {
-				height: 1.75rem;
 				.sapMNC {
 					height: 1.75rem;
 					.sapMNCLargeFontSize {
 						font-size: 1.75rem;
 						height: 1.75rem;
+							&::before {
+								padding-bottom: 0;
+								margin-top: 0.5rem;
+							}
 					}
 					.sapMNCIndScale {
 						padding: 0rem;
@@ -312,60 +387,183 @@ border-radius: 0.25rem;
 					height: 1.75rem;
 					.sapMImageContentImageIcon {
 						padding-bottom: 0rem;
+						height: inherit;
+						top: 0.1rem;
+					}
+					.sapMImg.sapMImageContentImageIcon{
+						top: 0.2rem;
 					}
 				}
 			}
 			.sapMTileCntFtrTxt {
-				position: static;
+				bottom: -0.15rem;
 			}
 		}
 	}
 	.sapMGTContent.appInfoWithoutFooter {
-		height: 3.5rem;
 		.sapMTileCnt {
 			height: 3.5rem;
+			width: 100%;
 			.sapMTileCntContent {
 				height: 3.25rem;
+				.sapMNC {
+					height: 3.25rem;
+				}
 				.sapMImageContent {
 					height: 3.25rem;
+					.sapMImageContentImageIcon.sapUiIcon {
+						font-size: 1.75rem;
+						padding-bottom: 0;
+						top: 0;
+					}
+					.sapMImg{
+						top: 0.3rem;
+					}
 				}
 			}
 		}
 	}
 	.sapMGTTInfoContainer {
-		height: 2rem;
-		margin-top: 0.25rem;
-		.sapMGTTInfo {
-			padding: 0.125rem 1rem 0.125rem 0.125rem;
-			text-transform: uppercase;
-			margin-bottom: 0.5rem;
-			border-radius: 0.25rem 0 0 0.25rem;
-			background-color: @sapTile_Active_Background;
-			width: fit-content;
-			float: right;
-			bottom: 0;
-			position: absolute;
-			right: 0;
-			.sapMText{
-				font-size: @sapMFontSmallSize ;
+		height: 2.75rem;
+	}
+	.appInfoWithoutTileCnt{
+		display: flex;
+		flex-direction: column-reverse;
+		.sapMGTTInfo{
+			margin-bottom: 0.3rem;
+		}
+	}
+}
+
+.OneByOne.sapMTileSmallPhone.tileWithAppInfo{
+	.sapMGTHdrContent.OneByOne{
+		height: 3rem;
+	}
+	.sapMGTContent{
+		.sapMGTTInfoContainer{
+			.sapMGTTInfo{
+				margin-bottom: 0.5rem;
+				padding-right: 0.5rem;
 			}
-			.sapMGTSystemInfoText{
-				display: flex;
-				justify-content: flex-end;
-				.sapMText {
-					color: @sapUiTileTitleTextColor;
+		}
+	}
+	.sapMGTContent.appInfoWithFooter {
+		.sapMTileCnt {
+			height: 3rem;
+			.sapMTileCntContent{
+				.sapMImageContent{
+					.sapMImageContentImageIcon{
+						top: -0.1rem;
+					}
 				}
 			}
-			.sapMGTAppShortcutText {
-				display: flex;
-				justify-content: flex-end;
-				.sapMText {
-					color: @sapUiTileTextColor;
+		}
+		.sapMNCValue{
+			margin-bottom: 0.3rem;
+			.sapMNCLargeFontSize{
+				padding: 0;
+			}
+			.sapMNCLargeFontSize.sapMNCIconImage{
+				padding-right: 0.375rem;
+			}
+		}
+	}
+	.sapMGTContent.appInfoWithoutFooter {
+		.sapMTileCnt {
+			height: 3rem;
+		}
+		.sapUiIcon{
+			top: 0;
+		}
+		.sapMNCInner.WithoutMargin{
+			top: 0;
+		}
+	}
+	.appInfoWithoutTileCnt{
+		.sapMGTTInfoContainer{
+			.sapMGTTInfo{
+				margin-bottom: 0.3rem;
+			}
+		}
+	}
+	.sapUiIcon.sapUiIconMirrorInRTL.sapMImageContentImageIcon{
+		margin-bottom: 0.25rem;
+	}
+}
+
+.TwoByHalf.tileWithAppInfo {
+	.sapMGTWrapper {
+		height: inherit;
+		display: flex;
+		justify-content: space-between;
+		gap: 0.25rem;
+		.sapMGTWrapperCnt {
+			.sapMGTHdrContent {
+				max-width: 13.5rem;
+				padding-right: 0;
+			}
+			.sapMGTContent {
+				.sapMTileCnt {
+					.sapMTileCntContent {
+						padding-right: 0;
+					}
 				}
 			}
 		}
 	}
+	.sapMGTTInfoContainer {
+		max-width: 13.5rem;
+		.sapMGTTInfo{
+			.sapMGTAppShortcutText{
+				.sapMText{
+					max-width: 13ch;
+				}
+			}
+			.sapMGTSystemInfoText{
+				.sapMText{
+					max-width: 13ch;
+					padding-left: 0.2rem;
+				}
+			}
+		}
+	}
+}
+.TwoByOne.tileWithAppInfo {
+	.sapMGTContent{
+		.sapMGTTInfoContainer{
+			.sapMGTTInfo{
+				max-width: 10.875rem;
+			}
+		}
+	}
+	.sapMGTContent {
+		display: flex;
+		justify-content: space-between;
+		margin-top: 0.5rem;
+		.sapMTileCnt {
+			.sapMTileCntContent {
+				padding-right: 0;
+			}
+			.sapMTileCntFtrTxt {
+				margin-right: 0;
+			}
+		}
+	}
+	.appInfoWithoutTileCnt{
+		flex-direction: row-reverse;
+	}
+	.sapMGTTInfoContainer {
+		max-width: 13.5rem;
+		margin-left: 0.25rem;
+		margin-bottom: 0.5rem;
+		.sapMGTTInfo{
+			.sapMGTAppShortcutText{
+				text-align: right;
+			}
+		}
+	}
 }
+
 .OneByHalf {
 	.sapMGTHdrContent {
 		height: 1.25rem;
@@ -508,6 +706,11 @@ border-radius: 0.25rem;
 	padding-left: 1rem;
 	padding-right: 1rem;
 }
+.OneByOne.tileWithAppInfo{
+	.sapMGTHdrContent.OneByOne {
+		height: 3.4rem;
+	}
+}
 .sapMGTHdrContent.Stretch{
 	height: 42%;
 	padding-top: 0rem;
@@ -586,6 +789,15 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 			outline: none;
 		}
 	}
+	.sapMGTMoreIcon{
+		background-color: transparent;
+		border: 0;
+		.sapMBtnIcon{
+			bottom: 1rem;
+			left: 0.4rem;
+			border: 0;
+		}
+	}
 
 	.sapMGTRemoveButton {
 		width: 1.375rem;
@@ -623,8 +835,8 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 
 			&:before {
 				position: relative;
-				top: -0.125rem;
-				left: -0.0625rem;
+				top: -0.15rem;
+				left: 0;
 			}
 		}
 
@@ -646,6 +858,92 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 	}
 }
 
+.sapUiSizeCompact{
+	.sapMGT.sapMGTScopeActions, .sapMGT.sapMGTScopeSingleAction {
+		.sapMGTMoreIcon{
+			.sapMBtnIcon{
+				left: -0.3rem;
+				bottom: 0.5rem
+			}
+		}
+	}
+}
+.sapMGT.sapMGTScopeActions.sapMGTIconMode{
+	.sapMBtn.sapMGTMoreIcon{
+		&:before{
+			content: "";
+			position: absolute;
+			top: -0.25rem;
+			bottom: -2.5rem;
+			left: -0.0125rem;
+			right: -0.0125rem;
+		}
+		padding: 0;
+		height: 0;
+		bottom: auto;
+		right: 0.5rem;
+		.sapMBtnIcon{
+			bottom: 0;
+			left: 0;
+			padding-left: 0.625rem;
+			padding-right: 0.625rem;
+			width: 1rem;
+		}
+	}
+}
+
+.sapUiSizeCompact{
+	.sapMGT.sapMGTScopeActions.sapMGTIconMode.TwoByHalf.sapMTileSmallPhone{
+		.sapMBtn.sapMGTMoreIcon{
+			&:before{
+				content: "";
+				position: absolute;
+				top: -0.1975rem;
+				bottom: -1.8875rem;
+				left: -0.0125rem;
+				right: -0.0125rem
+			}
+			top: 1.4rem;
+			.sapMBtnInner{
+				padding: 0;
+				min-width: 0;
+			}
+		}
+	}
+}
+
+.sapUiSizeCompact{
+	.sapMGT.sapMGTScopeActions.sapMGTIconMode.TwoByHalf{
+		.sapMBtn.sapMGTMoreIcon{
+			top: 0.9rem;
+			.sapMBtnIcon{
+				padding-left: 0.5rem;
+				padding-right: 0.5rem;
+			}
+		}
+	}
+}
+
+.sapMGT.sapMGTScopeActions.sapMGTIconMode.TwoByHalf {
+	.sapMBtn.sapMGTMoreIcon{
+		top: 0.6rem;
+		.sapMBtnInner{
+			left: 0.2rem;
+			padding: 0;
+		}
+	}
+}
+
+.sapMGT.sapMGTScopeActions.sapMGTIconMode.TwoByHalf.sapMTileSmallPhone {
+	.sapMBtn.sapMGTMoreIcon{
+		top: 1.1rem;
+		.sapMBtnInner{
+			left: 0rem;
+		}
+	}
+}
+
+
 .sapMGT.sapMGTScopeActions.sapMGTBackgroundImage, .sapMGT.sapMGTScopeSingleActions.sapMGTBackgroundImage {
 
 	.sapMTileCntContent {
@@ -693,7 +991,6 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 		border-radius: 0.25rem;
 		transition: background-color 0.2s;
 		pointer-events: none;
-		margin: 0.25rem 0.5rem 0.25rem 0; 
 	}
 
 	.sapMGTLineMode .sapMGTTouchArea {
@@ -707,7 +1004,7 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 
 		width: 100%;
 		pointer-events: auto;
-		padding: 0.5625rem 0.5rem;
+		padding: 0;
 		margin: -0.1875rem 0;
 		box-sizing: border-box;
 	}
@@ -820,12 +1117,50 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 			height: 1.5rem;
 			padding: 0.75rem 0.3125rem;
 			margin-top: -0.75rem;
-			margin-left: -0.75rem;
-			left: 0;
+			left: -0.3rem;
 			display: inline-block;
 		}
 	}
 }
+
+.sapMGTLineMode.sapMGTScopeSingleAction {
+	.sapMGTMoreIcon.sapMBtnBase{
+		.sapMBtnIcon{
+			left: 0rem;
+			bottom: 0.6rem;
+		}
+	}
+}
+.sapUiSizeCompact {
+	.sapMGTLineMode.sapMGTScopeSingleAction {
+		.sapMGTMoreIcon.sapMBtnBase{
+			.sapMBtnIcon{
+				left: 0.5rem;
+				bottom: 0.3rem;
+			}
+		}
+	}
+}
+
+.sapMGTLineMode.sapMGTScopeActions {
+	.sapMGTMoreIcon.sapMBtnBase{
+		.sapMBtnIcon{
+			bottom: 0.6rem;
+			left: -1rem;
+		}
+	}
+}
+
+.sapUiSizeCompact {
+	.sapMGTLineMode.sapMGTScopeActions {
+		.sapMGTMoreIcon.sapMBtnBase{
+			.sapMBtnIcon{
+				bottom: 0.3rem;
+				left: -0.5rem;
+			}
+		}
+	}
+}
 .sapUiSizeCompact {
 	.sapMGTLineMode .sapMGTActionsContainer {
 		.sapMGTRemoveButton .sapMBtnIcon::before {
@@ -845,7 +1180,7 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 			min-height: 1.625rem;
 		}
 		.sapMGTLineMode .sapMGTTouchArea {
-			padding: 0.125rem 0.5rem;
+			padding: 0.125rem 0rem;
 			margin: -0.1875rem 0;
 		}
 		.sapMGTLineMode .sapMGTLineModeFailedIcon {
@@ -880,7 +1215,6 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 	.sapMGT.sapMGTLineMode {
 		float: none;
 		clear: none;
-		margin-bottom: 0px;
 		display: inline-block;
 		min-width: 2rem;
 		background-color: @sapUiTileBackground;
@@ -888,11 +1222,10 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 		border-radius: 0.25rem;
 		box-shadow: @sapUiShadowLevel0;
 		position: relative;
-		padding: 0.5rem;
+		padding: 0.5rem 0.5rem 0.5rem 0;
 		@line-height: 2.75rem;
 		@padding-top: 0.125rem;
 		@padding-bottom: 0.125rem;
-		margin: 0.25rem 0.5rem 0.25rem 0; 
 		min-height: 2rem; /* used as hover-style bar height */
 		pointer-events: none;
 	}
@@ -916,8 +1249,6 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 	}
 
 	.sapMGTLineMode .sapMGTSubHdrTxt {
-		margin-right: 0.5rem;
-
 		&:before { //this is needed to enable line-wrapping between header end and subheader beginning
 			content: "";
 			display: inline-block;
@@ -943,7 +1274,7 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 		padding-right: 0.5rem;
 		margin-right: 0.5rem;
 	}
-	
+
 	.sapMGTLineMode.sapMGTScopeSingleAction {
 		.sapMGTHdrTxt:last-of-type, .sapMGTSubHdrTxt {
 			padding-right: 1rem;
@@ -952,7 +1283,7 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 
 	.sapMGTLineMode.sapMGTScopeActions {
 		.sapMGTHdrTxt:last-of-type, .sapMGTSubHdrTxt {
-			padding-right: 3rem;
+			padding-right: 3.5rem;
 		}
 	}
 
@@ -1009,7 +1340,7 @@ html.sap-desktop .sapMGT:focus:not([tabindex]) {
 			@padding-top: 0.125rem;
 			@padding-bottom: 0.125rem;
 			min-height: 2rem;
-			padding: 0.5rem;
+			padding: 0.5rem 0.5rem 0.5rem 0;
 		}
 		.sapMGTLineMode .sapMGTLineModeFailedIcon {
 			display: inline-block;
@@ -1110,7 +1441,7 @@ html[data-sap-ui-browser*='ff'] {
 	}
 }
 
-.sapMTileSmallPhone {
+.sapMTileSmallPhone,.sapMTResponsiveIconMode {
 
 	&.sapMGT.sapMGTHeaderMode .sapMGTHdrTxt:nth-last-of-type(2) {
 		max-height: 4.72rem;
@@ -1272,31 +1603,47 @@ html[data-sap-ui-browser*='ff'] {
 }
 
 .TwoByOne.sapMGTActionMode {
-	height: 11.375rem;
+	height: 10.5rem;
 	width: 20rem;
 	overflow: hidden;
+	box-shadow: @sapContent_Shadow0;
 	.sapMGTTitle {
 		font-weight: bold;
 	}
+	.sapMGTHdrContent.sapMGTHdrImage{
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		gap: 0.75rem;
+		height: 2rem;
+		.sapMGTHdrIconImage{
+			display: flex;
+			align-items: center;
+		}
+		.sapMGTHdrTxt{
+			width: 14.25rem;
+		}
+	}
 	.sapMGTHdrContent {
 		padding: 0;
-		margin: 1rem 1rem 1rem 1rem;
-		height: 3rem;
+		margin: 1rem 1rem 0.75rem 1rem;
+		height: fit-content;
 		overflow: hidden;
 		.sapMText {
-			font-size: 1rem;
-			line-height: 1.5rem;
+			line-height: 1rem;
+			font-size: 0.875rem;
 		}
 		.sapMGTSubHdrTxt .sapMText {
 			font-size: 0.875rem;
 		}
 		.sapMGTHdrIconImage {
 			float: left;
-			margin-right: 1rem;
 			width: 3rem;
 		}
 		.sapMGTHdrIconImage.sapUiIcon {
 			width: 2rem;
+			line-height: 1.5rem;
+			min-height: 2.1875rem;
 		}
 		.sapMGTHdrIconImage.sapUiIcon::before {
 			font-size: 2rem;
@@ -1308,7 +1655,7 @@ html[data-sap-ui-browser*='ff'] {
 			color: @sapUiPositiveText;
 		}
 		.sapMGTHdrIconImage.Critical {
-			color: @sapUiCriticalText;
+			color: @sapUiCriticalElement;
 		}
 		.sapMGTHdrIconImage.Error {
 			color: @sapUiNegativeText;
@@ -1317,15 +1664,20 @@ html[data-sap-ui-browser*='ff'] {
 			color: @sapUiTileIconColor
 		}
 	}
+	.sapMGTContent.sapMGTFtrMarginTop{
+		height: 7.6rem;
+		.sapMTileCnt{
+			height: 7.6rem;
+		}
+	}
 	.sapMGTContent {
-		height: 6.5rem;
+		height: 6.6rem;
 		.sapMTileCnt {
-			height: 6.5rem;
+			height: 6.6rem;
 			.sapMTileContainer {
-				height: 3rem;
-				margin-bottom: 0.625rem;
-				overflow: hidden;
 				display: flex;
+				height: 1.625rem;
+				align-items: center;
 				.sapMTilePriority {
 					margin: 0 0.5rem 0 1rem;
 					.sapMTilePriorityCnt {
@@ -1333,17 +1685,19 @@ html[data-sap-ui-browser*='ff'] {
 						align-items: center;
 						height: 1.5rem;
 						width: fit-content;
-						border-radius: 0.25rem;
+						border-radius: 0.5625rem;
 						overflow: hidden;
+						box-shadow: @sapContent_Shadow0;
 						.sapMTilePriorityBorder {
-							width: 0.125rem;
-							height: inherit;
+							width: 0.375rem;
+							height: 1.625rem;
 						}
 						.sapMTilePriorityValue {
-							font-size: 0.75rem;
-							font-weight: bold;
+							font-size: 0.875rem;
+							font-weight: 400;
 							line-height: 1rem;
-							padding: 0.25rem 0.5rem 0.25rem 0.625rem;
+							padding: 0.3125rem 0.375rem 0.25rem 0.375rem;
+							color: @sapList_TextColor;
 						}
 					}
 				}
@@ -1351,10 +1705,7 @@ html[data-sap-ui-browser*='ff'] {
 					.sapMTilePriorityCnt {
 						background-color: @sapErrorBackground;
 						.sapMTilePriorityBorder {
-							background-color: @sapErrorBorderColor;
-						}
-						.sapMTilePriorityValue {
-							color: @sapNegativeTextColor;
+							background-color: @sapNegativeElementColor;
 						}
 					}
 				}
@@ -1362,10 +1713,7 @@ html[data-sap-ui-browser*='ff'] {
 					.sapMTilePriorityCnt {
 						background-color: @sapWarningBackground;
 						.sapMTilePriorityBorder {
-							background-color: @sapWarningBorderColor;
-						}
-						.sapMTilePriorityValue {
-							color: @sapCriticalTextColor;
+							background-color: @sapWarningColor;
 						}
 					}
 				}
@@ -1373,10 +1721,15 @@ html[data-sap-ui-browser*='ff'] {
 					.sapMTilePriorityCnt {
 						background-color: @sapSuccessBackground;
 						.sapMTilePriorityBorder {
-							background-color: @sapSuccessBorderColor;
+							background-color: @sapPositiveElementColor;
 						}
-						.sapMTilePriorityValue {
-							color: @sapPositiveTextColor;
+					}
+				}
+				.VeryHigh {
+					.sapMTilePriorityCnt {
+						background-color: @sapAvatar_2_Background;
+						.sapMTilePriorityBorder {
+							background-color: @sapIndicationColor_1_BorderColor;
 						}
 					}
 				}
@@ -1394,12 +1747,24 @@ html[data-sap-ui-browser*='ff'] {
 				}
 			}
 			.sapMTileCntContent {
+				&:first-child {
+					color: @sapTile_TextColor;
+				}
 				height: 3rem;
 				overflow: hidden;
 				padding: 0 1rem;
-				margin: 0 0 0.625rem 0;
+				margin: 0.375rem 0 0.75rem 0;
+				p{
+					margin: 0;
+					line-height: 1rem;
+					color:@sapTile_TextColor;
+					white-space: nowrap;
+					overflow: hidden;
+					text-overflow: ellipsis;
+				}
 				.sapMText {
-					line-height: 1.5rem;
+					line-height: 1rem;
+					color: @sapTile_TextColor;
 				}
 				.sapMImageContent {
 					height: 3rem;
@@ -1409,7 +1774,7 @@ html[data-sap-ui-browser*='ff'] {
 				}
 			}
 			.sapMTileFtrCnt {
-				height: 2rem;
+				height: 1rem;
 				display: flex;
 				position: absolute;
 				left: 0;
@@ -1422,18 +1787,29 @@ html[data-sap-ui-browser*='ff'] {
 					position: initial;
 					margin-right: 0;
 					margin-left: 1rem;
-					font-size: 0.75rem;
+					font-size: 0.875rem;
+					margin-top: 1rem;
 				}
 				.sapMGTActionModeContainer {
-					margin: 0 1rem 0 0.5rem;
+					margin: 0 1rem 1rem 0.5rem;
 					display: inline-flex;
 					column-gap: 0.5rem;
 				}
 			}
 			.sapMTileCntFtrTxt {
-				margin: 0 1rem;
-				font-size: 0.75rem;
-				bottom: 1.5rem;
+				margin: 0 1rem 1rem 1rem;
+				font-size: 0.875rem;
+				bottom: 0;
+			}
+		}
+		.sapMTileCnt.sapMGTNoPriority{
+			.sapMTileCntContent{
+				margin: 0;
+			}
+		}
+		.sapMTileCnt.sapMGTPriority{
+			.sapMTileCntContent{
+				height: 2rem;
 			}
 		}
 	}
@@ -1442,6 +1818,18 @@ html[data-sap-ui-browser*='ff'] {
 .TwoByOne.sapMTileSmallPhone.sapMGTActionMode {
 	height: 11.375rem;
 	width: 19rem;
+	.sapMGTContent {
+		height: 7.6rem;
+		.sapMTileCnt {
+			height: 7.6rem;
+		}
+	}
+	.sapMGTContent.sapMGTFtrMarginTop{
+		height: 8.6rem;
+		.sapMTileCnt{
+			height: 8.6rem;
+		}
+	}
 }
 
 .sapMAutoPointer {
@@ -1449,49 +1837,11 @@ html[data-sap-ui-browser*='ff'] {
 		cursor: auto;
 	}
 }
-
-.TwoByHalf.sapMGTIconMode.sapMTileSmallPhone.sapMGT .sapMGTHdrContent {
-    height: auto;
-    max-height: 2rem;
-    padding-top: 0;
-}
-
-.sapMGTIconMode.sapMTileSmallPhone.sapMGT.sapMGTOneByOne {
-	width: 9rem;
-	height: 4rem;
-	display: flex;
-	gap: 0.75rem;
-	align-items: center;
-}
-.sapMGTIconMode.sapMTileSmallPhone.sapMGT.sapMGTOneByOne .sapMGTOneByOneIcon{
-	padding: 0;
-	margin-left: 1rem;
-}
-.sapMGTIconMode.sapMTileSmallPhone.sapMGT.sapMGTOneByOne .sapMGTHdrContent {
-	height:auto;
-	width: 5rem;
-	padding: 1rem 0.5rem 1rem 0;
-}
-.sapMGTIconMode.sapMTileSmallPhone.sapMGT.sapMGTOneByOne .sapMGTHdrContent .sapMText {
-	text-align: left !important;
-}
-.sapMGTIconMode .sapMGTSubHdrTxt{
-	line-height: 1rem;
-	.sapMText{
-		font-size: 0.875rem;
-		color: @sapUiContentLabelColor;
-	}
-}
-
-.TwoByHalf.sapMGTIconMode .sapMGTMoreIcon {
-	visibility: hidden;
-    bottom: auto;
-	right: 1.5rem;
-}
-
-.TwoByHalf.sapMGTIconMode.sapMGT:hover {
-	.sapMGTMoreIcon {
-		visibility: visible;
+.sapMGT.sapMGTOneByOne,.sapMGT.sapMGTOneByOne.sapMTileSmallPhone{
+	.sapMBtnBase.sapMGTMoreIcon{
+		.sapMBtnIcon{
+			bottom: 0.3rem;
+		}
 	}
 }
 
@@ -1499,16 +1849,26 @@ html[data-sap-ui-browser*='ff'] {
     .sapMGT.sapMGTOneByOne {
         width: 9rem;
         height: 9rem;
+		.sapMBtnBase.sapMGTMoreIcon{
+			.sapMBtnIcon{
+				bottom: 0.7rem;
+			}
+		}
     }
 }
 @media (min-width:600px) {
     .sapMGT.sapMGTOneByOne {
         width: 7rem;
         height: 7rem;
+		.sapMBtnBase.sapMGTMoreIcon{
+			.sapMBtnIcon{
+				bottom: 0.3rem;
+			}
+		}
     }
 }
 .sapMGT.sapMGTOneByOne {
-    border-radius: 1rem;
+    border-radius: @sapTile_BorderCornerRadius;
     border: none;
 }
 
@@ -1527,58 +1887,6 @@ html[data-sap-ui-browser*='ff'] {
     text-align: center !important;
 }
 
-.sapMGTOneByOneIcon {
-	display: flex;
-    align-items: flex-end;
-    padding-top: 1.25rem;
-	justify-content: center;
-}
-
-.sapMGT.sapMGTTwoByHalf {
-	display: flex;
-    border: none ;
-    box-shadow: none ;
-    background-color: transparent ;
-    align-items: center;
-	width: 18.75rem ;
-    height: 3.438rem ;
-    padding-left: 0.75rem;
-	border-radius: 0.75rem;
-    box-sizing: border-box;
-}
-
-.sapMGTTwoByHalf  > .TwoByHalf > .sapMGTHdrTxt > .sapMText{
-	font-size: 0.875rem;
-	color: @sapUiTileTitleTextColor;
-}
-
-.sapMGTTwoByHalfIcon {
-	width: 2rem;
-    height: 2rem;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    border-radius: 0.5rem;
-    flex-shrink: 0;
-}
-
-.sapMGT.TwoByHalf .sapMGTHdrContent {
-    line-height: 2rem;
-    vertical-align: middle;
-}
-
-.sapMGTTwoByHalfIcon ~ .sapMGTHdrContent.TwoByHalf{
-	padding-top: 0.25rem;
-    padding-left: 1rem;
-    height: initial;
-	max-width: 12.5rem;
-	align-items: center;
-}
-
-.sapMGTTileIcon {
-	color: @sapUiContentContrastTextColor;
-}
-
 .sapMGTArticleMode {
 	.sapMGTContent {
 		.sapMTileCnt {
@@ -1621,4 +1929,275 @@ html[data-sap-ui-browser*='ff'] {
 			}
 		}
 	}
+}
+.sapMGT.sapMGTScopeDisplay.sapMGTLineMode.sapMGTInfoRendered{
+	padding: 0;
+	.sapMGTStartMarker{
+		display: inline;
+	}
+	.sapMGTEndMarker{
+		display: inline;
+	}
+	.sapMGTLineWrapper{
+		display: flex;
+		flex-wrap: wrap;
+	}
+	.sapMGTHeaderWrapper{
+		display: inline-block;
+		padding: 0.5rem 0.5rem 0.25rem 0;
+		margin-bottom: 0.25rem;
+		.sapMGTSubHdrTxt{
+			margin-right: 0;
+		}
+	}
+	.sapMGTTInfo{
+		display: inline-block;
+		margin: 0;
+		flex-grow: 1;
+		padding-left: 0.5rem;
+		.sapMGTAppShortcutText{
+			padding-left: 0;
+		}
+	}
+}
+.sapMGT.sapMGTScopeDisplay.sapMGTLineMode.sapMGTInfoRendered.sapMGTLineModeSmall{
+	display: flex;
+	flex-wrap: wrap;
+	max-width: 94%;
+	.sapMGTHeaderWrapper{
+		padding-left:0.5rem;
+		display: flex;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		flex-wrap: wrap;
+		margin-bottom: 0;
+	}
+	.sapMGTTouchArea{
+		padding: 0;
+		margin: 0;
+	}
+	.sapMGTTInfo{
+		.sapMGTAppShortcutText{
+			padding-left: 0;
+		}
+	}
+}
+.sapMGT.sapMGTScopeDisplay.sapMGTLineMode.sapMGTInfoRendered{
+.sapMGTTInfoWrapper{
+	padding: 0.5rem;
+	flex-grow: 1;
+	background-color: @sapInfobar_NonInteractive_Background;
+	border-radius: 0 0.25rem 0.25rem 0;
+	.sapMGTTInfo{
+		margin: 0;
+		vertical-align: top;
+		text-transform: uppercase;
+		flex-grow: 1;
+		display: flex;
+		overflow: hidden;
+		align-items: baseline;
+		flex-wrap: wrap;
+		padding: 0;
+		.sapMGTHdrTxt{
+			padding-top: 0.3rem;
+		}
+		.sapMGTSubHdrTxt{
+			margin-right: 0.25rem;
+		}
+		.sapMText{
+			font-size: @sapMFontSmallSize ;
+		}
+			.sapMGTAppShortcutText{
+				padding-right: 0.5rem;
+				padding-left: 0;
+				.sapMText{
+					color: @sapUiTileTextColor;
+				}
+			}
+			.sapMGTSystemInfoText{
+				font-size: 0.75rem;
+				position: relative;
+				display: inline-block;
+				word-break: break-word;
+				.sapMText{
+					color: @sapUiTileTitleTextColor;
+				}
+			}
+			.sapMGTSystemInfoText.sapMGTSeperatorPresent{
+				font-size: 0.75rem;
+				position: relative;
+				display: inline-block;
+				&::before{
+					content: "";
+					position: absolute;
+					display: inline-block;
+					height: 1rem;
+					width: 0.00623rem;
+					left: 0;
+					transform: translateX(-0.25rem);
+					top: -0.125rem;
+					background-color: @sapUiTileTextColor;
+
+				}
+			}
+	}
+}
+.sapMGTTInfo.sapMGTInfoNotContainsSeperator{
+	.sapMGTAppShortcutText{
+		padding-right: 0;
+	}
+}
+}
+
+/*-----------------------------------------------------
+					IconMode Styles
+------------------------------------------------------*/
+.sapMGTIconMode {
+	.sapMGTHdrTxt > .sapMText {
+		font-weight: bold;
+		font-size: @sapFontHeader6Size;
+	}
+	.sapMGTSubHdrTxt {
+		line-height: 1rem;
+		.sapMText {
+			font-size: 0.875rem;
+			color: @sapUiContentLabelColor;
+		}
+	}
+}
+
+.sapMGTOneByOne.sapMGTIconMode {
+	min-width: 7rem;
+	max-width: 15rem;
+	.sapMGTHdrContent {
+		padding: 0 0.5rem;
+	}
+	.sapMGTHdrTxt > .sapMText {
+		text-shadow: @sapUiContentContrastTextShadow;
+	}
+	.sapMGTOneByOneIconLoaded {
+		margin-top: -1rem;
+	}
+}
+
+.sapMGTOneByOne.sapMGTIconMode.sapMTResponsiveIconMode {
+	.sapMGTHdrContent {
+		height:auto;
+		padding: 1rem 0.5rem 1rem 0;
+	}
+}
+
+.sapMGT.sapMGTTwoByHalf {
+	display: flex;
+	border: none ;
+	box-shadow: none ;
+	background-color: transparent ;
+	align-items: center;
+	width: 18.75rem ;
+	height: 3.438rem ;
+	padding-left: 0.75rem;
+	border-radius: @sapTile_BorderCornerRadius;
+	box-sizing: border-box;
+}
+
+.sapMGTTwoByHalf  > .TwoByHalf > .sapMGTHdrTxt > .sapMText{
+	font-size: 0.875rem;
+	color: @sapUiTileTitleTextColor;
+}
+
+.TwoByHalf.sapMGT .sapMGTHdrContent {
+	line-height: 2rem;
+	vertical-align: middle;
+}
+
+.TwoByHalf.sapMGTIconMode {
+	.sapMGTHdrContent {
+		height: auto;
+		padding-top: 0;
+		padding-left: 1rem;
+		max-width: 16rem;
+		max-height: 2rem;
+		align-items: center;
+	}
+	.sapMGTMoreIcon {
+		visibility: hidden;
+		bottom: auto;
+		right: 1.5rem;
+	}
+}
+
+.TwoByHalf.sapMGTIconMode.sapMGT:hover {
+	.sapMGTMoreIcon {
+		visibility: visible;
+	}
+}
+
+.sapMGTOneByOneIcon {
+	display: flex;
+	align-items: flex-end;
+	padding-top: 1rem;
+	justify-content: center;
+}
+
+.sapMGTTwoByHalfIcon {
+	width: 2rem;
+	height: 2rem;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	border-radius: 0.5rem;
+	flex-shrink: 0;
+}
+
+.sapMGTTileIcon {
+	color: @sapUiContentContrastTextColor;
+}
+
+// Mobile View-specific styles
+
+.sapMGTOneByOne.sapMGTIconMode.sapMTileSmallPhone {
+	height: 4rem;
+	max-width: none;
+	.sapMGTHdrContent {
+		height:auto;
+		overflow: auto;
+		justify-content: start;
+		padding: 1rem 0.5rem 1rem 0;
+	}
+}
+
+.sapMGTOneByOne.sapMGTIconMode.sapMTileSmallPhone,
+.sapMGTOneByOne.sapMGTIconMode.sapMTResponsiveIconMode {
+	width: 9rem;
+	display: flex;
+	align-items: center;
+	.sapMGTOneByOneIcon{
+		padding: 0;
+		margin: 0 0.75rem 0 1rem;
+	}
+	.sapMGTHdrContent .sapMText {
+		text-align: left !important;
+	}
+}
+
+.TwoByHalf.sapMGTIconMode.sapMTileSmallPhone {
+	.sapMGTHdrContent {
+		height: auto;
+		max-width: 12.5rem;
+	}
+}
+
+// High Contrast Theme specific styles
+
+.sapMGT.sapMGTIconMode.HighContrastTile, .sapMGT.sapMGTIconMode .HighContrastTile.sapMGTTwoByHalfIcon {
+	background-color: @sapUiTileBackground;
+	border: 0.125rem solid;
+}
+
+.sapMGT.sapMGTTwoByHalf.sapMGTIconMode.HighContrastTile {
+	border: none;
+}
+
+html.sap-desktop .sapMGT.sapMGTTwoByHalf.sapMGTIconMode.HighContrastTile:not(.sapMGTStateDisabled):hover {
+	box-shadow: 0 0 0 0.188rem @sapUiContentShadowColor inset;
 }