refactor: monorepo+pnpm (removed husky)

packages/hoppscotch-app/components/landing/Footer.vue

@@ -0,0 +1,166 @@
+<template>
+  <footer class="flex flex-col p-6">
+    <nav class="grid gap-4 grid-cols-2 md:grid-cols-4">
+      <div class="flex flex-col space-y-2">
+        <h4 class="my-2">Hoppscotch</h4>
+        <ul class="space-y-4">
+          <li>
+            <SmartChangeLanguage />
+          </li>
+          <li>
+            <SmartColorModePicker />
+          </li>
+        </ul>
+      </div>
+      <div class="flex flex-col space-y-2">
+        <h4 class="my-2">Solutions</h4>
+        <ul class="space-y-2">
+          <li
+            v-for="(item, index) in navigation.solutions"
+            :key="`item-${index}`"
+          >
+            <SmartAnchor
+              :label="item.name"
+              :to="item.link"
+              class="footer-nav"
+            />
+          </li>
+        </ul>
+      </div>
+      <div class="flex flex-col space-y-2">
+        <h4 class="my-2">Platform</h4>
+        <ul class="space-y-2">
+          <li
+            v-for="(item, index) in navigation.platform"
+            :key="`item-${index}`"
+          >
+            <SmartAnchor
+              :label="item.name"
+              :to="item.link"
+              class="footer-nav"
+            />
+          </li>
+        </ul>
+      </div>
+      <div class="flex flex-col space-y-2">
+        <h4 class="my-2">Company</h4>
+        <ul class="space-y-2">
+          <li
+            v-for="(item, index) in navigation.company"
+            :key="`item-${index}`"
+          >
+            <SmartAnchor
+              :label="item.name"
+              :to="item.link"
+              class="footer-nav"
+            />
+          </li>
+        </ul>
+      </div>
+    </nav>
+  </footer>
+</template>
+
+<script>
+import { defineComponent } from "@nuxtjs/composition-api"
+
+export default defineComponent({
+  data() {
+    return {
+      navigation: {
+        solutions: [
+          {
+            name: "RESTful",
+            link: "/",
+          },
+          {
+            name: "WebSocket",
+            link: "/realtime",
+          },
+          {
+            name: "SSE",
+            link: "/realtime",
+          },
+          {
+            name: "Socket.IO",
+            link: "/realtime",
+          },
+          {
+            name: "MQTT",
+            link: "/realtime",
+          },
+          {
+            name: "GraphQL",
+            link: "/graphql",
+          },
+        ],
+        platform: [
+          {
+            name: "API Designing",
+            link: "/",
+          },
+          {
+            name: "API Development",
+            link: "/",
+          },
+          {
+            name: "API Testing",
+            link: "/",
+          },
+          {
+            name: "API Deployment",
+            link: "/",
+          },
+          {
+            name: "API Documentation",
+            link: "/documentation",
+          },
+          {
+            name: "Integrations",
+            link: "/",
+          },
+        ],
+        company: [
+          {
+            name: "About",
+            link: "/",
+          },
+          {
+            name: "Careers",
+            link: "/careers",
+          },
+          {
+            name: "Support",
+            link: "/",
+          },
+          {
+            name: "Contact",
+            link: "/",
+          },
+          {
+            name: "Blog",
+            link: "https://blog.hoppscotch.io",
+          },
+          {
+            name: "Community",
+            link: "/",
+          },
+          {
+            name: "Open Source",
+            link: "https://github.com/hoppscotch",
+          },
+        ],
+      },
+    }
+  },
+})
+</script>
+
+<style scoped lang="scss">
+.footer-nav {
+  @apply px-2 py-1;
+  @apply -mx-2 -my-1;
+  @apply hover:text-secondaryDark;
+  @apply focus-visible:text-secondaryDark;
+}
+</style>