✨ feat: Implement blog home and post components with sidebar and pagination

- Added BlogHome component for displaying posts with sorting options (latest/popular).
- Integrated Sidebar with About, Hot Posts, Tags, and Misskey Iframe components.
- Created BlogPost component to render individual posts with metadata and content.
- Developed GravatarAvatar component for user avatars.
- Implemented Markdown rendering with syntax highlighting and custom code blocks.
- Added pagination component for navigating through posts.
- Enhanced login form with OpenID Connect options and email/password authentication.
- Utility functions for generating post URLs and calculating reading time.

web/src/app/(main)/layout.tsx

@@ -2,9 +2,9 @@
 
 import { motion } from 'framer-motion'
 import { usePathname } from 'next/navigation'
-import { Navbar } from '@/components/navbar'
+import { Navbar } from '@/components/layout/navbar'
 import { BackgroundProvider } from '@/contexts/background-context'
-import Footer from '@/components/footer'
+import Footer from '@/components/layout/footer'
 
 export default function RootLayout({
   children,

web/src/app/(main)/p/[id]/page.tsx

@@ -1,6 +1,6 @@
 import { getPostById } from '@/api/post'
 import { cookies } from 'next/headers'
-import BlogPost from '@/components/blog-post'
+import BlogPost from '@/components/blog-post/blog-post'
 
 interface Props {
   params: Promise<{ id: string }>

web/src/app/(main)/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import BlogHome from "@/components/blog-home";
+import BlogHome from "@/components/blog-home/blog-home";
 
 
 export default function Page(){