-
-
+
+
-
+
+
+
diff --git a/packages/docs/src/content/config.ts b/packages/docs/src/content/config.ts
new file mode 100644
index 0000000..dc7a0b2
--- /dev/null
+++ b/packages/docs/src/content/config.ts
@@ -0,0 +1,19 @@
+import { defineCollection, z } from "astro:content";
+
+const docs = defineCollection({
+ type: "content",
+ schema: z.object({
+ nav_group: z.string(),
+ nav_group_order: z.number(),
+ nav_order: z.number(),
+ nav_title: z.string().optional(),
+ title: z.string(),
+ description: z.string().optional(),
+ tags: z.array(z.string()).optional(),
+ image: z.string().optional(),
+ })
+});
+
+export const collections = {
+ docs: docs,
+};
diff --git a/packages/docs/src/content/docs/concepts/state-management.mdx b/packages/docs/src/content/docs/concepts/state-management.mdx
new file mode 100644
index 0000000..4870aff
--- /dev/null
+++ b/packages/docs/src/content/docs/concepts/state-management.mdx
@@ -0,0 +1,9 @@
+---
+title: State Management
+description: "Learn how to manage state in Flitter."
+
+nav_group: "Concepts"
+nav_group_order: 2
+nav_order: 2
+nav_title: "State Management"
+---
\ No newline at end of file
diff --git a/packages/docs/src/content/docs/concepts/widget.mdx b/packages/docs/src/content/docs/concepts/widget.mdx
new file mode 100644
index 0000000..2a02a83
--- /dev/null
+++ b/packages/docs/src/content/docs/concepts/widget.mdx
@@ -0,0 +1,10 @@
+---
+
+title: Widget
+description: Widgets are the basic building blocks of the UI.
+
+nav_group: "Concepts"
+nav_group_order: 2
+nav_order: 1
+nav_title: "Widget"
+---
\ No newline at end of file
diff --git a/packages/docs/src/content/docs/introduction.mdx b/packages/docs/src/content/docs/introduction.mdx
new file mode 100644
index 0000000..ff08b39
--- /dev/null
+++ b/packages/docs/src/content/docs/introduction.mdx
@@ -0,0 +1,26 @@
+---
+nav_group: "Getting Started"
+nav_group_order: 1
+nav_order: 1
+nav_title: "Introduction to Flitter"
+title: "Getting Started with Flitter Library"
+description: "Learn how to get started with Flitter library."
+---
+
+# Welcome to Flitter
+
+Flitter is a cutting-edge framework designed for efficient and declarative manipulation of SVGs. Inspired by the best practices from frameworks like Flutter, Flitter enables developers to create rich, interactive, and scalable vector graphics with minimal code.
+
+## Key Features
+
+- **Declarative Syntax**: Write clear and concise code that describes what your SVG should look like, not how to draw it.
+- **Framework Agnostic**: Use Flitter with your favorite JavaScript frameworks, including React, Svelte, and more.
+- **Rich Widget Library**: Access a comprehensive library of pre-built SVG widgets that can be easily customized and extended.
+- **Performance Optimized**: Enjoy smooth and fast rendering performance for even the most complex vector graphics.
+
+## Getting Started
+
+To get started with Flitter, install the library in your project:
+
+```bash
+npm install flitter-svg
diff --git a/packages/docs/src/content/docs/widgets/container.mdx b/packages/docs/src/content/docs/widgets/container.mdx
new file mode 100644
index 0000000..03d1e39
--- /dev/null
+++ b/packages/docs/src/content/docs/widgets/container.mdx
@@ -0,0 +1,11 @@
+---
+title: Container
+description: Container is a widget that can contain other widgets.
+tags: ["Widgets", "Container"]
+
+nav_group: "Widgets"
+nav_group_order: 3
+nav_order: 1
+nav_title: "Container"
+---
+
diff --git a/packages/docs/src/env.d.ts b/packages/docs/src/env.d.ts
index f964fe0..acef35f 100644
--- a/packages/docs/src/env.d.ts
+++ b/packages/docs/src/env.d.ts
@@ -1 +1,2 @@
+///
///
diff --git a/packages/docs/src/layouts/DocsLayout.astro b/packages/docs/src/layouts/DocsLayout.astro
new file mode 100644
index 0000000..91fae9b
--- /dev/null
+++ b/packages/docs/src/layouts/DocsLayout.astro
@@ -0,0 +1,20 @@
+---
+import Layout from "./Layout.astro";
+interface Props {
+ title?: string;
+ description?: string;
+ image?: string;
+}
+
+const { title } = Astro.props;
+---
+
+
+
+
+
+
diff --git a/packages/docs/src/layouts/HomeLayout.astro b/packages/docs/src/layouts/HomeLayout.astro
new file mode 100644
index 0000000..8666615
--- /dev/null
+++ b/packages/docs/src/layouts/HomeLayout.astro
@@ -0,0 +1,20 @@
+---
+import Footer from "../components/ui/Footer.astro";
+import Layout from "./Layout.astro";
+interface Props {
+ title: string;
+}
+
+const { title } = Astro.props;
+---
+
+
+
+
+
+
+
diff --git a/packages/docs/src/layouts/Layout.astro b/packages/docs/src/layouts/Layout.astro
index 8594f27..08aec6f 100644
--- a/packages/docs/src/layouts/Layout.astro
+++ b/packages/docs/src/layouts/Layout.astro
@@ -1,8 +1,9 @@
---
-import Header from '../components/ui/Header.astro';
-import Footer from '../components/ui/Footer.astro';
+import Header from "../components/ui/Header.astro";
interface Props {
- title: string;
+ title?: string;
+ description?: string;
+ image?: string;
}
const { title } = Astro.props;
@@ -16,12 +17,13 @@ const { title } = Astro.props;
-
{title}
+
{title ?? "Flitter"}
-
-
-
+
+
+
+