Merge pull request #52 from newfold-labs/fix/helpcenter-blank-feedbac…

…k-button-windows Fix/helpcenter blank feedback button windows
newfold-labs · Aug 8, 2024 · 50ff016 · 50ff016
2 parents 9242f84 + 56165b0
commit 50ff016
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 2 deletions.
diff --git a/src/components/Feedback.js b/src/components/Feedback.js
@@ -60,7 +60,15 @@ const Feedback = ( { postId, source } ) => {
 					} }
 					className="feedback-button yes"
 				>
-					{ status === 'helpful' && <>&#129395;</> }{ ' ' }
+					{ status === 'helpful' && (
+						<span
+							className="feedback-button-emoji"
+							role="img"
+							aria-label="helpful"
+						>
+							&#129395;
+						</span>
+					) }
 					{ __( 'Yes', 'wp-module-help-center' ) }
 				</button>
 				<button
@@ -70,7 +78,15 @@ const Feedback = ( { postId, source } ) => {
 					ref={ noButtonRef }
 					className="feedback-button no"
 				>
-					{ status === 'notHelpful' && <>&#128557;</> }{ ' ' }
+					{ status === 'notHelpful' && (
+						<span
+							className="feedback-button-emoji"
+							role="img"
+							aria-label="not helpful"
+						>
+							&#128557;
+						</span>
+					) }
 					{ __( 'No', 'wp-module-help-center' ) }
 				</button>
 			</div>

diff --git a/styles.scss b/styles.scss
@@ -199,6 +199,10 @@ $gray-text: #394150;
       padding-top: 6px;
       flex-shrink: 0;
       white-space: nowrap;
+
+      .feedback-button-emoji {
+        margin-right: 5px;
+      }
     }
     .button-icon {
       height: 20px;