From 541a0a8045dbe8a29ae9ae7f2dec47b580186fed Mon Sep 17 00:00:00 2001
From: dshukertjr <18113850+dshukertjr@users.noreply.github.com>
Date: Tue, 13 Dec 2022 00:46:08 +0900
Subject: [PATCH] adds intro and installing guide for Flutter

---
 apps/docs/docs/ref/dart/installing.mdx   | 41 ++++++++++++++++++++++++
 apps/docs/docs/ref/dart/introduction.mdx | 23 +++++++++++++
 2 files changed, 64 insertions(+)
 create mode 100644 apps/docs/docs/ref/dart/installing.mdx
 create mode 100644 apps/docs/docs/ref/dart/introduction.mdx

diff --git a/apps/docs/docs/ref/dart/installing.mdx b/apps/docs/docs/ref/dart/installing.mdx
new file mode 100644
index 00000000000..9c816a8a847
--- /dev/null
+++ b/apps/docs/docs/ref/dart/installing.mdx
@@ -0,0 +1,41 @@
+---
+id: installing
+title: 'Installing'
+slug: installing
+custom_edit_url: https://github.com/supabase/supabase/edit/master/web/spec/supabase.yml
+---
+
+### Install from pub.dev
+
+<RefSubLayout.EducationRow>
+  <RefSubLayout.Details>
+
+    You can install Supabase package from [pub.dev](https://pub.dev/packages/supabase_flutter)
+
+  </RefSubLayout.Details>
+
+  <RefSubLayout.Examples>
+
+    <Tabs
+      size="small"
+      type="underlined"
+      defaultActiveId="npm"
+    >
+      <TabPanel id="flutter" label="Flutter">
+
+        ```sh Terminal
+        flutter pub add supabase_flutter
+        ```
+
+      </TabPanel>
+      <TabPanel id="dart" label="Other Dart Project">
+
+        ```sh Terminal
+        dart pub add supabase
+        ```
+
+      </TabPanel>
+    </Tabs>
+
+  </RefSubLayout.Examples>
+</RefSubLayout.EducationRow>
diff --git a/apps/docs/docs/ref/dart/introduction.mdx b/apps/docs/docs/ref/dart/introduction.mdx
new file mode 100644
index 00000000000..8dabccf22b2
--- /dev/null
+++ b/apps/docs/docs/ref/dart/introduction.mdx
@@ -0,0 +1,23 @@
+---
+id: introduction
+title: Introduction
+hideTitle: true
+---
+
+<div className="flex items-start gap-6 not-prose" id="introduction">
+  <img src="/docs/img/icons/menu/reference-dart.svg" className="w-8 h-8 rounded" />
+  <div className="flex flex-col gap-2">
+    <h1 className="text-3xl text-scale-1200 m-0">Flutter Client Library</h1>
+    <h2 className="text-base font-mono text-scale-1100">supabase-flutter</h2>
+  </div>
+</div>
+
+<div className="max-w-xl">
+  This reference documents every object and method available in Supabase's Flutter
+  library, [supabase-flutter](https://pub.dev/packages/supabase_flutter). You can
+  use supabase-flutter to interact with your Postgres database, listen to database changes, invoke
+  Deno Edge Functions, build login and user management functionality, and manage large files.
+  <br />
+  <br />
+  We also provide [supabase](https://pub.dev/packages/supabase) package for non-Flutter projects.
+</div>