Merge pull request #8 from nullscript-lang/dev

feat: Add VSCode extension documentation and improve site structure

Author: kiron0

.vitepress/components/playground.vue

@@ -573,10 +573,6 @@ onMounted(async () => {
     padding: 12px 16px;
     font-size: 16px;
   }
-
-  .code-input {
-    font-size: 16px;
-  }
 }
 
 @media (max-width: 768px) and (orientation: landscape) {

.vitepress/config.ts

@@ -59,6 +59,7 @@ export default defineConfig({
       { text: "Playground", link: "/playground" },
       { text: "Reference", link: "/reference/keywords" },
       { text: "CLI", link: "/cli/usage" },
+      { text: "VS Code", link: "/guide/vscode-extension" },
     ],
 
     sidebar: {
@@ -81,6 +82,13 @@ export default defineConfig({
           text: "Development",
           items: [{ text: "Best Practices", link: "/guide/best-practices" }],
         },
+        {
+          text: "IDE & Tooling",
+          items: [
+            { text: "VS Code Extension", link: "/guide/vscode-extension" },
+            { text: "IDE Support", link: "/guide/ide-support" },
+          ],
+        },
       ],
       "/examples/": [
         {

.vitepress/theme/custom.css

@@ -1,13 +1,13 @@
 @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap');
 
 :root {
-  --vp-c-brand-1: #f7df1e;
+  --vp-c-brand-1: #E8C111;
   --vp-c-brand-2: #e6c800;
-  --vp-button-brand-bg: #f7df1e;
+  --vp-button-brand-bg: #E8C111;
   --vp-button-brand-hover-bg: #e6c800;
   --vp-button-brand-text: #000;
   --vp-button-brand-hover-text: #000;
-  --vp-code-bg: #f7df1e;
+  --vp-code-bg: #E8C111;
   --vp-code-color: #000;
 
   --vp-font-family-base: "Space Grotesk", sans-serif;
@@ -17,7 +17,7 @@
 .dark {
   --vp-c-neutral-1: #000;
   --vp-code-bg: #333;
-  --vp-code-color: #f7df1e;
+  --vp-code-color: #E8C111;
 }
 
 /* Custom scrollbar */