more

src/Components/MobileContent.js

@@ -1,4 +1,5 @@
 import legalTechFlip from "../Assets/Images/legalTechFlip.jpg";
+import { ExclamationTriangle } from "react-bootstrap-icons";
 const MobileContent = ({ isDashboard }) => {
   const copy = isDashboard ? (
     <>
@@ -31,8 +32,16 @@ const MobileContent = ({ isDashboard }) => {
         ) : (
           <>
             <div>
-              <div>
+              <div className="notication-container">
                 <strong>Notification Center</strong>
+                <div className="notication-text-container">
+                  <p>
+                    <ExclamationTriangle
+                      style={{ color: "red", marginBottom: "5px" }}
+                    />
+                  </p>
+                  <p className="notification-text">No new notifications</p>
+                </div>
               </div>
             </div>
           </>

src/styles/app.scss

@@ -123,4 +123,25 @@ p {
     margin-bottom: 6px;
     padding: 0px 6px;
   }
+  .notication-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    margin-right: auto;
+    margin-left: auto;
+    margin-bottom: 40px;
+  }
+
+  .notication-text-container {
+    display: flex;
+    flex-direction: row;
+    width: 100%;
+    font-size: 1rem;
+    margin-top: 12px;
+  }
+
+  .notification-text {
+    margin-left: 16px;
+  }
 }