docs: add official site

docs/.vitepress/config.mts

@@ -0,0 +1,40 @@
+import { defineConfig } from "vitepress";
+
+// https://vitepress.dev/reference/site-config
+export default defineConfig({
+  title: "Sky Follower Bridge",
+  description: "Official Documentation of Sky Follower Bridge",
+  themeConfig: {
+    // https://vitepress.dev/reference/default-theme-config
+    logo: {
+      src: "/images/logo.png",
+      alt: "Sky Follower Bridge Logo",
+    },
+    nav: [
+      { text: "Home", link: "/" },
+      { text: "Getting Started", link: "/get-started" },
+      { text: "Troubleshooting", link: "/troubleshooting" },
+    ],
+
+    socialLinks: [
+      {
+        icon: "github",
+        link: "https://github.com/kawamataryo/sky-follower-bridge",
+      },
+    ],
+
+    outline: {
+      level: "deep",
+    },
+
+    editLink: {
+      pattern:
+        "https://github.com/kawamataryo/sky-follower-bridge/edit/main/docs/:path",
+      text: "Edit this page on GitHub",
+    },
+
+    search: {
+      provider: "local",
+    },
+  },
+});

docs/get-started.md

@@ -0,0 +1,66 @@
+# Getting Started
+
+Sky Follower Bridge helps you find and follow your X (Twitter) connections on Bluesky.
+
+## Installation
+
+Sky Follower Bridge is available on:
+
+- [Chrome Web Store](https://chrome.google.com/webstore/detail/sky-follower-bridge/behhbpbpmailcnfbjagknjngnfdojpko) (Recommended)
+- [Firefox Add-ons](https://addons.mozilla.org/en-US/firefox/addon/sky-follower-bridge/)
+- [Microsoft Edge Add-ons](https://microsoftedge.microsoft.com/addons/detail/sky-follower-bridge/dpeolmdblhfolkhlhbhlofkkpaojnnbb)
+
+::: tip
+We recommend using the Chrome Web Store version as it's always up to date. Other store versions may lag behind in updates.
+:::
+
+## Usage
+
+### 1. Navigate to X (Twitter)
+
+Visit any of these pages on X:
+- Your Following page: `x.com/<your_handle>/following`
+- Your Blocked users page: `x.com/settings/blocked/all`
+- A public List's Members page: `x.com/i/lists/<list_id>/members`
+
+![following-page](./images/following-page.png)
+
+### 2. Launch Sky Follower Bridge
+
+Either press `Alt + B` or click the extension icon in your browser toolbar.
+
+![Open Extension](./images/open-extension.png)
+
+### 3. Sign in to Bluesky
+
+Enter your Bluesky handle (or email) and [App password](https://bsky.app/settings/app-passwords).
+
+![enter-credentials](./images/enter-credentials.png)
+
+
+### 4. Start the Search
+
+Click "Find Bluesky Users" to begin scanning. The extension will search for matching Bluesky profiles by checking the Bluesky API.
+
+![find-bluesky-users](./images/scan-users.png)
+
+### 5. Review Results
+
+Click "View Results" to see potential matches found on Bluesky.
+
+![view-results-button](./images/click-results.png)
+
+This will open the options page showing all detected Bluesky users.
+
+![options](./images/options.png)
+
+### 6. Follow Users
+
+Click the "Follow" button next to any user you'd like to connect with.
+That's all! Enjoy connecting with your community on Bluesky 🎉
+
+![follow](./images/click-follow-btn.png)
+
+::: warning
+Please note that the matching process isn't perfect and may occasionally suggest incorrect matches. Always verify the profile before following.
+:::

docs/index.md

@@ -0,0 +1,60 @@
+---
+# https://vitepress.dev/reference/default-theme-home-page
+layout: home
+
+hero:
+  name: "Sky Follower Bridge"
+  text: "Bridge Your Social Networks"
+  tagline: Seamlessly migrate your social connections from 𝕏 to Bluesky
+  actions:
+    - theme: brand
+      text: Get Started
+      link: /get-started
+    - theme: alt
+      text: Troubleshooting
+      link: /troubleshooting
+  image:
+    src: /images/logo.png
+    alt: Sky Follower Bridge Cover Image
+
+features:
+  - icon: 🔍
+    title: Automatic Profile Matching
+    details: Quickly find your Twitter connections on Bluesky using our smart profile matching system.
+  - icon: 🚀
+    title: Bulk Follow Feature
+    details: Save time by following multiple users at once with our "Follow All" button.
+  - icon: 📋
+    title: Multiple List Support
+    details: Works with Following, Followers, Blocked users lists, and even public Twitter Lists.
+  - icon: 🌐
+    title: Cross-Browser Support
+    details: Available on Chrome, Firefox, and Microsoft Edge for your convenience.
+---
+
+<style>
+:root {
+  --vp-home-hero-name-color: transparent;
+  --vp-home-hero-name-background: -webkit-linear-gradient(120deg, #3399ff 30%, #0066cc);
+
+  --vp-home-hero-image-background-image: linear-gradient(-45deg, #3399ff 50%, #0066cc 50%);
+  --vp-home-hero-image-filter: blur(44px);
+}
+
+.VPImage.image-src {
+  max-width: 180px;
+  max-height: 180px;
+}
+
+@media (min-width: 640px) {
+  :root {
+    --vp-home-hero-image-filter: blur(56px);
+  }
+}
+
+@media (min-width: 960px) {
+  :root {
+    --vp-home-hero-image-filter: blur(68px);
+  }
+}
+</style>

docs/troubleshooting.md

@@ -0,0 +1,101 @@
+# Troubleshooting Guide
+
+🚨 **WIP** 🚨
+
+## Authentication Errors
+
+### Login Issues
+
+**Error Message:**  
+"Error: Invalid identifier or password"
+
+**Checklist:**
+1. Username and Password Entry
+   - Check for any accidental spaces
+   - If copying and pasting, ensure no extra characters were included
+
+2. Username Format
+   - Correct format: `your-username.bsky.social`
+   - Common mistake: `your-username` (missing .bsky.social)
+
+3. Password Information
+   - We strongly recommend using an [App Password](https://bsky.app/settings/app-passwords) instead of your regular password
+   - App Password format: `xxxx-xxxx-xxxx-xxxx` (19 characters)
+   
+::: tip Helpful Tips
+Don't confuse the App Password with the "password name" shown in settings.
+How to create a new App Password:
+2. [Navigate to App Passwords section](https://bsky.app/settings/app-passwords)
+3. Click "Add App Password"
+4. Click "Create App Password"
+4. Copy the generated 19-character password
+:::
+
+### Two-Factor Authentication Required
+
+**Error Message:**  
+"Error: Two-factor authentication required"
+
+**Solution:**
+1. Check your email for the authentication code
+2. Enter the code in the 2FA input field
+3. Try logging in again
+
+## Rate Limit Errors
+
+**Error Message:**  
+"Rate limit Error" message appears
+- A "Restart" button is shown
+
+**Solution:**
+1. Bluesky API has a limit of 1,600 actions per hour. If you hit the limit, please wait for 1 hour before trying again.
+2. Click the "Restart" button to try again
+
+## Page Errors
+
+### Invalid Page
+
+**Error Message:**  
+"Error: Invalid page. please open the 𝕏 following or blocking or list page."
+
+**Solution:**
+Only use the extension on these X (Twitter) pages:
+- Following page (`x.com/<your_handle>/following`)
+- Blocking page (`x.com/settings/blocked/all`)
+- List members page (`x.com/i/lists/<list_id>/members`)
+
+## Scanning Issues
+
+### Scan Stops Early
+
+**Error Message:**  
+Scanning stops before reaching the bottom of the page
+
+**Solution:**
+1. Click "Resume Scanning" to continue
+2. The scan will automatically stop when it reaches the bottom of the page
+3. You can click "Stop Scanning and View Results" at any time
+
+### No Users Found
+
+**Error Message:**  
+No Bluesky users detected after scanning
+
+**Solution:**
+1. Make sure you're logged in correctly
+2. Try scanning again - some users may not be detected on first pass
+3. Check if the X users have linked their Bluesky accounts in their profiles
+
+## Other Issues
+
+If you encounter any unexpected errors:
+
+1. Reload the page
+2. Try the operation again
+3. If the problem persists, you can either:
+   - [Create an issue](https://github.com/kawamataryo/sky-follower-bridge/issues) with:
+     - The exact error message
+     - What you were trying to do
+     - Your browser type and version
+     - Any relevant screenshots
+   - Or mention @kawamataryo.bsky.social on Bluesky