From 7d648ae4f518397b2a1cea52622272dc8d3fb626 Mon Sep 17 00:00:00 2001
From: Shreyas Sharma <shreysh2@cisco.com>
Date: Mon, 1 Jul 2024 00:46:53 +0530
Subject: [PATCH] fix(meetings): add-styles-to-refresh-button

---
 src/components/WebexInMeeting/WebexInMeeting.jsx            | 1 +
 src/components/WebexMeeting/WebexMeeting.jsx                | 1 +
 .../WebexMeetingGuestAuthentication.jsx                     | 6 +++---
 .../WebexMeetingGuestAuthentication.scss                    | 6 ++++++
 src/components/icons/RefreshIcon.jsx                        | 6 ++++--
 5 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/components/WebexInMeeting/WebexInMeeting.jsx b/src/components/WebexInMeeting/WebexInMeeting.jsx
index 073effb4f..996d9c497 100644
--- a/src/components/WebexInMeeting/WebexInMeeting.jsx
+++ b/src/components/WebexInMeeting/WebexInMeeting.jsx
@@ -77,6 +77,7 @@ export default function WebexInMeeting({
                 meetingID={meetingID}
                 className={sc('authentication-guest')}
                 switchToHostModal={() => setAuthModal('host')}
+                style={style}
               />
             )
             : <WebexMeetingHostAuthentication meetingID={meetingID} className={sc('authentication-host')} />
diff --git a/src/components/WebexMeeting/WebexMeeting.jsx b/src/components/WebexMeeting/WebexMeeting.jsx
index 91dafd526..391db7548 100644
--- a/src/components/WebexMeeting/WebexMeeting.jsx
+++ b/src/components/WebexMeeting/WebexMeeting.jsx
@@ -144,6 +144,7 @@ export default function WebexMeeting({
                     meetingID={ID}
                     className={sc('authentication-guest')}
                     switchToHostModal={() => setAuthModal('host')}
+                    style={style}
                   />
                 )
                 : <WebexMeetingHostAuthentication meetingID={ID} className={sc('authentication-host')} />
diff --git a/src/components/WebexMeetingGuestAuthentication/WebexMeetingGuestAuthentication.jsx b/src/components/WebexMeetingGuestAuthentication/WebexMeetingGuestAuthentication.jsx
index b050b59e3..27c502e58 100644
--- a/src/components/WebexMeetingGuestAuthentication/WebexMeetingGuestAuthentication.jsx
+++ b/src/components/WebexMeetingGuestAuthentication/WebexMeetingGuestAuthentication.jsx
@@ -145,9 +145,9 @@ export default function WebexMeetingGuestAuthentication({
           tabIndex={102}
         />
         {requiredCaptcha && requiredCaptcha.verificationImageURL && (
-          <div className={sc('captcha-image')} aria-label={HINTS.captchaImage}>
+          <div aria-label={HINTS.captchaImage}>
             <div className={sc('captcha-buttons')}>
-              <img src={requiredCaptcha.verificationImageURL} alt="captcha" />
+              <img src={requiredCaptcha.verificationImageURL} className={sc('captcha-image')} alt="captcha" />
               <Button
                 type="primary"
                 className={sc('captcha-refresh-button')}
@@ -156,7 +156,7 @@ export default function WebexMeetingGuestAuthentication({
                 ariaLabel={HINTS.captchaRefresh}
                 tabIndex={103}
               >
-                <Icon name="refresh" />
+                <Icon name="refresh" style={style} />
               </Button>
             </div>
             <CaptchaInput
diff --git a/src/components/WebexMeetingGuestAuthentication/WebexMeetingGuestAuthentication.scss b/src/components/WebexMeetingGuestAuthentication/WebexMeetingGuestAuthentication.scss
index aef5a4ea5..b36449957 100644
--- a/src/components/WebexMeetingGuestAuthentication/WebexMeetingGuestAuthentication.scss
+++ b/src/components/WebexMeetingGuestAuthentication/WebexMeetingGuestAuthentication.scss
@@ -56,6 +56,12 @@ $C: #{$WEBEX_COMPONENTS_CLASS_PREFIX}-meeting-guest-authentication;
     .#{$C}__captcha-buttons {
       display: flex;
       flex-direction: row;
+      align-items: center;
+    }
+
+    .#{$C}__captcha-image {
+      margin-left: 0.8rem;
+      padding-right: 0.5rem;
     }
 
     .#{$C}__start-button-spinner {
diff --git a/src/components/icons/RefreshIcon.jsx b/src/components/icons/RefreshIcon.jsx
index bdfcfc0d8..96cb8fc32 100644
--- a/src/components/icons/RefreshIcon.jsx
+++ b/src/components/icons/RefreshIcon.jsx
@@ -12,10 +12,12 @@ import PropTypes from 'prop-types';
  *
  */
 export default function RefreshIcon({size, className, style}) {
+  const {fill} = style || {};
+
   return (
-    <svg width={size || 24} height={size || 24} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" className={`wxc-icon ${className}`} style={style}>
+    <svg width={size || 24} height={size || 24} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" className={`wxc-icon ${className}`} style={{fill}}>
       <path d="M0 0h24v24H0z" fill="none" />
-      <path d="M17.65 6.35A7.95 7.95 0 0 0 12 4a8 8 0 1 0 7.9 9.9h-2.1a6 6 0 1 1-1.45-6.45L13 11h7V4l-2.35 2.35z" fill="#FFFFFF" />
+      <path d="M17.65 6.35A7.95 7.95 0 0 0 12 4a8 8 0 1 0 7.9 9.9h-2.1a6 6 0 1 1-1.45-6.45L13 11h7V4l-2.35 2.35z" />
     </svg>
   );
 }