documentation structure

src/constants/code/Backgrounds/dotGridCode.ts

@@ -0,0 +1,39 @@
+import code from '@content/Backgrounds/DotGrid/DotGrid.vue?raw'
+import type { CodeObject } from '../../../types/code'
+
+export const dotGrid: CodeObject = {
+  cli: `npx jsrepo add https://vuebits.dev/Backgrounds/DotGrid`,
+  installation: `npm install gsap`,
+  usage: `<template>
+  <div class="dot-grid-container">
+    <DotGrid
+      :dot-size="16"
+      :gap="32"
+      base-color="#27FF64"
+      active-color="#27FF64"
+      :proximity="150"
+      :speed-trigger="100"
+      :shock-radius="250"
+      :shock-strength="5"
+      :max-speed="5000"
+      :resistance="750"
+      :return-duration="1.5"
+      class-name="custom-dot-grid"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+  import DotGrid from "./DotGrid.vue";
+</script>
+
+<style scoped>
+  .dot-grid-container {
+    width: 100%;
+    height: 500px;
+    position: relative;
+    overflow: hidden;
+  }
+</style>`,
+  code
+}