From f6ae6a0765cbc8b5eed3f242a29b612251361f14 Mon Sep 17 00:00:00 2001
From: Milton Moura <miltonmoura@gmail.com>
Date: Sun, 8 Sep 2024 01:38:44 +0000
Subject: [PATCH] Replacing button svg with raised hand emoji

Signed-off-by: Milton Moura <miltonmoura@gmail.com>
---
 src/button/Button.tsx  | 19 +++++++++++++++----
 src/tile/MediaView.tsx | 14 ++++++++++++--
 2 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/src/button/Button.tsx b/src/button/Button.tsx
index aa479eab..6012e5b9 100644
--- a/src/button/Button.tsx
+++ b/src/button/Button.tsx
@@ -18,7 +18,6 @@ import {
   SettingsSolidIcon,
 } from "@vector-im/compound-design-tokens/assets/web/icons";
 
-import RaiseHandIcon from "../icons/RaiseHand.svg?react";
 import styles from "./Button.module.css";
 
 interface MicButtonProps extends ComponentPropsWithoutRef<"button"> {
@@ -104,11 +103,23 @@ export const RaiseHandButton: FC<RaiseHandButtonProps> = ({
   return (
     <Tooltip label={t("common.raise_hand")}>
       <CpdButton
-        iconOnly
-        Icon={RaiseHandIcon}
         kind={raised ? "primary" : "secondary"}
         {...props}
-      />
+        style={{ paddingLeft: 8, paddingRight: 8 }}
+      >
+        <p
+          role="img"
+          aria-label="raised hand"
+          style={{
+            width: "30px",
+            height: "0px",
+            display: "inline-block",
+            fontSize: "22px",
+          }}
+        >
+          ✋
+        </p>
+      </CpdButton>
     </Tooltip>
   );
 };
diff --git a/src/tile/MediaView.tsx b/src/tile/MediaView.tsx
index 93515f86..c369625b 100644
--- a/src/tile/MediaView.tsx
+++ b/src/tile/MediaView.tsx
@@ -16,7 +16,6 @@ import { Text, Tooltip } from "@vector-im/compound-web";
 import { ErrorIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
 
 import styles from "./MediaView.module.css";
-import RaiseHandIcon from "../icons/RaiseHand.svg?react";
 import { Avatar } from "../Avatar";
 
 interface Props extends ComponentProps<typeof animated.div> {
@@ -91,7 +90,18 @@ export const MediaView = forwardRef<HTMLDivElement, Props>(
         <div className={styles.fg}>
           {raisedHand && (
             <div className={styles.raisedHand}>
-              <RaiseHandIcon width={22} height={22} />
+              <p
+                role="img"
+                aria-label="raised hand"
+                style={{
+                  width: "22px",
+                  height: "0px",
+                  display: "inline-block",
+                  fontSize: "22px",
+                }}
+              >
+                ✋
+              </p>
             </div>
           )}
           <div className={styles.nameTag}>