remove editor.css

.vscode/card.code-snippets

@@ -1,16 +1,54 @@
 {
-    "DocuCards": {
-      "prefix": "card",
+  "Docu Card Group": {
+    "prefix": "card-group",
     "body": [
-        "<CardGroup cols={2}>",
-            "<Card title=\"${1:Heading2}\" icon=\"${2:Heading2}\">",
-            "   This is an example of card content with columns.",
+      "<CardGroup cols={${1:2}}>",
+      "  <Card title=\"${2:Card Title}\" icon=\"${3:Home}\">",
+      "    ${4:Card content goes here. You can add **markdown** content.}",
       "  </Card>",
-            "<Card title=\"${3:Heading3}\" icon=\"${4:Heading3}\">",
-            "   This is an example of card content with columns.",
+      "  <Card title=\"${5:Another Card}\" icon=\"${6:Settings}\">",
+      "    ${7:More content here.}",
       "  </Card>",
       "</CardGroup>"
     ],
-      "description": "Create a DocuCards component on markdown."
+    "description": "Create a group of cards in a responsive grid"
+  },
+  "Docu Card": {
+    "prefix": "card",
+    "body": [
+      "<Card ",
+      "  title=\"${1:Card Title}\"",
+      "  icon=\"${2:Home}\"",
+      "  href=\"${3:/optional-link}\"",
+      "  ${4:horizontal}>",
+      "  ${5:Card content goes here. You can add **markdown** content.}",
+      "</Card>"
+    ],
+    "description": "Create a single card component"
+  },
+  "Docu Horizontal Card": {
+    "prefix": "card-horizontal",
+    "body": [
+      "<Card ",
+      "  title=\"${1:Card Title}\"",
+      "  icon=\"${2:Home}\"",
+      "  href=\"${3:/optional-link}\"",
+      "  horizontal>",
+      "  ${4:Content appears next to the icon in a horizontal layout.}",
+      "</Card>"
+    ],
+    "description": "Create a horizontal card layout"
+  },
+  "Docu Card With Link": {
+    "prefix": "card-link",
+    "body": [
+      "<Card ",
+      "  title=\"${1:Card Title}\"",
+      "  icon=\"${2:ExternalLink}\"",
+      "  href=\"${3:https://example.com}\">",
+      "  ${4:This card is clickable and links to an external URL.}",
+      "</Card>"
+    ],
+    "description": "Create a clickable card that links to a URL"
   }
 }

.vscode/extensions.json

@@ -1,3 +0,0 @@
-{
-    "recommendations": []
-}

.vscode/table.code-snippets

@@ -2,19 +2,11 @@
   "DocuTable": {
     "prefix": "table",
     "body": [
-        "| **${1:Feature}**                     | **${2:Description}**                                       |",
-        "| ------------------------------- | ----------------------------------------------------- |",
-        "| ${3:MDX Support}                     | ${4:Write interactive documentation with MDX.}             |",
-        "| Nested Pages                    | Organize content in a nested, hierarchical structure. |",
-        "| Blog Section                    | Include a dedicated blog section.                     |",
-        "| Pagination                      | Split content across multiple pages.                  |",
-        "| Syntax Highlighting             | Highlight code for better readability.                |",
-        "| Code Line Highlighting & Titles | Highlight specific lines with descriptive titles.     |",
-        "| Interactive Code Blocks         | Language-specific and interactive code display.       |",
-        "| Custom Markdown Components      | Embed custom, reusable components in your docs.       |",
-        "| Static Site Generation          | Generate a static, high-performance site.             |",
-        "| SEO-Optimized                   | Structured for optimal search engine indexing.        |"
+      "| **${1:Header 1}** | **${2:Header 2}** |",
+      "| ---------------- | ---------------- |",
+      "| ${3:Row 1, Col 1} | ${4:Row 1, Col 2} |",
+      "| ${5:Row 2, Col 1} | ${6:Row 2, Col 2} |"
     ],
-      "description": "Create a DocuTable component on markdown."
+    "description": "Create a simple 2x2 markdown table"
   }
 }

styles/editor.css

@@ -1,57 +0,0 @@
-/* GitHub-style editor customizations */
-.editor-container {
-  @apply relative font-mono text-sm leading-relaxed;
-  height: 100%;
-  min-height: 600px;
-}
-
-.editor-textarea {
-  @apply w-full h-full min-h-[600px] p-4 pl-14 bg-background resize-none focus:outline-none;
-  line-height: 1.5rem;
-  tab-size: 2;
-  counter-reset: line;
-}
-
-/* Line numbers */
-.editor-line-numbers {
-  @apply absolute left-0 top-0 bottom-0 w-10 bg-muted/30 border-r select-none;
-  padding: 1rem 0;
-  overflow: hidden;
-}
-
-.editor-line-numbers-content {
-  @apply text-right pr-2 text-muted-foreground/70;
-  font-size: 13px;
-  line-height: 1.5rem;
-}
-
-.editor-line-numbers-content > div {
-  height: 1.5rem;
-}
-
-.editor-line-numbers-content > div::before {
-  content: attr(data-line-number);
-  display: block;
-}
-
-/* Selection styling */
-.editor-textarea::selection {
-  @apply bg-primary/20;
-}
-
-.dark .editor-textarea::selection {
-  @apply bg-primary/30;
-}
-
-/* Scrollbar styling */
-.editor-textarea::-webkit-scrollbar {
-  @apply w-2;
-}
-
-.editor-textarea::-webkit-scrollbar-track {
-  @apply bg-transparent;
-}
-
-.editor-textarea::-webkit-scrollbar-thumb {
-  @apply bg-muted-foreground/20 rounded-full hover:bg-muted-foreground/30;
-}

styles/globals.css

@@ -3,7 +3,6 @@
 @tailwind utilities;
 
 @import url("../styles/syntax.css");
-@import url("../styles/editor.css");
 
 /* ocean */
 @layer base {
@@ -119,22 +118,6 @@ pre>code {
   background-color: transparent !important;
 }
 
-.line-clamp-3 {
-  display: -webkit-box;
-  -webkit-line-clamp: 3;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.line-clamp-2 {
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
 @layer utilities {
     .animate-shine {
       --animate-shine: shine var(--duration) infinite linear;

tailwind.config.ts

@@ -9,7 +9,6 @@ const config = {
     "./src/**/*.{ts,tsx}",
   ],
   prefix: "",
-  safelist: ["line-clamp-3","line-clam-2"],
   theme: {
   	container: {
   		center: true,