feat: styles, nav, home, and stuff

src/components/scafold/Nav.astro

@@ -14,7 +14,7 @@
   </div>
   <div class="nav-right">
     <a href="/check" class="nav-link">Check</a>
-    <a href="/about" class="nav-link">API</a>
+    <a href="/web-check-api" class="nav-link">API</a>
     <a href="/account" class="nav-link">Login</a>
   </div>
 </nav>

src/pages/docs-api.astro

@@ -1,51 +0,0 @@
----
-import BaseLayout from '@layouts/Base.astro';
-import NavBar from '@components/scafold/Nav.astro';
-// import Footer from '@components/scafold/Footer.astro';
-// import config from '../site-config';
-
----
-
-<BaseLayout
-  title="API Docs | Web Check"
-  description="API documentation for the Web Check backend REST endpoints"
->
-  <Fragment slot="head">
-    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/swagger-ui/4.1.3/swagger-ui.css">
-    <link rel="stylesheet" href="https://rawcdn.githack.com/Amoenus/SwaggerDark/2064ccd45b571865a64c731fa6bfddfbf2a01fe1/SwaggerDark.css">
-  </Fragment>
-  <main>
-    <NavBar />
-    <div id="swagger-ui"></div>
-  </main>
-</BaseLayout>
-
-<script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/swagger-ui/4.1.3/swagger-ui-bundle.js"></script>
-<script type="module" is:inline>
-  window.onload = () => {
-    SwaggerUIBundle({
-      url: '/resources/openapi-spec.yml',
-      dom_id: '#swagger-ui',
-      deepLinking: true,
-      presets: [
-        SwaggerUIBundle.presets.apis,
-        SwaggerUIBundle.SwaggerUIStandalonePreset
-      ],
-    });
-  }
-</script>
-
-<style lang="scss">
-  @import '@styles/global.scss';
-  main {
-    padding: 2rem;
-    margin: 0 auto;
-    height: 100vh;
-    width: 100vw;
-    max-width: 1600px;
-    @include mobile-down {
-      padding: 0;
-    }
-  }
-
-</style>

src/pages/index.astro

@@ -33,7 +33,7 @@ if (!isBossServer) {
   main {
     min-height: 100vh;
     padding: 2rem;
-    width: 80vw;
+    // width: 80vw;
     margin: 0 auto;
     z-index: 3;
     background: var(--background);

src/pages/self-hosted-setup.astro

@@ -32,7 +32,7 @@ const cardData = [
     ]
   },
   {
-    title: 'Deploy from Source',
+    title: 'Build from Source',
     description: 'Want to customize Web Check? Clone the repository and deploy it on your server.',
     buttons: [
       {
@@ -97,7 +97,6 @@ const cardData = [
     margin: 0 auto;
     min-height: 100vh;
     width: 100vw;
-    max-width: 1600px;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
@@ -111,6 +110,7 @@ const cardData = [
       min-height: 100%;
       flex-grow: 1;
       padding: 5rem 0 2rem 0;
+      max-width: 1200px;
       @include mobile-down {
       padding: 1rem 0;
     }

src/styles/global.scss

@@ -33,6 +33,7 @@ body {
   font-weight: 400;
   margin: 0;
   min-height: 100vh;
+  position: relative;
 }
 
 /* Links */