@openui5/themelib_sap_horizon 1.100.0 → 1.102.1

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

@@ -10,14 +10,18 @@
 @_sap_ui_unified_Calendar_ItemWeekEndHoverColor: @sapUiListHoverBackground;
 @_sap_ui_unified_Calendar_ItemOtherMonthColor: @sapUiContentLabelColor;
 
+.sapUiCal {
+	border-radius: 0.5rem;
+}
+
 .sapUiCalItem,
 .sapUiCalWeekNum {
 	height: 2.875rem;
 }
 
-html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus {
-	outline: 0.125rem dotted @sapUiContentFocusColor;
-	outline-offset: -0.1875rem;
+.sapUiCalWeekNum:hover {
+	background-color: @sapUiListHoverBackground;
+	border-radius: 0.5rem;
 }
 
 /* calendar should have only a border if on popup */
@@ -25,12 +29,48 @@ html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus {
 	border-color: @sapUiContentForegroundBorderColor;
 }
 
+html[data-sap-ui-browser^="ff"].sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus {
+	outline-offset: 0; /* to hide firefox bug with native outline always displayed */
+}
+
+html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus::before {
+	content: "";
+	position: absolute;
+	box-sizing: border-box;
+	left: 0.125rem;
+	top: 0.125rem;
+	right: 0.125rem;
+	bottom: 0.125rem;
+	border: 0.125rem solid @sapUiContentFocusColor;
+	pointer-events: none;
+	border-radius: 0.375rem;
+}
+
+.sapUiCalHeadB {
+	position: relative;
+}
+
 html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus:active {
-	outline-color: @sapUiContentContrastFocusColor;
+	border-color: @sapUiContentContrastFocusColor;
 }
 
-html[data-sap-ui-browser^="ff"].sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus {
-	outline-offset: 0; /* to hide firefox bug with native outline always displayed */
+.sapUiCalHead > button,
+.sapUiCalCancel {
+	font-family: @sapFontBoldFamily;
+	color: @sapUiButtonLiteTextColor;
+}
+
+html.sap-desktop .sapUiCalHead > button:hover,
+html.sap-desktop .sapUiCalCancel:hover,
+html.sap-desktop .sapUiCalHead > button:focus,
+html.sap-desktop .sapUiCalCancel:focus {
+	color: @sapUiButtonLiteTextColor;
+}
+
+.sapUiCalWH,
+.sapUiCalWeekNum {
+	color: @sapUiContentLabelColor;
+	font-size: @sapMFontSmallSize;
 }
 
 html[data-sap-ui-browser^="ie"].sap-desktop,
@@ -62,29 +102,42 @@ html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus:not(:hover):not(:active) {
 .sapUiCalHead > .sapUiCalHeadB,
 .sapUiCalCancel,
 html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:hover,
-html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus {
-	color: @sapUiButtonLiteTextColor;
+html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:focus,
+.sapUiCalHead .sapUiCalHeadPrev,
+.sapUiCalHead .sapUiCalHeadNext,
+.sapUiCalHead .sapUiCalHeadToday {
+	border-radius: 0.5rem;
+
+}
+
+.sapUiCalHead .sapUiCalHeadPrev:hover,
+.sapUiCalHead .sapUiCalHeadNext:hover,
+html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:hover {
+	box-shadow: 0 0 0.125rem 0 fade(@sapContent_ShadowColor, 72);
 }
 
 html.sap-desktop .sapUiCalHead > .sapUiCalHeadB:active {
-	color: @sapUiContentContrastTextColor;
+	color: @sapUiButtonActiveTextColor;
+	border-color: @sapUiButtonLiteActiveBorderColor;
 }
 
 /*** days, months, years ***/
 .sapUiCalWH,
-.sapUiCalItem {
+.sapUiCalItem,
+.sapUiCalItemSelBetween.sapUiCalItemSel {
 	border: 0.0625rem solid @_sap_ui_unified_Calendar_ItemBorderColor;
 }
 
 .sapUiCalItem {
-	background-color: @_sap_ui_unified_Calendar_ItemColor;
-	border-radius: 0.25rem;
+	background-color: @sapUiLegendWorkingBackground;
+	border-radius: 0.5rem;
 }
 
 .sapUiCalRowWeekNumber {
 	color: @sapUiBaseText;
 	background-color: @sapUiListBackground;
 	border-color: @sapUiListBorderColor;
+	border-radius: 0.5rem;
 }
 
 .sapUiCalItemNow {
@@ -102,18 +155,13 @@ html.sap-desktop .sapUiCalItem:not(.sapUiCalItemSel):not(.sapUiCalItemWeekEnd):f
 	background-color: @sapUiLegendWorkingBackground;
 }
 
-/* hover and focus makes only sense on desktops. On mobile devices it's not needed */
-html.sap-desktop .sapUiCalDatesRow .sapUiCalItem:not(.sapUiCalItemSel):hover,
-html.sap-desktop .sapUiCalMonthPicker .sapUiCalItem:not(.sapUiCalItemSel):not(.sapUiCalItemSelBetween):hover,
-html.sap-desktop .sapUiCalYearPicker .sapUiCalItem:not(.sapUiCalItemSel):not(.sapUiCalItemSelBetween):hover,
-html.sap-desktop .sapUiCal:not(.sapUiCalDateInt) .sapUiCalItem:not(.sapUiCalItemSel) :not(.sapUiCalWeekNum):hover {
-	background-color: @_sap_ui_unified_Calendar_ItemHoverColor;
+html.sap-desktop .sapUiCalItem.sapUiCalItemNow:not(.sapUiCalItemSelBetween):not(.sapUiCalItemSelStart):not(.sapUiCalItemSelEnd):focus > .sapUiCalItemText{
+	outline-offset: -0.45rem;
 }
 
 html.sap-desktop .sapUiCalMonthPicker .sapUiCalItem:focus,
 html.sap-desktop .sapUiCalYearPicker .sapUiCalItem:focus {
-	outline: 0.0625rem dotted @sapUiContentFocusColor;
-	outline-offset: -0.25rem;
+	border: 0.125rem solid @sapUiContentFocusColor;
 }
 
 html.sap-desktop .sapUiCalItemSel:not(.sapUiCalItemNow):not(.sapUiCalItemSelBetween):focus > .sapUiCalItemText {
@@ -122,8 +170,9 @@ html.sap-desktop .sapUiCalItemSel:not(.sapUiCalItemNow):not(.sapUiCalItemSelBetw
 
 html.sap-desktop .sapUiCalMonthPicker .sapUiCalItemSel:focus,
 html.sap-desktop .sapUiCalYearPicker .sapUiCalItemSel:focus {
-	outline-color: @sapUiContentContrastFocusColor;
+	outline-color: @sapUiContentSelectedTextColor;
 	background-color: @sapUiContentSelectedBackground;
+	color: @sapUiContentSelectedTextColor;
 }
 
 html.sap-desktop .sapUiSizeCompact .sapUiCalItemSel:not(.sapUiCalItemNow):not(.sapUiCalItemSelBetween):focus > .sapUiCalDayName {
@@ -175,7 +224,22 @@ html[data-sap-ui-browser^="ed"].sap-desktop {
 
 .sapUiCalItemWeekEnd,
 html.sap-desktop .sapUiCalItemWeekEnd:not(.sapUiCalItemSel):focus {
-	background-color: @_sap_ui_unified_Calendar_ItemWeekEndColor;
+	background-color: @sapUiLegendNonWorkingBackground;
+}
+
+.sapUiCalItem:hover,
+.sapUiCalItemWeekEnd:hover {
+	background-color: @sapUiListHoverBackground;
+}
+
+html.sap-desktop .sapUiCalDatesRow .sapUiCalItemWeekEnd:not(.sapUiCalItemSel):hover,
+html.sap-desktop .sapUiCal:not(.sapUiCalDateInt) .sapUiCalItemWeekEnd:not(.sapUiCalItemSel) :not(.sapUiCalWeekNum):hover {
+	background-color: @sapUiListHoverBackground;
+	border-radius: 0.5rem;
+}
+
+html.sap-desktop .sapUiCalDatesRow .sapUiCalItemWeekEnd:not(.sapUiCalItemSel):hover {
+	color: inherit;
 }
 
 html.sap-desktop .sapUiCalRow .sapUiCalItemSel:not(.sapUiCalItemNow):not(.sapUiCalItemSelBetween):focus > .sapUiCalItemText {
@@ -183,6 +247,10 @@ html.sap-desktop .sapUiCalRow .sapUiCalItemSel:not(.sapUiCalItemNow):not(.sapUiC
 	border-bottom-left-radius: 0.25rem;
 }
 
+.sapUiCalItemNow:not(.sapUiCalItemSel):not(.sapUiCalItemSelBetween) > .sapUiCalItemText {
+	box-shadow: inset 0.125rem -0.125rem 0 0 @_sap_ui_unified_Calendar_ItemBorderColor, inset -0.125rem 0.125rem 0 0 @_sap_ui_unified_Calendar_ItemBorderColor;
+}
+
 html.sap-desktop .sapUiCalItemSel:not(.sapUiCalItemNow):not(.sapUiCalItemSelBetween):focus > .sapUiCalDayName {
 	border-top-left-radius: 0.25rem;
 	border-bottom-left-radius: 0.25rem;
@@ -194,70 +262,107 @@ html.sap-desktop .sapUiCalItemSel:not(.sapUiCalItemNow):not(.sapUiCalItemSelBetw
 	position: relative;
 	&:focus > .sapUiCalItemText {
 		position: static;
+		outline: none;
 		&:after {
 			position: absolute;
-			top: 0.125rem;
-			left: 0.125rem;
-			right: 0.125rem;
-			bottom: 0.125rem;
-			border: 0.125rem dotted @sapUiContentFocusColor;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			border: 0.125rem solid @sapUiContentFocusColor;
 			content: "";
+			border-radius: 0.5rem;
 		}
 	}
 	&.sapUiCalItemSelBetween .sapUiCalItemText {
 		position: relative;
 	}
 	&.sapUiCalItemNow {
-		border: 0.125rem solid @sapUiLegendCurrentDateTime;
-		border-radius: @sapUiElementBorderCornerRadius;
+		border-radius: 0.5rem;
+		&:hover {
+			background: @sapUiListHoverBackground;
+		}
 		&.sapUiCalItemSelBetween {
 			line-height: normal;
+			& > .sapUiCalItemText {
+				border: 0.0625rem solid @sapUiListSelectionBorderColor;
+				border-radius: 0.3125rem;
+				margin: 0.125rem;
+				width: 1.75rem;
+				height: 2.375rem;
+				line-height: 2.375rem;
+				top: 0.0625rem;
+			}
+		}
+		.sapUiCalSpecialDate {
+			width: 88%;
+			bottom: 0.125rem;
+			left: 0.125rem;
+		}
+		&:focus .sapUiCalSpecialDate,
+		&.sapUiCalItemSel .sapUiCalSpecialDate {
+			width: 75%;
+			bottom: 0.25rem;
+			left: 0.25rem;
 		}
 		.sapUiCalItemText {
 			border: none;
 		}
-		&.sapUiCalItemSelBetween > .sapUiCalItemText {
-			border: 0.0625rem solid @sapUiListSelectionBorderColor;
-			border-radius: 0.125rem;
-		}
-	}
-	&.sapUiCalItemSel {
-		&.sapUiCalItemSelBetween:not(.sapUiCalItemNow) > .sapUiCalItemText {
-			border: 0.0625rem solid @sapUiListSelectionBorderColor;
-			border-radius: 0.25rem;
-			line-height: 2.875rem;
+		&.sapUiCalItemSel {
+			box-shadow: inset 0 0 0 0.25rem @sapUiListBackground;
+			&:focus .sapUiCalSpecialDate {
+				bottom: 0.35rem
+			}
+			&.sapUiCalItemSelBetween:focus > .sapUiCalItemText:after {
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+				border-radius: 0.25rem;
+			}
 		}
-		&:not(.sapUiCalItemSelBetween):focus > .sapUiCalItemText:after {
-			border-color: @sapUiContentContrastFocusColor;
+		&:focus > .sapUiCalItemText:after {
+			top: 0.1875rem;
+			left: 0.1875rem;
+			right: 0.1875rem;
+			bottom: 0.1875rem;
+			border-radius: 0.3125rem;
 		}
-		.sapUiCalSpecialDate{
-			box-sizing: border-box;
-			border: 0.0625rem solid @sapUiListSelectionBorderColor;
-			height: 0.3125rem;
+		&:before {
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			border: 0.125rem solid @sapUiLegendCurrentDateTime;
+			content: "";
+			border-radius: 0.5rem;
 		}
 	}
+	.sapUiCalItemText:after {
+		outline: none;
+	}
 	.sapUiCalSpecialDate {
 		position: absolute;
 		width: 100%;
 		height: 0.3125rem;
-		bottom: 0;
+		bottom: -0.0625rem;
 		border-bottom-left-radius: 0.25rem;
 		border-bottom-right-radius: 0.25rem;
 		pointer-events: none;
+		z-index: 0;
 	}
-	.sapUiCalItemText {
-		border: 0.0625rem solid transparent;
-		border-radius: 0.25rem;
+	&:focus .sapUiCalSpecialDate,
+	&.sapUiCalItemSel .sapUiCalSpecialDate {
+		bottom: 0.0625rem;
+		left: 0.0625rem;
+		width: 95%;
 	}
-}
-
-.sapUiSizeCompact .sapUiCalItem {
-	&.sapUiCalItemSel {
-		.sapUiCalSpecialDate{
-			box-sizing: border-box;
-			border-width: 0;
-			border-top-width: 0.0625rem;
-		}
+	&.sapUiCalItemSel:focus .sapUiCalSpecialDate{
+		bottom: 0.125rem;
+	}
+	.sapUiCalItemText {
+		border-radius: 0.5rem;
 	}
 }
 
@@ -268,35 +373,104 @@ html.sap-desktop .sapUiCalItemSel:not(.sapUiCalItemNow):not(.sapUiCalItemSelBetw
 
 .sapUiCalItemSel {
 	color: @sapUiContentContrastTextColor;
+	&:focus > .sapUiCalItemText {
+		&:after {
+			top: -0.01rem;
+			left: 0.025rem;
+			right: 0.025rem;
+			bottom: 0;
+			border-radius: 0.5rem;
+		}
+	}
 }
 
-html.sap-desktop .sapUiCalItemOtherMonth:not(.sapUiCalItemSel):not(.sapUiCalWeekNum):hover,
-html.sap-desktop .sapUiCalItemOtherMonth:focus {
+html.sap-desktop .sapUiCalItemOtherMonth:not(.sapUiCalItemSel) :not(.sapUiCalWeekNum):hover {
 	background-color: @sapUiListHoverBackground;
 }
 
 .sapUiCalItem.sapUiCalItemSel:not(.sapUiCalItemSelBetween){
 	background-color: @sapUiContentSelectedBackground;
-}
-
-.sapUiCalItemSel:not(.sapUiCalItemSelBetween) > .sapUiCalItemText {
 	color: @sapUiContentSelectedTextColor;
-	border: 0.0625rem solid @sapUiListSelectionBorderColor;
-	border-radius: 0.25rem;
 }
 
 .sapUiCalItem.sapUiCalItemSel:not(.sapUiCalItemSelBetween):hover{
 	background-color: @sapUiContentSelectedHoverBackground;
 }
 
-.sapUiCalItemSel:not(.sapUiCalItemSelBetween):hover > .sapUiCalItemText {
+.sapUiCalMonthPicker,
+.sapUiCalYearPicker {
+	.sapUiCalItem {
+		color: @sapUiButtonLiteTextColor;
+	}
+	.sapUiCalItem.sapUiCalItemSel {
+		font-family: @sapFontBoldFamily;
+	}
+	.sapUiCalItem:focus {
+		line-height: 2.75rem;
+	}
+}
+
+.sapUiSizeCompact {
+	.sapUiCalMonthPicker,
+	.sapUiCalYearPicker {
+		.sapUiCalItem:focus {
+			line-height: 1.75rem;
+		}
+	}
+}
+
+.sapUiCalItemSel:not(.sapUiCalItemSelBetween) > .sapUiCalItemText {
 	color: @sapUiContentSelectedTextColor;
 	border-radius: 0.25rem;
+	font-weight: bold;
+	position: absolute;
+	left: 0;
+}
+
+.sapUiCalItemSel.sapUiCalItemNow:not(.sapUiCalItemSelBetween) > .sapUiCalItemText {
+	top: 0;
 }
 
-.sapUiCalItemNow.sapUiCalItemSel:not(.sapUiCalItemSelBetween):hover > .sapUiCalItemText {
-	border-radius: 0.125rem;
+.sapUiCalItemSel {
+	color: @sapContent_Selected_TextColor;
 }
+
+.sapUiCalItem.sapUiCalItemSel:not(.sapUiCalItemSelBetween) > .sapUiCalItemText:after {
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	border: 0.125rem solid @sapUiContentFocusColor;
+	content: "";
+	border-radius: 0.5rem;
+}
+
+.sapUiCalItem.sapUiCalItemSel.sapUiCalItemNow:not(.sapUiCalItemSelBetween) > .sapUiCalItemText:after {
+	top: 0.1875rem;
+	left: 0.1875rem;
+	right: 0.1875rem;
+	bottom: 0.1875rem;
+	border-radius: 0.3125rem;
+}
+
+.sapUiCalItem.sapUiCalItemSel:focus > .sapUiCalItemText:after {
+	border: 0.1875rem solid @sapUiContentFocusColor;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+}
+
+.sapUiCalItem.sapUiCalItemSel.sapUiCalItemSelBetween:focus > .sapUiCalItemText:after {
+	border-width: 0.125rem;
+	border-radius: 0.4375rem;
+}
+
+.sapUiCalNoNameLine .sapUiCalItem.sapUiCalItemSel:not(.sapUiCalItemSelBetween) > .sapUiCalDayName {
+	color: @sapUiContentSelectedTextColor
+}
+
 .sapUiCalItemSel.sapUiCalItemOtherMonth {
 	background-color: @sapUiSelected;
 }
@@ -304,7 +478,7 @@ html.sap-desktop .sapUiCalItemOtherMonth:focus {
 .sapUiCalItemSelBetween,
 .sapUiCalItemSelBetween.sapUiCalItemOtherMonth {
 	background-color: @sapUiListSelectionBackgroundColor;
-	color: @sapUiBaseText;
+	color: @sapTextColor;
 
 	.sapUiCalItemText {
 		line-height: 2.75rem;
@@ -315,7 +489,7 @@ html.sap-desktop .sapUiCalItemOtherMonth:focus {
 .sapUiCalItemSel,
 html.sap-desktop .sapUiCalItemSel:hover,
 html.sap-desktop .sapUiCalItemSel:focus {
-	border-radius: 0.25rem;
+	border-radius: 0.5rem;
 }
 
 html[data-sap-ui-browser^="ie"].sap-desktop .sapUiCalMonthPicker .sapUiCalItemSel:focus,
@@ -332,13 +506,8 @@ html.sap-desktop .sapUiCalItemSelBetween:focus:not(:hover){
 	background-color: @sapUiListSelectionBackgroundColor;
 }
 
-.sapUiCalItemNow:not(.sapUiCalItemSelBetween) > .sapUiCalItemText {
-	border: 0.0625rem solid @sapUiListBackground;
-	border-radius: (@sapUiElementBorderCornerRadius / 2);
-}
-
 .sapUiCalItemSel.sapUiCalItemNow:not(.sapUiCalItemSelBetween) > .sapUiCalItemText {
-	border-color: @sapUiListSelectionBorderColor;
+	border-radius: 0.5rem;
 }
 
 .sapUiCalItemNow.sapUiCalItemSelBetween{
@@ -355,18 +524,31 @@ html.sap-desktop .sapUiCalItemSelBetween:focus:not(:hover){
 }
 
 /* 2 calendar types */
-.sapUiCalMonthSecType .sapUiCalItem.sapUiCalItemNow  > .sapUiCalItemText{
+.sapUiCalMonthSecType .sapUiCalItem.sapUiCalItemNow > .sapUiCalItemText{
 	line-height: 1.875rem;
 }
 
-.sapUiCalItemNow:not(.sapUiCalItemSelBetween) > .sapUiCalItemText{
-  line-height: 2.75rem;
+.sapUiCalItemNow:not(.sapUiCalItemSelBetween) > .sapUiCalItemText {
+	line-height: 2.9rem;
+}
+
+.sapUiCalMonthSecType .sapUiCalItem.sapUiCalItemSel:not(.sapUiCalItemSelBetween) > .sapUiCalItemSecText {
+	color: @sapUiContentSelectedTextColor;
+}
+
+/* Day names inside day */
+.sapUiCalNoNameLine .sapUiCalItem > .sapUiCalItemText {
+	padding-top: 0.75rem;
 }
 
 /*** compact mode (desktop size) ***/
 
-.sapUiSizeCompact .sapUiCalItemNow:not(.sapUiCalItemSelBetween) > .sapUiCalItemText{
-	line-height: 1.75rem;
+.sapUiSizeCompact .sapUiCalItemNow:not(.sapUiCalItemSelBetween) > .sapUiCalItemText {
+	line-height: 1.95rem;
+}
+
+.sapUiCalHead > button {
+	height: 2.25rem;
 }
 
 .sapUiSizeCompact {
@@ -379,7 +561,18 @@ html.sap-desktop .sapUiCalItemSelBetween:focus:not(:hover){
 	}
 	.sapUiCalItemSelBetween .sapUiCalItemText,
 	.sapUiCalItemSel.sapUiCalItemSelBetween:not(.sapUiCalItemNow) > .sapUiCalItemText {
-		line-height: 1.875rem;
+		line-height: 1.75rem;
+	}
+
+	.sapUiCalHead > button {
+		margin: 0.1875rem 0;
+		height: 1.625rem;
+	}
+
+	.sapUiCalItem.sapUiCalItemNow.sapUiCalItemSelBetween > .sapUiCalItemText {
+		width: 1.5625rem;
+		height: 1.5rem;
+		line-height: 1.4375rem;
 	}
 }
 
@@ -442,8 +635,8 @@ and (min-height: 380px) {
 	}
 
 	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalContent {
-		.sapUiCalMonthView,
-		.sapUiCalDateInt {
+		.sapUiCalDatesRow,
+		.sapUiCalMonthView {
 			position: absolute;
 			top: 0.25rem;
 			left: 0;
@@ -461,9 +654,12 @@ and (min-height: 380px) {
 		min-height: 11.25rem;
 	}
 
-	.sap-phone .sapUiCal[data-sap-ui-popup] div {
-		height: 16.66%;
-		min-height: 1.875rem;
+	.sap-phone .sapUiCal[data-sap-ui-popup] {
+		.sapUiCalDatesRow > div[role=row] > div,
+		.sapUiCalMonthView > div[role=row] > div {
+			height: 16.66%;
+			min-height: 1.875rem;
+		}
 	}
 
 	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalItem {
@@ -481,7 +677,6 @@ and (min-height: 380px) {
 
 	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalWeekNum {
 		height: 100%;
-		top: 0;
 	}
 
 	.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalCancel {
@@ -494,7 +689,7 @@ and (min-height: 380px) {
 		box-sizing: border-box;
 	}
 
-	.sap-phone .sapUiCal[data-sap-ui-popup].sapUiCalSecType  > .sapUiCalCancel {
+	.sap-phone .sapUiCal[data-sap-ui-popup].sapUiCalSecType > .sapUiCalCancel {
 		top: 1.5rem;
 		padding-top: 0.5rem;
 	}
@@ -517,21 +712,15 @@ and (orientation: landscape) {
 .dayColorMixIn(@class, @color){
 	.@{class} > .sapUiCalSpecialDate {
 		background-color: @color;
-		border-top: 0.0625rem solid @sapUiListBackground;
-		border-bottom-left-radius: @sapUiElementBorderCornerRadius;
-		border-bottom-right-radius: @sapUiElementBorderCornerRadius;
+		border-bottom-left-radius: 0.5rem;
+		border-bottom-right-radius: 0.5rem;
 	}
 	.@{class}.sapUiCalItemNow > .sapUiCalSpecialDate {
 		box-sizing: border-box;
 		height: 0.3125rem;
 		border-bottom-left-radius: (@sapUiElementBorderCornerRadius / 2);
 		border-bottom-right-radius: (@sapUiElementBorderCornerRadius / 2);
-		border: 0.0625rem solid @sapUiListBackground;
 	}
-	.@{class}.sapUiCalItemSel.sapUiCalItemNow .sapUiCalSpecialDate{
-		border-color: @sapUiListSelectionBorderColor;
-	}
-
 	.@{class}.sapUiCalItemSel.sapUiCalItemNow .sapUiCalItemText {
 		border-top-left-radius: (@sapUiElementBorderCornerRadius / 2);
 		border-top-right-radius: (@sapUiElementBorderCornerRadius / 2);
@@ -539,7 +728,6 @@ and (orientation: landscape) {
 	html.sap-desktop .sapUiCal:not(.sapUiCalDateInt) .sapUiCalItem:not(.sapUiCalItemSel) {
 		&.@{class} > .sapUiCalSpecialDate:hover {
 			background-color: @color;
-			border-top: 0.0625rem solid @sapUiListBackground;
 			border-bottom-right-radius: 0.25rem;
 			border-bottom-left-radius: 0.25rem;
 			border-top-left-radius: 0;

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

@@ -21,7 +21,7 @@
 
 /* Appointments */
 /* as outlines can't have different offsets on one side (no left border) and don't work in IE just use a inner border */
-html.sap-desktop .sapUiCalendarApp:focus > .sapUiCalendarAppCont:after{
+html.sap-desktop .sapUiCalendarApp:focus > .sapUiCalendarAppCont:after {
 	position: absolute;
 	top: 1px;
 	left: 1px;
@@ -32,6 +32,25 @@ html.sap-desktop .sapUiCalendarApp:focus > .sapUiCalendarAppCont:after{
 	pointer-events: none;
 }
 
+.sapUiCalendarApp,
+.sapUiCalendarAppCont {
+	border-radius: 0.25rem;
+}
+
+.sapUiCalendarAppCont {
+	border-top-left-radius: 0;
+	border-bottom-left-radius: 0;
+}
+
+html.sap-desktop .sapUiCalendarApp:focus:not(:active) > .sapUiCalendarAppCont {
+	background-color: @sapUiListBackground;
+}
+
+html.sap-desktop .sapUiCalendarApp.sapUiCalendarAppSel:focus:hover:not(:active) > .sapUiCalendarAppCont,
+html.sap-desktop .sapUiCalendarApp:hover:not(:active) > .sapUiCalendarAppCont {
+	background-color: @sapUiListHoverBackground;
+}
+
 .sapMListTblRow.sapMLIBFocusable:focus {
 	.sapUiCalendarRowAppsInt.sapUiCalendarRowAppsNoWork:before {
 		position: absolute;
@@ -92,7 +111,6 @@ html.sap-desktop .sapUiCalendarApp.sapUiCalendarAppSel:focus:not(:active){
 .sapUiCalendarApp:active > .sapUiCalendarAppCont,
 .sapUiCalendarApp.sapUiCalendarAppSel:active > .sapUiCalendarAppCont{
 	border-color: @sapUiListSelectionBorderColor;
-	border-left: 0.0625rem solid @sapUiListBackground;
 }
 
 
@@ -117,6 +135,7 @@ html.sap-desktop .sapUiCalendarApp.sapUiCalendarAppSel:hover:not(:active)  > .sa
 
 .sapUiCalendarAppTitle{
 	font-size: @sapMFontMediumSize;
+	color: @sapUiBaseText;
 }
 
 .sapUiCalendarAppText{

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

@@ -1,7 +1,7 @@
-/* =========================================== */
-/* CSS for control sap.ui.unified.ColorPicker  */
-/* Horizon High Contrast Black theme           */
-/* =========================================== */
+/* ========================================== */
+/* CSS for control sap.ui.unified.ColorPicker */
+/* Horizon High Contrast Black theme          */
+/* ========================================== */
 
 .sapUiColorPicker-ColorPickerSlider.sapUiSliHori .sapUiSliBar,
 .sapUiColorPicker-ColorPickerSlider.sapUiSliHori .sapUiSliBar .sapUiSliHiLi {
@@ -19,10 +19,10 @@
 	.sapUiColorPicker-ColorPickerAlphaSlider,
 	.sapUiColorPicker-ColorPickerSlider {
 		.sapMSliderHandle {
+			width: 1.0625rem;
 			top: -0.50rem;
 			border: 0.125rem solid @sapUiContentContrastShadowColor;
 			background-color: transparent;
-			height: 1.625rem;
 			box-shadow: inset 0 0 0 0.125rem @sapUiContentForegroundColor;
 		}
 		.sapMSliderProgress {
@@ -35,6 +35,12 @@
 				//override the blue border color when the handle is pressed
 				border-color: @sapUiContentContrastShadowColor;
 			}
+			.sapMSliderHandle:not(.sapMSliderHandlePressed):not(.sapMRangeSlider.sapMSlider .sapMSliderInner:not(.sapMSliderInnerDisabled) .sapMSliderHandle:focus):after {
+				content: none;
+			}
+			&::before {
+				content: none
+			}
 		}
 	}
 }