fix(ui5-carousel): remove outer outline of the arrow on "down" state (#7511)

LidiyaGeorgieva · web-flow · commit 4774bc6d684f · 2023-08-30T19:47:31.000+03:00
* fix(ui5-carousel): remove outer outline of the arrow on "down" state

* fix(ui5-carousel): remove outer outline of the arrow on "down" state
diff --git a/packages/main/src/themes/Carousel.css b/packages/main/src/themes/Carousel.css
@@ -139,6 +139,10 @@
     box-shadow: var(--sapContent_Shadow1);
 }
 
+.ui5-carousel-navigation-arrows .ui5-carousel-navigation-button:active {
+    box-shadow: var(--ui5_carousel_navigation_button_active_box_shadow);
+}
+
 .ui5-carousel-navigation-button--hidden {
     visibility: hidden;
     padding: 0;
diff --git a/packages/main/src/themes/base/Carousel-parameters.css b/packages/main/src/themes/base/Carousel-parameters.css
@@ -8,4 +8,5 @@
     --ui5_carousel_inactive_dot_background: var(--sapContent_ForegroundBorderColor);
     --ui5_carousel_active_dot_border: 1px solid var(--sapContent_Selected_ForegroundColor);
     --ui5_carousel_active_dot_background: var(--sapContent_Selected_ForegroundColor);
+    --ui5_carousel_navigation_button_active_box_shadow: var(--sapContent_Shadow1);
 }
diff --git a/packages/main/src/themes/sap_horizon/Carousel-parameters.css b/packages/main/src/themes/sap_horizon/Carousel-parameters.css
@@ -0,0 +1,5 @@
+@import "../base/Carousel-parameters.css";
+
+:root {
+	--ui5_carousel_navigation_button_active_box_shadow: none;
+}
diff --git a/packages/main/src/themes/sap_horizon/parameters-bundle.css b/packages/main/src/themes/sap_horizon/parameters-bundle.css
@@ -7,7 +7,7 @@
 @import "./Button-parameters.css";
 @import "../base/Card-parameters.css";
 @import "./Card-parameters.css";
-@import "../base/Carousel-parameters.css";
+@import "./Carousel-parameters.css";
 @import "./CheckBox-parameters.css";
 @import "./ColorPalette-parameters.css";
 @import "./ColorPicker-parameters.css";
diff --git a/packages/main/src/themes/sap_horizon_dark/Carousel-parameters.css b/packages/main/src/themes/sap_horizon_dark/Carousel-parameters.css
@@ -0,0 +1,5 @@
+@import "../base/Carousel-parameters.css";
+
+:root {
+	--ui5_carousel_navigation_button_active_box_shadow: none;
+}
diff --git a/packages/main/src/themes/sap_horizon_dark/parameters-bundle.css b/packages/main/src/themes/sap_horizon_dark/parameters-bundle.css
@@ -7,7 +7,7 @@
 @import "./Button-parameters.css";
 @import "../base/Card-parameters.css";
 @import "./Card-parameters.css";
-@import "../base/Carousel-parameters.css";
+@import "./Carousel-parameters.css";
 @import "./CheckBox-parameters.css";
 @import "./ColorPalette-parameters.css";
 @import "./ColorPicker-parameters.css";
diff --git a/packages/main/src/themes/sap_horizon_dark_exp/Carousel-parameters.css b/packages/main/src/themes/sap_horizon_dark_exp/Carousel-parameters.css
@@ -0,0 +1,5 @@
+@import "../base/Carousel-parameters.css";
+
+:root {
+	--ui5_carousel_navigation_button_active_box_shadow: none;
+}
diff --git a/packages/main/src/themes/sap_horizon_dark_exp/parameters-bundle.css b/packages/main/src/themes/sap_horizon_dark_exp/parameters-bundle.css
@@ -7,7 +7,7 @@
 @import "./Button-parameters.css";
 @import "../base/Card-parameters.css";
 @import "./Card-parameters.css";
-@import "../base/Carousel-parameters.css";
+@import "./Carousel-parameters.css";
 @import "./CheckBox-parameters.css";
 @import "./ColorPalette-parameters.css";
 @import "./ColorPicker-parameters.css";
diff --git a/packages/main/src/themes/sap_horizon_exp/Carousel-parameters.css b/packages/main/src/themes/sap_horizon_exp/Carousel-parameters.css
@@ -0,0 +1,5 @@
+@import "../base/Carousel-parameters.css";
+
+:root {
+	--ui5_carousel_navigation_button_active_box_shadow: none;
+}
diff --git a/packages/main/src/themes/sap_horizon_exp/parameters-bundle.css b/packages/main/src/themes/sap_horizon_exp/parameters-bundle.css
@@ -7,7 +7,7 @@
 @import "./Button-parameters.css";
 @import "../base/Card-parameters.css";
 @import "./Card-parameters.css";
-@import "../base/Carousel-parameters.css";
+@import "./Carousel-parameters.css";
 @import "./CheckBox-parameters.css";
 @import "./ColorPalette-parameters.css";
 @import "./ColorPicker-parameters.css";

Original file line number	Diff line number	Diff line change
`@@ -8,4 +8,5 @@`
`8`	`8`	`--ui5_carousel_inactive_dot_background: var(--sapContent_ForegroundBorderColor);`
`9`	`9`	`--ui5_carousel_active_dot_border: 1px solid var(--sapContent_Selected_ForegroundColor);`
`10`	`10`	`--ui5_carousel_active_dot_background: var(--sapContent_Selected_ForegroundColor);`
	`11`	`+ --ui5_carousel_navigation_button_active_box_shadow: var(--sapContent_Shadow1);`
`11`	`12`	`}`
-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +@import "../base/Carousel-parameters.css";
++
 +:root {
 +	--ui5_carousel_navigation_button_active_box_shadow: none;
 +}