feat: migrated to Titilium Web font; fixed message displacement bug

metakgp · Jun 29, 2024 · ee0f007 · ee0f007
1 parent 723cce2
commit ee0f007
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 13 deletions.
diff --git a/frontend/src/pages/Register.tsx b/frontend/src/pages/Register.tsx
@@ -8,7 +8,7 @@ import { RedirectToast } from "../components/RedirectToast";
 
 export const Register: Component = () => {
     const [getStatus, setStatus] = createSignal("Initiating User Registration");
-    const [getMsg, setMsg] = createSignal("");
+    const [getMsg, setMsg] = createSignal("\u00A0");
     const [getIsLoad, setIsLoad] = createSignal(true);
     const [getIsErr, setIsErr] = createSignal(false);
 
@@ -102,18 +102,19 @@ export const Register: Component = () => {
                 </div>
                 <div class="reg-status">
                     <div class="reg-status-title">{getStatus()}</div>
-                    <div class="reg-status-text">{getMsg()}</div>
+                    <div class="reg-status-text">{`${getMsg()}`}</div>
                 </div>
                 <div class="reg-footer">
-                    <h3 class="reg-footer">
-                        Made with ❤️ and {"</>"} by{" "}
+                    <p class="reg-footer">
+                        Made with ❤️ and {"</>"}
+                        <br/>
                         <a
                             href="https://github.com/metakgp/naarad"
                             target="_blank"
                         >
-                            Metakgp
+                            metaKGP
                         </a>
-                    </h3>
+                    </p>
                 </div>
             </div>
         </div>

diff --git a/frontend/src/styles/base.scss b/frontend/src/styles/base.scss
@@ -1,4 +1,5 @@
-$font-family: system-ui, Arial, sans-serif;
+@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;600;900&display=swap');
+$font-family: "Titillium Web", system-ui, Arial, sans-serif;
 
 * {
     margin: 0;

diff --git a/frontend/src/styles/register.scss b/frontend/src/styles/register.scss
@@ -26,14 +26,15 @@ $medium: 1024px;
             align-items: center;
 
             .reg-title-name{
-                font-size: 2.5rem;
-                font-weight: 600;
-                padding-bottom: 0.2rem;
+                font-size: 4rem;
+                font-weight: 900;
             }
 
             .reg-title-desc{
+                margin-top: -1rem;
                 font-size: 1rem;
-                color: hsl(215, 20.2%, 65.1%);
+                font-weight: 600;
+                color: #94a3b8;
             }
 
             .reg-status-svg{
@@ -53,7 +54,7 @@ $medium: 1024px;
         .reg-status{
             .reg-status-title{
                 font-size: 1.5rem;
-                font-weight: 500;
+                font-weight: 600;
             }
 
             .reg-status-text{
@@ -63,14 +64,18 @@ $medium: 1024px;
                 align-items: end;
                 font-size: 1.15rem;
                 font-weight: 400;
-                color: hsl(215, 20.2%, 65.1%);
+                color: #94a3b8;
             }
         }
 
         .reg-footer{
             margin-top: 1.5rem;
+            font-size: 1.25rem;
+            font-weight: 600;
             a{
+                font-size: 1.5rem;
                 color: #fff;
+                font-weight: 900;
             }
         }
     }