From d16e50415abbdef41747fe4abd90ee5781f24d61 Mon Sep 17 00:00:00 2001
From: nreese <reese.nathan@elastic.co>
Date: Wed, 16 Nov 2022 09:55:36 -0700
Subject: [PATCH] [Controls] fix time slider play button display=fill property
 not being respected

---
 src/plugins/controls/public/time_slider/components/index.scss | 4 ++++
 .../public/time_slider/components/time_slider_prepend.tsx     | 1 +
 2 files changed, 5 insertions(+)

diff --git a/src/plugins/controls/public/time_slider/components/index.scss b/src/plugins/controls/public/time_slider/components/index.scss
index 1fe17385b695..20dfd86a2329 100644
--- a/src/plugins/controls/public/time_slider/components/index.scss
+++ b/src/plugins/controls/public/time_slider/components/index.scss
@@ -15,6 +15,10 @@
   min-width: $euiSizeXXL * 15;
 }
 
+.timeSlider-playToggle {
+  background-color: $euiColorPrimary !important;
+}
+
 .timeSlider__anchor {
   text-decoration: none;
   width: 100%;
diff --git a/src/plugins/controls/public/time_slider/components/time_slider_prepend.tsx b/src/plugins/controls/public/time_slider/components/time_slider_prepend.tsx
index cff2007b666b..3f569fe6b60b 100644
--- a/src/plugins/controls/public/time_slider/components/time_slider_prepend.tsx
+++ b/src/plugins/controls/public/time_slider/components/time_slider_prepend.tsx
@@ -85,6 +85,7 @@ export const TimeSliderPrepend: FC<Props> = (props: Props) => {
       />
       {props.waitForControlOutputConsumersToLoad$ === undefined ? null : (
         <EuiButtonIcon
+          className="timeSlider-playToggle"
           onClick={isPaused ? onPlay : onPause}
           iconType={isPaused ? 'playFilled' : 'pause'}
           size="s"