@openui5/themelib_sap_horizon 1.99.0 → 1.100.0

package/src/sap/m/themes/sap_horizon_hcb/Link.less

@@ -0,0 +1,44 @@
+/* ================================== */
+/* CSS for control sap.m/Link         */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
+
+@_sap_m_Link_TextShadowColor: none;
+@sapUiLinkSubtleColor: darken(@sapUiLink, 15);
+
+.sapMLnk {
+	text-decoration: underline;
+}
+
+.sapMLnkDsbl {
+	opacity: @sapUiContentDisabledOpacity;
+	outline: none;
+	cursor: default;
+}
+
+.sapMLnk.sapMLnkSubtle {
+	color: @sapLinkColor;
+}
+
+.sapMLnkSubtle:focus {
+	color: @sapUiContentFocusColor;
+}
+
+html.sap-desktop .sapMLnk:focus:not(.sapMLnkDsbl) {
+	text-decoration: none;
+	outline: 0.125rem dotted @sapUiContentFocusColor;
+}
+
+html.sap-desktop .sapMLnk:hover:not(.sapMLnkDsbl) {
+	text-decoration: none;
+}
+
+.sapMLnk:hover.sapMLnkDsbl, .sapMLnk:focus.sapMLnkDsbl {
+	outline: none;
+}
+
+/* align Link in Form with Label */
+.sapUiFormEdit .sapMLnk {
+	margin-top: 0.875rem; /* don't use padding as this would stretch the focus outline */
+	margin-bottom: 0.625rem; /* for some reason browser adds 4px, display: block would lead to stretched focus outline*/
+}

package/src/sap/m/themes/sap_horizon_hcb/ListBase.less

@@ -0,0 +1,40 @@
+/* ================================== */
+/* CSS for control sap.m/ListBase     */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
+
+.sapMListHdrText {
+	border-bottom: 0.188rem solid @sapUiGroupTitleBorderColor;
+}
+
+/*Growing feature*/
+
+/*HCB additional styles for Growing feature*/
+.sapMLIBContent > .sapMGrowingListTrigger {
+	box-sizing: border-box;
+	border-radius: 0.375rem;
+	background: @sapUiButtonBackground;
+	border: @sapUiListBorderWidth solid @sapUiButtonBorderColor;
+}
+
+html.sap-desktop .sapMLIBContent > .sapMGrowingListTrigger:hover {
+	background: @sapUiButtonHoverBackground;
+}
+
+html.sap-desktop .sapMGrowingList > .sapMCLI:hover {
+	background: @sapUiListBackground !important;
+}
+
+//Needed to fix the margin collapsing behaviour on safari
+html.sap-desktop .sapMGrowingList > .sapMCLI {
+	padding: 0.25rem;
+}
+
+html.sap-desktop .sapMGrowingList  .sapMCLI.sapMLIB.sapMLIB-CTX:focus{
+	outline:none;
+}
+
+html.sap-desktop .sapMLIB-CTX:focus .sapMGrowingListTrigger {
+	border: 0.125rem dotted @sapUiContentFocusColor;
+	border-radius: 0;
+}

package/src/sap/m/themes/sap_horizon_hcb/ListItemBase.less

@@ -0,0 +1,20 @@
+/* =================================== */
+/* CSS for control sap.m/ListItemBase  */
+/* Horizon High Contrast Black theme   */
+/* =================================== */
+
+@_sap_m_ListItemBase_Highlight_InformationColor: @sapUiAccent6;
+@_sap_m_ListItemBase_Navigated: @sapUiListSelectionBorderColor;
+@_sap_m_ListItemBase_Detail_Delete_MarginLeft: 0.25rem;
+
+.sapMLIB.sapMLIBSelected {
+	border-bottom: 0.0625rem solid @sapUiListSelectionBorderColor;
+}
+
+.sapMLIBFocusable:focus {
+	outline-width: 0.125rem;
+}
+
+.sapMTableRowCustomFocus:focus > :not(.sapMListTblDummyCell:last-child)::before {
+	border-width: 2px;
+}

package/src/sap/m/themes/sap_horizon_hcb/Menu.less

@@ -0,0 +1,10 @@
+/* ================================== */
+/* CSS for control sap.m/Menu         */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
+
+html.sap-phone .sapMRespMenuDialog .sapMPage {
+  .sapMBar-CTX.sapMHeader-CTX,.sapMBarPH {
+	.sapMBarShadow(@sapUiPageHeaderBorderColor);
+  }
+}

package/src/sap/m/themes/sap_horizon_hcb/MenuButton.less

@@ -0,0 +1,41 @@
+/* ================================== */
+/* CSS for control sap.m/MenuButton   */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
+
+/* Compact size */
+.sapUiSizeCompact {
+	.sapMMenuBtn {
+		.sapMBtnInner.sapMBtnText .sapMBtnIcon {
+			margin-left: 0;
+			margin-right: 0;
+		}
+	}
+	.sapMMenuBtn .sapMBtnIcon {
+		margin-left: 0.4375rem;
+		margin-right: 0.4375rem;
+	}
+}
+
+.sapMMenuBtn {
+	.sapMBtn:hover > .sapMBtnHoverable.sapMBtnEmphasized,
+	span.sapMBtnInner.sapMBtnEmphasized {
+		border-left-color: @sapUiButtonEmphasizedTextColor;
+	}
+}
+
+.sapMMenuBtn.sapMMenuBtnSplit .sapMSBActive:not(.sapMBtnDisabled) > span.sapMBtnInner.sapMBtnEmphasized {
+	border-left-color: @sapUiButtonEmphasizedTextColor;
+}
+
+.sapMMenuBtn.sapMMenuBtnRegular .sapMBtnInner::after {
+	line-height: 2.125rem;
+}
+
+.sapMMenuBtn.sapMMenuBtnRegular .sapMBtnInner:not(.sapMBtnText) {
+	padding-left: 0rem;
+}
+
+.sapMMenuBtn .sapMBtn:not(.sapMSBArrow) .sapMBtnInner.sapMBtnIconFirst:not(.sapMBtnText) .sapMBtnIcon {
+	padding-right: 0rem;
+}

package/src/sap/m/themes/sap_horizon_hcb/MenuListItem.less

@@ -0,0 +1,8 @@
+/* =================================== */
+/* CSS for control sap.m/MenuListItem  */
+/* Horizon High Contrast Black theme   */
+/* =================================== */
+
+.sapMRespMenuDialog .sapMLIB {
+  border-bottom: 1px solid;
+}

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

@@ -0,0 +1,19 @@
+/* ================================== */
+/* CSS for control sap.m/MessageBox   */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
+
+// header shadow - different states
+@_sap_m_MessageBox_InformationShadow: inset 0 -0.125rem @sapUiInformationBorder;
+@_sap_m_MessageBox_WarningShadow: inset 0 -0.125rem @sapUiWarningBorder;
+@_sap_m_MessageBox_ErrorShadow: inset 0 -0.125rem @sapUiErrorBorder;
+@_sap_m_MessageBox_SuccessShadow: inset 0 -0.125rem @sapUiSuccessBorder;
+@_sap_m_MessageBox_QuestionShadow: @sapUiContentHeaderShadow;
+
+.sapMDialog.sapMMessageBoxInfo .sapMDialogIcon.sapUiIcon {
+	color: @sapUiInformativeElement;
+}
+
+.sapMMessageBox .sapMDialogFooter .sapMBtn {
+	min-width: 4rem;
+}

package/src/sap/m/themes/sap_horizon_hcb/MessagePage.less

@@ -0,0 +1,34 @@
+/* ================================== */
+/* CSS for control sap.m/MessagePage  */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
+
+/* MessagePage inner controls styles*/
+.sapMMessagePage {
+	.sapMMessagePageInner {
+		.sapMMessagePageIcon.sapUiIcon::before {
+			color: fade(@sapUiContentNonInteractiveIconColor,50);
+		}
+	}
+
+	.sapMMessagePageMainText {
+		margin: 1rem 0;
+	}
+
+	.sapMMessagePageDescription {
+		margin-top: 0;
+		margin-bottom: 2rem;
+
+		&:empty {
+			margin-bottom: 0;
+		}
+
+		.sapMLnk {
+			font-size: @sapMFontHeader5Size;
+		}
+	}
+
+	.sapMMessagePageButtonsWrapper {
+		margin: 0;
+	}
+}

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

@@ -0,0 +1,27 @@
+/* =================================== */
+/* CSS for control sap.m/MessageStrip  */
+/* Horizon High Contrast Black theme   */
+/* =================================== */
+
+.sapMMsgStrip {
+	border-radius: @sapUiElementBorderCornerRadius;
+	border-width: 0.125rem;
+}
+
+.sapMMsgStripCloseButton {
+	top: -0.4375rem;
+}
+
+.sapUiSizeCompact .sapMMsgStripCloseButton {
+	top: -0.0625rem;
+}
+
+.sapMMsgStripInformation {
+	background-color: @sapInformationBackground;
+	border-color: @sapInformationBorderColor;
+	color: @sapUiBaseText;
+
+	& .sapMMsgStripIcon {
+		color: @sapInformativeElementColor;
+	}
+}

package/src/sap/m/themes/sap_horizon_hcb/MessageView.less

@@ -0,0 +1,92 @@
+/* ================================== */
+/* CSS for control sap.m/MessageView  */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
+
+@_sap_m_MessageView_DescIcon_Width: 1rem;
+
+.sapMMsgView {
+	.sapMMsgViewDetailsPage section {
+		padding: 1rem;
+	}
+	.sapMMsgViewItem {
+		padding-left: 0;
+
+		&.sapMSLIWithDescription {
+			padding-top: 0.5rem;
+			padding-bottom: 0.5rem;
+		}
+	}
+
+	.sapMLIBActive .sapMLIBImgNav {
+		background: none;
+	}
+
+	.sapMSLITitleOnly {
+		padding-top: 0.5rem;
+		padding-bottom: 0.5rem;
+	}
+
+	.sapMSLITitle {
+		color: @sapUiGroupTitleTextColor;
+	}
+
+	.sapMSLIDescription {
+		color: @sapUiContentLabelColor;
+	}
+
+	.sapMMsgViewDescriptionText {
+		padding-bottom: 0;
+		margin: 0 0 1rem 2.5rem;
+		line-height: 1.4;
+		font-family: @sapUiFontFamily;
+		color: @sapUiBaseText;
+	}
+
+	.sapMMsgViewTitleText {
+		margin: 0 0 1rem 2.5rem;
+	}
+
+	.sapMMsgViewDescriptionLink {
+		margin: 0 0 1rem 2.5rem;
+		font-family: @sapUiFontFamily;
+		font-size: @sapMFontMediumSize;
+		font-weight: normal;
+		color: @sapUiLink;
+	}
+
+	.sapMSLIWithDescription > .sapMLIBContent > .sapMSLIDiv > .sapMSLIDescription {
+		margin-top: 0.25rem;
+	}
+
+	.sapMIBar .sapMBarChild {
+		margin-left: 0;
+		margin-right: 0;
+	}
+}
+
+.sapMMsgView .sapMIBar.sapMHeader-CTX {
+	background-color: @sapUiGroupContentBackground;
+	padding-left: 1rem;
+}
+
+.sapMMsgViewDescIcon {
+	margin: 0 1rem 0 1.5rem;
+	font-size: 1rem;
+	top: 1.125rem;
+}
+
+.sapMMsgViewItem .sapMSLIImgIcon {
+	font-size: 1rem;
+}
+
+.sapMMsgView .sapMSegBBtn .sapMBtnCustomIcon {
+	font-size: 1rem;
+}
+
+/* Compact size */
+.sapUiSizeCompact .sapMMsgView {
+	.sapMMsgViewDescIcon {
+		line-height: 1rem;
+	}
+}

package/src/sap/m/themes/sap_horizon_hcb/MultiComboBox.less

@@ -0,0 +1,12 @@
+/* ==================================== */
+/* CSS for control sap.m/MultiComboBox  */
+/* Horizon High Contrast Black theme    */
+/* ==================================== */
+
+.sapMMultiComboBoxPicker .sapMFocusable:focus {
+	outline-offset: -0.1875rem;
+}
+
+.sapMMultiComboBoxSelectAll.sapMTB.sapMIBar.sapMMultiComboBoxSelectAllFocused {
+	outline-offset: -0.1875rem;
+}

package/src/sap/m/themes/sap_horizon_hcb/NewsContent.less

@@ -0,0 +1,9 @@
+/* ================================== */
+/* CSS for control sap.m/NewsContent  */
+/* Horizon High Contrast Black theme  */
+/* ================================== */
+
+html.sap-desktop .sapMNwC:focus {
+	outline: 2px dotted @sapUiContentFocusColor;
+    outline-offset: 1px;
+}

package/src/sap/m/themes/sap_horizon_hcb/NotificationListBase.less

@@ -0,0 +1,8 @@
+/* =========================================== */
+/* CSS for control sap.m/NotificationListBase  */
+/* Horizon High Contrast Black theme           */
+/* =========================================== */
+
+html.sap-desktop .sapMNLIB:focus::before {
+	border-width: 2px;
+}

package/src/sap/m/themes/sap_horizon_hcb/NotificationListGroup.less

@@ -0,0 +1,6 @@
+/* ============================================ */
+/* CSS for control sap.m/NotificationListGroup  */
+/* Horizon High Contrast Black theme            */
+/* ============================================ */
+
+@_sap_m_NotificationListGroup_Background: @sapUiListBackground;

package/src/sap/m/themes/sap_horizon_hcb/NumericContent.less

@@ -0,0 +1,8 @@
+/* ===================================== */
+/* CSS for control sap.m/NumericContent  */
+/* Horizon High Contrast Black theme     */
+/* ===================================== */
+
+.sapMNC:focus {
+  outline: 2px dotted @sapUiContentFocusColor;
+}

package/src/sap/m/themes/sap_horizon_hcb/ObjectAttribute.less

@@ -0,0 +1,64 @@
+/* ====================================== */
+/* CSS for control sap.m/ObjectAttribute  */
+/* Horizon High Contrast Black theme      */
+/* ====================================== */
+
+@_sap_m_ObjectAttribute_ListTextShadowColor: none;
+
+.sapMListTbl .sapMObjectAttributeActive .sapMText,
+.sapMObjectAttributeActive .sapMText,
+.sapMObjectAttributeActive .sapMObjectAttributeText {
+	text-decoration: underline;
+}
+
+.sapMObjectAttributeActive .sapMObjectAttributeText:focus {
+	position: relative;
+}
+
+.sapMObjectAttributeActive .sapMObjectAttributeText:focus::after {
+	pointer-events: none;
+	display: block;
+	content: "";
+	position: absolute;
+	top: 2px;
+	left: 1px;
+	bottom: 2px;
+	right: 1px;
+	outline: 2px dotted @sapUiContentFocusColor;
+}
+
+.sapMObjectAttributeActive .sapMObjectAttributeText:focus {
+	text-decoration: none;
+}
+
+.sapMObjectAttributeActive .sapMObjectAttributeText:active,
+.sapMObjectAttributeActive .sapMObjectAttributeText:hover {
+	text-decoration: none;
+	color: @sapUiLinkHover;
+}
+
+/*=========================================== */
+/* Custom design for Responsive Object Header */
+/*=========================================== */
+
+.sapMOHR .sapMObjectAttributeActive .sapMObjectAttributeText:active,
+.sapMOHR .sapMObjectAttributeActive .sapMObjectAttributeText:hover,
+.sapMOHR .sapMObjectAttributeActive .sapMObjectAttributeText:focus {
+	text-decoration: none;
+	color: @sapUiLinkHover;
+}
+
+/*=========================================== */
+/* Custom design for Static Object Header     */
+/*=========================================== */
+
+.sapMOH .sapMObjectAttributeActive .sapMObjectAttributeText:active,
+.sapMOH .sapMObjectAttributeActive .sapMObjectAttributeText:hover {
+	text-decoration: none;
+	color: @sapUiLinkHover;
+}
+
+.sapMOHR .sapMObjectAttributeActive .sapMObjectAttributeText,
+.sapMOH .sapMObjectAttributeActive .sapMObjectAttributeText {
+	text-shadow: @_sap_m_ObjectAttribute_ListTextShadowColor;
+}

package/src/sap/m/themes/sap_horizon_hcb/ObjectHeader.less

@@ -0,0 +1,82 @@
+/* =================================== */
+/* CSS for control sap.m/ObjectHeader  */
+/* Horizon High Contrast Black theme   */
+/* =================================== */
+
+.sapMOH.sapMOHBgTranslucent,
+.sapMOHC.sapMOHBgTranslucent,
+.sapMOH.sapMOHBgSolid,
+.sapMOHC.sapMOHBgSolid {
+	background-color: @sapUiObjectHeaderBackground;
+	border-bottom: 0.125rem solid @sapUiObjectHeaderBorderColor;
+}
+
+.sapMOHC.sapMOHBgTranslucent,
+.sapMOHC.sapMOHBgSolid {
+	border: none;
+	box-shadow: none;
+}
+
+.sapMOH.sapMOHBgTransparent,
+.sapMOHC.sapMOHBgTransparent {
+	background: transparent;
+	border-bottom: 0.125rem solid @sapUiObjectHeaderBorderColor;
+}
+
+a.sapMOHTitle.sapMOHTitleActive:hover > h1 .sapMText {
+	text-decoration: underline;
+}
+
+.sapMOHTitleArrow > .sapUiIcon {
+	outline-offset: -1px;
+}
+
+.sapMOHTitle.sapMOHTitleActive:focus {
+	outline: none;
+}
+
+.sapMOHTitle.sapMOHTitleActive:focus > h1 span,
+.sapMOHTitle.sapMOHTitleActive:focus > h2 span,
+.sapMOHTitle.sapMOHTitleActive:focus > h3 span,
+.sapMOHTitle.sapMOHTitleActive:focus > h4 span,
+.sapMOHTitle.sapMOHTitleActive:focus > h5 span,
+.sapMOHTitle.sapMOHTitleActive:focus > h6 span,
+.sapMOHIcon.sapMPointer .sapUiIcon.sapUiIconPointer:focus,
+.sapMOHTitleArrow .sapUiIcon:focus {
+	outline: 0.125rem dotted @sapUiContentFocusColor;
+	outline-offset: -0.125rem;
+}
+
+/*** styles for responsive object header ***/
+.sapMOHR:not(.sapMOHRNoBorder) {
+	box-shadow: @sapUiShadowHeader;
+}
+
+.sapMOHR.sapMOHRBgSolid,
+.sapMOHR.sapMOHRBgTranslucent {
+	background: @sapUiObjectHeaderBackground;
+}
+
+.sapMOHR.sapMOHRBgTransparent {
+	background: transparent;
+}
+
+.sapMOHRTitleArrow .sapUiIcon:focus {
+	outline: 1px dotted @sapUiContentFocusColor;
+	outline-offset: -1px;
+}
+
+.sapMOHRIcon.sapMPointer .sapUiIcon.sapUiIconPointer:focus {
+	&:before {
+		outline: 1px dotted @sapUiContentFocusColor;
+	}
+}
+
+.sapMOHRTitleActive .sapMOHRTitleText:focus {
+	outline: 1px dotted @sapUiContentFocusColor;
+	outline-offset: -1px;
+}
+
+.sapMOHAttrRow .sapMObjStatus {
+	margin: 4px 1px;
+}

package/src/sap/m/themes/sap_horizon_hcb/ObjectListItem.less

@@ -0,0 +1,11 @@
+/* ===================================== */
+/* CSS for control sap.m/ObjectListItem  */
+/* Horizon High Contrast Black theme     */
+/* ===================================== */
+
+.sapMLIBSelected .sapMObjectNumberText,
+.sapMLIBSelected .sapMObjectNumberUnit,
+.sapMLIBHoverable:hover .sapMObjectNumberText,
+.sapMLIBHoverable:hover .sapMObjectNumberUnit {
+	color: @sapUiListActiveTextColor;
+}

package/src/sap/m/themes/sap_horizon_hcb/ObjectMarker.less

@@ -0,0 +1,10 @@
+/* =================================== */
+/* CSS for control sap.m/ObjectMarker  */
+/* Horizon High Contrast Black theme   */
+/* =================================== */
+
+@_sap_m_ObjectMarker_LinkShadowColor: none;
+
+.sapMObjectMarker .sapMLnk {
+	text-shadow: @_sap_m_ObjectMarker_LinkShadowColor;
+}

package/src/sap/m/themes/sap_horizon_hcb/ObjectNumber.less

@@ -0,0 +1,68 @@
+/* =================================== */
+/* CSS for control sap.m/ObjectNumber  */
+/* Horizon High Contrast Black theme   */
+/* =================================== */
+
+@sapUiInformativeElement: @sapUiInformationBG;
+
+.sapMObjectNumberLarge .sapMObjectNumberText,
+.sapMObjectNumberLarge .sapMObjectNumberUnit {
+	font-size: 1.5rem;
+}
+
+.sapMObjectNumberInverted {
+	box-sizing: border-box;
+	&:not(.sapMObjectNumberLarge) .sapMObjectNumberInner {
+		height: 0.875rem;
+		line-height: 0.75rem;
+	}
+	.sapMObjectNumberText,
+	.sapMObjectNumberUnit {
+		vertical-align: middle;
+		line-height: 0.875rem;
+	}
+}
+
+.sapMObjectNumberInverted .sapMObjectNumberInner {
+	background-color: @sapUiBaseBG;
+	border-width: 0.0625rem;
+	border-style: solid;
+}
+
+html.sap-desktop .sapMObjectNumberActive:focus {
+
+	.sapMObjectNumberInner::after {
+		top: 0px;
+		left: 1px;
+		bottom: -1px;
+		right: 1px;
+		outline: 2px dotted @sapUiContentFocusColor;
+	}
+
+	&.sapMObjectNumberInverted .sapMObjectNumberInner::after {
+		top: -2px;
+		left: 1px;
+		bottom: -2px;
+		right: 1px;
+		outline: 2px dotted @sapUiContentFocusColor;
+	}
+
+	&.sapMObjectNumberLarge {
+
+		.sapMObjectNumberInner::after {
+			top: 1px;
+			left: 1px;
+			bottom: 1px;
+			right: 1px;
+		}
+
+		&.sapMObjectNumberInverted .sapMObjectNumberInner::after {
+			top: 3px;
+			left: 3px;
+			bottom: 3px;
+			right: 3px;
+			outline: 2px dotted @sapContent_ContrastFocusColor;
+		}
+
+	}
+}