From 55e8c9a1bffbb40b08250dc618bcc261ea6cf04b Mon Sep 17 00:00:00 2001
From: Talgat Medetbekov <medetbekov.t@gmail.com>
Date: Fri, 5 Jan 2024 16:42:28 +0600
Subject: [PATCH] Add caution message

---
 public/images/icon/caution.svg    | 5 +++++
 src/components/Banner/Banner.js   | 7 +++++++
 src/components/Banner/Banner.scss | 9 +++++++++
 src/components/Icon/Icon.js       | 2 ++
 4 files changed, 23 insertions(+)
 create mode 100644 public/images/icon/caution.svg

diff --git a/public/images/icon/caution.svg b/public/images/icon/caution.svg
new file mode 100644
index 0000000..d8e1593
--- /dev/null
+++ b/public/images/icon/caution.svg
@@ -0,0 +1,5 @@
+<svg width="18" height="16" viewBox="0 0 18 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M8.99656 4.5C9.41078 4.5 9.74656 4.83579 9.74656 5.25V8.98831C9.74656 9.40252 9.41078 9.73831 8.99656 9.73831C8.58235 9.73831 8.24656 9.40252 8.24656 8.98831V5.25C8.24656 4.83579 8.58235 4.5 8.99656 4.5Z" fill="#F43A4F"/>
+    <path d="M7.99656 11.9883C7.99656 12.5406 8.44428 12.9883 8.99656 12.9883C9.54885 12.9883 9.99656 12.5406 9.99656 11.9883C9.99656 11.436 9.54885 10.9883 8.99656 10.9883C8.44428 10.9883 7.99656 11.436 7.99656 11.9883Z" fill="#F43A4F"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M16.281 12.2256L10.2868 2.22999C9.70401 1.25814 8.29604 1.25813 7.71323 2.22998L1.71899 12.2256C1.11899 13.2261 1.83944 14.4989 3.00579 14.4989H14.9942C16.1606 14.4989 16.881 13.2261 16.281 12.2256ZM11.5736 1.45778C10.408 -0.485923 7.59206 -0.485929 6.42644 1.45777L0.432202 11.4534C-0.767798 13.4544 0.673113 16 3.00579 16H14.9942C17.3269 16 18.7678 13.4544 17.5678 11.4534L11.5736 1.45778Z" fill="#F43A4F"/>
+</svg>
diff --git a/src/components/Banner/Banner.js b/src/components/Banner/Banner.js
index 5c137e7..89bcbb5 100644
--- a/src/components/Banner/Banner.js
+++ b/src/components/Banner/Banner.js
@@ -1,5 +1,6 @@
 import Container from '../Container'
 import GetWalletActions from '../GetWallet/GetWalletActions'
+import Icon from '../Icon'
 
 import './Banner.scss'
 
@@ -7,6 +8,12 @@ function Banner() {
   return (
     <Container clipped={false}>
       <div className="Banner">
+        <div className="Caution">
+          <Icon name="caution" />
+          <span className="ms-2">
+            Beware: Scammers are currently using the name Unstoppable Wallet on Telegram
+          </span>
+        </div>
         <img className="Banner-img-gradient Banner-img-gradient-top" src="/images/banner/gradient-main.svg" alt="" />
         <div className="Banner-start">
           <img
diff --git a/src/components/Banner/Banner.scss b/src/components/Banner/Banner.scss
index 477896e..98e9521 100644
--- a/src/components/Banner/Banner.scss
+++ b/src/components/Banner/Banner.scss
@@ -1,5 +1,14 @@
 @import "../../scss/utils";
 
+.Caution {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  position: absolute;
+  text-align: center;
+  color: $red
+}
+
 .Banner {
   display: flex;
   margin-top: 80px;
diff --git a/src/components/Icon/Icon.js b/src/components/Icon/Icon.js
index 29c62a0..4debcd6 100644
--- a/src/components/Icon/Icon.js
+++ b/src/components/Icon/Icon.js
@@ -16,6 +16,8 @@ const iconComponent = name => {
       return image('/images/icon/arrow-down.svg')
     case 'arrow-up':
       return image('/images/icon/arrow-up.svg')
+    case 'caution':
+      return image('/images/icon/caution.svg')
 
     //  Buttons
     case 'google-play':