more

src/Components/MobileContent.js

@@ -30,15 +30,24 @@ const MobileContent = ({ isDashboard }) => {
           </>
         ) : (
           <>
-            <div className="mobile-divider"></div>
+            <div>
+              <div>
+                <strong>Notification Center</strong>
+              </div>
+            </div>
           </>
         )}
+        <div className="lower-foo">
           {isDashboard ? (
+            <>
+              <div className="mobile-divider"></div>
               <div className="mobile-info-heading-dashboard">{copy}</div>
+              <div className="mobile-divider"></div>
+            </>
           ) : (
             <div className="mobile-info-heading">{copy}</div>
           )}
-        <div className="mobile-divider"></div>
+        </div>
       </div>
     </>
   );

src/styles/app.scss

@@ -77,10 +77,19 @@ p {
     justify-content: center;
     margin: 18px 2px 0px 2px;
     padding: 2px 2px;
-    background-color: var(--background-blue);
     border-radius: 18px;
   }
 
+  .lower-foo {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    margin: auto;
+    background-color: var(--background-blue);
+    border-radius: 15px;
+  }
+
   .mobile-divider {
     height: 8px;
     width: 88%;