Merge pull request #3 from zkSync-Community-Hub/use-nuxt-layer

feat: use docs nuxt layer
zkSync-Community-Hub · May 10, 2024 · 8473014 · 8473014
2 parents 0c1e4e3 + a0e4969
commit 8473014
Show file tree

Hide file tree

Showing 43 changed files with 121 additions and 2,988 deletions.
diff --git a/.eslintignore b/.eslintignore
diff --git a/.eslintrc.json b/.eslintrc.json
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -18,5 +18,6 @@
       "strings": "off"
     },
     "editor.tabCompletion": "onlySnippets"
-  }
+  },
+  "eslint.experimental.useFlatConfig": true
 }
diff --git a/README.md b/README.md
@@ -1,125 +1,62 @@
-![nuxt-ui-docs-social-card](https://github.com/nuxt-ui-pro/docs/assets/739984/f64e13d9-9ae0-4e03-bf7f-6be4c36cd9ba)
+# Community Code
 
-# Nuxt UI Pro - Docs template
+Welcome to the ZKsync Community Code repository. This project serves as the community hub for ZKsync, providing comprehensive
+documentation for developers written by developers.
+Whether you're a beginner looking to get started with ZKsync or an experienced developer
+seeking advanced guides, you'll find the resources you need here.
 
-[![Nuxt UI Pro](https://img.shields.io/badge/Made%20with-Nuxt%20UI%20Pro-00DC82?logo=nuxt.js&labelColor=020420)](https://ui.nuxt.com/pro)
-[![Nuxt Studio](https://img.shields.io/badge/Open%20in%20Nuxt%20Studio-18181B?&logo=nuxt.js&logoColor=3BB5EC)](https://nuxt.studio/themes/docs)
+## Tools used
 
-- [Live demo](https://docs-template.nuxt.dev/)
-- [Play on Stackblitz](https://stackblitz.com/github/nuxt-ui-pro/docs)
-- [Documentation](https://ui.nuxt.com/pro/getting-started)
-- [Clone on Nuxt Studio](https://nuxt.studio/themes/docs)
+- [Vue](https://vuejs.org/)
+- [Nuxt](https://nuxt.com/)
+- [Nuxt Content](https://content.nuxt.com/)
+- [Nuxt UI & Nuxt UI Pro](https://ui.nuxt.com/)
+- [Tailwind](https://tailwindcss.com/)
+- [Bun](https://bun.sh/)
 
-## Quick Start
+## Local Setup
 
-```bash [Terminal]
-npx nuxi init -t github:nuxt-ui-pro/docs
-```
-
-## Setup
-
-Make sure to install the dependencies:
-
-```bash
-# npm
-npm install
-
-# pnpm
-pnpm install
-
-# yarn
-yarn install
+This project uses bun to run, follow the [bun installation instructions](https://bun.sh/docs/installation). Once bun is
+installed, run the following command to install all project dependencies:
 
-# bun
+```shell
 bun install
 ```
 
-## Development Server
-
-Start the development server on `http://localhost:3000`:
-
-```bash
-# npm
-npm run dev
-
-# pnpm
-pnpm run dev
-
-# yarn
-yarn dev
-
-# bun
-bun run dev
-```
-
-## Production
-
-Build the application for production:
-
-```bash
-# npm
-npm run build
+## Development
 
-# pnpm
-pnpm run build
+To run the project locally at `http://localhost:3000`
 
-# yarn
-yarn build
-
-# bun
-bun run build
+```shell
+bun run dev -o
 ```
 
-Locally preview production build:
-
-```bash
-# npm
-npm run preview
-
-# pnpm
-pnpm run preview
+## Local Preview
 
-# yarn
-yarn preview
+To locally preview the production build, first run `bun run generate` to build the project, then run the following:
 
-# bun
+```shell
 bun run preview
 ```
 
-Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
+## Lint & Formatting
 
-## Nuxt Studio integration
+This project provides lint commands to check the project.
 
-Add `@nuxthq/studio` dependency to your package.json:
+### Markdown Linting
 
-```bash
-# npm
-npm install --save-dev @nuxthq/studio
+Markdown files are found in the `/content` directory. The following lint commands will run within that directory:
 
-# pnpm
-pnpm add -D @nuxthq/studio
-
-# yarn
-yarn add -D @nuxthq/studio
-
-# bun
-bun add -d @nuxthq/studio
-```
-
-Add this module to your `nuxt.config.ts`:
-
-```ts
-export default defineNuxtConfig({
-  ...
-  modules: [
-    ...
-    '@nuxthq/studio'
-  ]
-})
+```shell
+bun run lint:spelling
+bun run lint:markdown
 ```
 
-Read more on [Nuxt Studio docs](https://nuxt.studio/docs/projects/setup).
+### Linting
 
-## Renovate integration
+The following commands are available to run linting on the project:
 
-Install [Renovate GitHub app](https://github.com/apps/renovate/installations/select_target) on your repository and you are good to go.
+```shell
+bun run lint:prettier
+bun run lint:eslint
+```
diff --git a/app.config.ts b/app.config.ts
@@ -1,95 +1,22 @@
 export default defineAppConfig({
-  ui: {
-    variables: {
-      light: {
-        background: '255 252 255',
-        // foreground: '147 68 68',
-      },
-      dark: {
-        background: '17 20 43',
-        // foreground: 'var(--color-gray-200)',
-      },
-      // header: {
-      //   height: '1rem',
-      // },
-    },
-    primary: 'zkPurple',
-    gray: 'zkSlate',
-    footer: {
-      bottom: {
-        left: 'text-sm text-gray-500 dark:text-gray-400',
-        wrapper: 'border-t border-gray-200 dark:border-gray-800',
-      },
-    },
-    content: {
-      prose: {
-        code: {
-          icon: {
-            go: 'vscode-icons:file-type-go',
-            vyper: 'devicon:vyper',
-            sol: 'vscode-icons:file-type-solidity',
-          },
-        },
-      },
-    },
-  },
   seo: {
-    siteName: 'zkSync Community Cookbook',
+    siteName: 'ZKsync Community Code',
   },
   header: {
-    logo: {
-      alt: '',
-      light: '/logos/zksync_logo_black.svg',
-      dark: '/logos/zksync_logo.svg',
-    },
-    search: false,
-    colorMode: true,
     links: [
       {
         icon: 'i-simple-icons-github',
-        to: 'https://github.com/matter-labs/zksync-docs',
-        target: '_blank',
-        'aria-label': 'zkSync Docs on GitHub',
-        title: 'zkSync Docs on GitHub',
-      },
-    ],
-  },
-  footer: {
-    credits: 'Made with ❤️ by Matter Labs & Community',
-    colorMode: false,
-    links: [
-      {
-        icon: 'i-zksync-matterlabs-logo',
-        to: 'https://matter-labs.io',
-        target: '_blank',
-        'aria-label': 'MatterLabs Website',
-      },
-      {
-        icon: 'i-simple-icons-x',
-        to: 'https://x.com/zksync',
-        target: '_blank',
-        'aria-label': 'zkSync on X',
-      },
-      {
-        icon: 'i-simple-icons-github',
-        to: 'https://github.com/matter-labs',
-        target: '_blank',
-        'aria-label': 'zkSync on GitHub',
-      },
-      {
-        icon: 'i-simple-icons-discord',
-        to: 'https://join.zksync.dev/',
+        to: 'https://github.com/zkSync-Community-Hub/community-code',
         target: '_blank',
-        'aria-label': 'zkSync on Discord',
+        'aria-label': 'Community Code on GitHub',
+        title: 'Community Code on GitHub',
       },
     ],
   },
   toc: {
-    title: 'Table of Contents',
     bottom: {
-      title: '',
-      edit: 'https://github.com/matter-labs/zksync-docs/edit/staging/content',
-      feedback: 'https://github.com/matter-labs/zksync-docs/issues/new?labels=documentation',
+      edit: 'https://github.com/zkSync-Community-Hub/community-code/edit/staging/content',
+      feedback: 'https://github.com/zkSync-Community-Hub/community-code/issues/new',
       links: [],
     },
   },

diff --git a/app.vue b/app.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
-import type { ParsedContent } from '@nuxt/content/dist/runtime/types';
-
+provideHeadlessUseId(() => useId());
 const { seo } = useAppConfig();
 
 const { data: navigation } = await useAsyncData('navigation', () => fetchContentNavigation());
@@ -30,6 +29,7 @@ useSeoMeta({
   titleTemplate: `%s - ${seo?.siteName}`,
   ogSiteName: seo?.siteName,
   ogUrl: 'https://docs.zksync.io/',
+  ogImage: '/social-card.png',
   ogImageAlt: 'zkSync — Accelerating the mass adoption of crypto for personal sovereignty.',
   ogDescription:
     'zkSync Docs bring you all information you need about our protocol, APIs, SDKs, ZK Stack, and hyperchains. Start with our guides and tutorials, or go deep into our architecture and protocol specification.',
@@ -40,7 +40,7 @@ useSeoMeta({
   twitterImageAlt: 'zkSync — Accelerating the mass adoption of crypto for personal sovereignty.',
 });
 
-defineOgImage({ component: 'OgImageDocs' });
+defineOgImage({ component: 'OgImageCommunityCode' });
 
 provide('navigation', navigation);
 </script>
@@ -49,15 +49,16 @@ provide('navigation', navigation);
   <div>
     <NuxtLoadingIndicator />
 
-    <AppHeader />
+    <HeaderComponent :links="[]" />
 
     <UMain>
       <NuxtLayout>
         <NuxtPage />
       </NuxtLayout>
     </UMain>
 
-    <AppFooter />
+    <FooterComponent />
+
     <UNotifications />
   </div>
 </template>
diff --git a/assets/zksync-icons.ts b/assets/zksync-icons.ts
diff --git a/bun.lockb b/bun.lockb