From 0911f3d1584b2e870e03b949b75d2b52f84f9909 Mon Sep 17 00:00:00 2001
From: Corina <14900841+corinagum@users.noreply.github.com>
Date: Wed, 24 Jun 2020 10:21:23 -0700
Subject: [PATCH] #3265 Fix microphone button styling regression (#3276)

* Fix microphone button styling regression

* Update CHANGELOG.md
---
 CHANGELOG.md                                           |  4 ++++
 .../component/src/Styles/StyleSet/MicrophoneButton.js  | 10 ++++++----
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index bb2452b78c..ffb199b805 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -26,6 +26,10 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 -  Resolves [#3182](https://github.com/microsoft/BotFramework-WebChat/issues/3182). Added stacked suggested actions height properties, by [@corinagum](https://github.com/corinagum), in PR [#3235](https://github.com/microsoft/BotFramework-WebChat/pull/3235)
 
+### Fixes
+
+-  Fixes [#3265](https://github.com/microsoft/BotFramework-WebChat/issues/3265). Fix styling specificity regression on microphone button, by [@corinagum](https://github.com/corinagum) in PR [#3276](https://github.com/microsoft/BotFramework-WebChat/pull/3276)
+
 ### Samples
 
 -  Resolves [#3218](https://github.com/microsoft/BotFramework-WebChat/issues/3218) and [#2811](https://github.com/microsoft/BotFramework-WebChat/issues/2811). Adds documentation on reconnecting to a conversation in minimizable sample, by [@corinagum](https://github.com/corinagum), in PR [#3239](https://github.com/microsoft/BotFramework-WebChat/pull/3239)
diff --git a/packages/component/src/Styles/StyleSet/MicrophoneButton.js b/packages/component/src/Styles/StyleSet/MicrophoneButton.js
index d432c7a510..544c44dae7 100644
--- a/packages/component/src/Styles/StyleSet/MicrophoneButton.js
+++ b/packages/component/src/Styles/StyleSet/MicrophoneButton.js
@@ -1,10 +1,12 @@
 export default function createMicrophoneButtonStyle({ microphoneButtonColorOnDictate }) {
   return {
     // TODO: [P3] This path should not know anything about the DOM tree of <IconButton>
-    '&.dictating > button': {
-      '&, &:focus, &:hover': {
-        '& svg': {
-          fill: microphoneButtonColorOnDictate
+    '&.dictating > .webchat__icon-button': {
+      '&:not(:disabled):not([aria-disabled="true"])': {
+        '&, &:focus, &:hover': {
+          '& svg': {
+            fill: microphoneButtonColorOnDictate
+          }
         }
       }
     }