Witnet 2

.github/workflows/deploy.yml

@@ -0,0 +1,81 @@
+name: Deploy
+
+# env:
+#   DEBUG: 'vite:*'
+
+on:
+  # Runs on pushes targeting the default branch
+  # push:
+  #   branches: ["master"]
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
+# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
+concurrency:
+  group: "pages"
+  cancel-in-progress: false
+
+jobs:
+  # Build job
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Enable corepack
+        run: corepack enable pnpm
+
+      - name: Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'pnpm'
+
+      # - name: Setup Pages
+      #   uses: actions/configure-pages@v5
+      #   with:
+      #     Automatically inject router.base in your Nuxt configuration file and set
+      #     target to static (https://nuxtjs.org/docs/configuration-glossary/configuration-target/).
+
+      #     You may remove this line if you want to manage the configuration yourself.
+      - name: Restore cache
+        uses: actions/cache@v4
+        with:
+          path: |
+            dist
+            .nuxt
+          key: ${{ runner.os }}-nuxt-build-${{ hashFiles('dist') }}
+          restore-keys: |
+            ${{ runner.os }}-nuxt-build-
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Static HTML export with Nuxt
+        run: pnpm run generate
+      - name: List files for debugging
+        run: ls -la ./dist
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: ./dist
+
+  # Deployment job
+  deploy:
+    environment:
+      name: github-pages
+      # url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

app.vue

@@ -1,5 +1,5 @@
 <template>
-  <NuxtLayout>
+  <NuxtLayout name="default">
     <NuxtPage />
   </NuxtLayout>
 </template>

assets/styles/fonts.scss

@@ -1,5 +1,5 @@
-@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@600&display=swap');
-@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400,500,600&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700&display=swap');
 @font-face {
   font-family: 'NimbusMono';
   src: url('../fonts/nimbusmono-regular.woff') format('woff');

assets/styles/main.scss

@@ -5,6 +5,4 @@ html {
   height: 100%;
   margin: 0;
   padding: 0;
-  color: $white;
-  background-color: $black;
 }

assets/styles/tailwind.css

@@ -3,31 +3,110 @@
 @tailwind utilities;
 
 @layer components {
+  html {
+    @apply scroll-smooth;
+  }
   /* Titles */
   .title-h1 {
-    @apply font-title text-4xl;
+    @apply font-title text-7xl font-semibold sm:text-6xl;
+    line-height: 0.9;
+    color: #232323;
+  }
+
+  .title-h2-xl {
+    @apply font-title text-7xl font-semibold sm:text-6xl;
+    line-height: 1.1;
+    color: #232323;
   }
+
   .title-h2 {
-    @apply font-title text-2xl;
+    @apply font-title text-5xl font-semibold sm:text-4xl;
+    line-height: 1.1;
+    color: #232323;
+  }
+
+  .title-h3 {
+    @apply font-title text-4xl font-semibold sm:text-3xl;
+    line-height: 1.1;
+    color: #232323;
+  }
+
+  .title-h4 {
+    @apply font-title text-4xl font-semibold sm:text-3xl;
+    line-height: 1.1;
+    color: #232323;
   }
+
+  .title-h5 {
+    @apply text-2xl font-semibold sm:text-xl;
+    line-height: 1.1;
+    color: #232323;
+  }
+
+  .text {
+    @apply text-base;
+    line-height: 1.5;
+    color: #333;
+  }
+
+  .text-dark {
+    @apply text-lg text-white-50;
+    line-height: 1.5;
+  }
+
+  .text-link {
+    @apply text-sm;
+    line-height: 1.5;
+    color: #333;
+  }
+
+  .text-link-dark {
+    @apply text-sm text-white-50;
+    line-height: 1.5;
+  }
+
+  .subtitle {
+    @apply text-sm text-white-300;
+  }
+
+  .footer-text {
+    @apply text-xs text-white-50;
+    line-height: 1.5;
+  }
+
+  .link-hover-style {
+    @apply hover:-mr-[5px] hover:font-semibold;
+  }
+
+  .footer-hover-style {
+    @apply hover:-mr-[2.5px] hover:font-semibold;
+  }
+
   /* Button */
   .btn {
-    @apply w-full py-sm px-md cursor-pointer;
+    @apply w-full py-sm px-l cursor-pointer border-2 border-black-950;
   }
   .btn-primary {
-    @apply font-semibold rounded-full shadow-md bg-wit-blue-500 hover:bg-wit-blue-400 text-black-950 focus:outline-none focus:ring focus:ring-wit-blue-500 focus:ring-opacity-80;
+    @apply font-semibold rounded-full shadow-md bg-wit-blue-500 hover:bg-wit-blue-400 text-black-950 focus:outline-none focus:ring focus:ring-wit-blue-500 focus:ring-opacity-80 shadow-[3px_7px_0px] shadow-black-950;
+  }
+  .btn-dark {
+    @apply font-semibold rounded-full shadow-md bg-white-50 hover:bg-white-100 text-black-950 focus:outline-none focus:ring focus:ring-wit-blue-500 focus:ring-opacity-80 shadow-[3px_7px_0px] shadow-wit-blue-500;
   }
   .btn-secondary {
-    @apply font-semibold rounded-full shadow-md bg-black-950 hover:bg-black-900 text-white-50 focus:outline-none focus:ring focus:ring-black-500 focus:ring-opacity-80 border-2;
+    @apply font-semibold rounded-full shadow-md bg-black-950 hover:bg-black-900 text-white-50 focus:outline-none focus:ring focus:ring-black-500 focus:ring-opacity-80 border-2 shadow-[3px_7px_0px] shadow-black-950;
+  }
+  .btn-terciary {
+    @apply font-semibold rounded-full border-white-50 bg-black-950 hover:bg-black-900 text-white-50 focus:outline-none focus:ring focus:ring-black-500 focus:ring-opacity-80 border-2;
+    white-space: nowrap;
   }
   .btn-disabled {
     @apply cursor-not-allowed font-semibold rounded-full shadow-md bg-wit-blue-500 text-black-950 bg-opacity-80;
   }
   /* Navbar */
   .navbar-links {
-    @apply bg-black-950;
+    @apply text-white-50 sm:bg-black-950;
   }
   .nav-link {
-    @apply text-white-50 hover:text-gray-500;
+    @apply text-black-950 sm:text-white-50;
   }
 }