cleanup & footer center

ByteForgeSoftware · Jun 30, 2023 · 305f898 · 305f898
1 parent f5882e8
commit 305f898
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 35 deletions.
diff --git a/index.html b/index.html
@@ -5,21 +5,21 @@
     <link rel="icon" type="image/png" href="/logo.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>ByteForgeSoftware - Forging the Future of Software Excelence!</title>
-    <meta name="description" content="development company. We create, deliver, and maintain the best software on the web">
+    <meta name="description" content="Software development company. We create, deliver, and maintain the best software on the web">
     <meta name="keywords" content="Software, web, web software, development, development software, software development, web development, software engineering,software arhitecture, software design, development">
     <meta name="author" content="Byte Forge Software">
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap" rel="stylesheet">
     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"  rel="stylesheet"/>
-
   </head>
   <body>
+
     <div id="tsparticles" class="tsparticles"></div>
     <div id="app" class="vh-100">
     </div>
+
     <script src="https://cdn.jsdelivr.net/npm/tsparticles-preset-triangles@2/tsparticles.preset.triangles.bundle.min.js"></script>
     <script type="module" src="/src/main.ts"></script>
-
   </body>
 </html>
diff --git a/public/vite.svg b/public/vite.svg
diff --git a/src/main.ts b/src/main.ts
@@ -83,44 +83,43 @@ const app = document.querySelector<HTMLDivElement>('#app');
 if (app) {
   const template = `
   
-  <header class="">
-  <nav class="navbar navbar-expand-lg bg-transparent text-light">
-    <div class="container-fluid">
-      <a class="navbar-brand text-white d-inline-flex align-items-center" href="#">
-      <img src="/logo.png" class="logo me-3"/>
-      <span>ByteForgeSoftware</span>
-      </a>
-      <button class="navbar-toggler border-white" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
-        <span class="navbar-toggler-icon"></span>
-      </button>
-      <div class="collapse navbar-collapse" id="navbarSupportedContent">
-        <ul class="navbar-nav ms-auto mb-2 mb-lg-0  text-light">
-          <li class="nav-item">
-            <a href="mailto:byte.forge.software@gmail.com" class="nav-link text-white  align-items-center d-flex">
-            <i class="fa-regular fa-envelope me-1"></i>
-            <span>byte.forge.software@gmail.com</span>
-            </a>
-          </li>
-        </ul>
-    </div>
-  </div>
-  </nav>
-</header>
+  <header>
+    <nav class="navbar navbar-expand-lg bg-transparent text-light">
+      <div class="container-fluid">
+        <a class="navbar-brand text-white d-inline-flex align-items-center" href="#">
+        <img src="/logo.png" class="logo me-3"/>
+        <span>ByteForgeSoftware</span>
+        </a>
+        <button class="navbar-toggler border-white" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+          <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="navbarSupportedContent">
+          <ul class="navbar-nav ms-auto mb-2 mb-lg-0  text-light">
+            <li class="nav-item">
+              <a href="mailto:byte.forge.software@gmail.com" class="nav-link text-white  align-items-center d-flex">
+              <i class="fa-regular fa-envelope me-1"></i>
+              <span>byte.forge.software@gmail.com</span>
+              </a>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+  </header>
   <main class="container">
     <div class="wrapper text-white">
-    Forging the Future of
-    <div class="stack" style="--stacks: 3;">
-      <span style="--index: 0;">Software</span>
-      <span style="--index: 1;">Software</span>
-      <span style="--index: 2;">Software</span>
-    </div>
+      <span>Forging the Future of </span>
+      <div class="stack" style="--stacks: 3;">
+        <span style="--index: 0;">Software</span>
+        <span style="--index: 1;">Software</span>
+        <span style="--index: 2;">Software</span>
+      </div>
     <p class="text-end w-100">Excellence!</p>
     </div>
 </main>
 <footer class="container-fluid">
   <div class="row">
-    <p class="text-start text-white col-6"><small> code with &#x2665; @ ${new Date().getFullYear()}  <a href="/">ByteForgeSoftware</a></small></p>
-    <ul class="social-media-list col-6 text-end">
+    <ul class="social-media-list col-12 text-center">
       <li class="text-white d-inline-flex  mx-2">
         <a href="#" class="nav-link text-white  align-items-center d-flex">
           <i class="fa-brands fa-linkedin"></i>
@@ -137,6 +136,7 @@ if (app) {
         </a>
       </li>
     </ul>
+    <p class="text-center text-white col-12"><small> code with &#x2665;  ${new Date().getFullYear()} @ <a href="/">ByteForgeSoftware</a></small></p>
   </div>
 </footer>
 `;