refactor and rename page and components file name

Author: developermithu

components.json

@@ -5,7 +5,7 @@
     "tsx": false,
     "tailwind": {
         "config": "",
-        "css": "src/app/styles/global.css",
+        "css": "src/app/styles/app.css",
         "baseColor": "neutral",
         "cssVariables": true,
         "prefix": ""

next.config.mjs

@@ -7,6 +7,7 @@ const nextConfig = {
                 hostname: 'placehold.co',
             },
         ],
+        dangerouslyAllowSVG: true,
     },
 };
 

src/app/layout.jsx

@@ -1,7 +1,7 @@
 import { Footer } from '@/components/Footer';
 import { Header } from '@/components/Header';
 import { Inter } from 'next/font/google';
-import './styles/global.css';
+import './styles/app.css';
 
 const inter = Inter({ subsets: ['latin'] });
 

src/app/page.jsx

@@ -1,7 +1,7 @@
 import { ArrowRight } from 'lucide-react';
 import Link from 'next/link';
 
-import { BlogPostCard } from '@/components/posts/BlogPostCard';
+import { PostCard } from '@/components/posts/PostCard';
 import { FeaturedPost } from '@/components/posts/FeaturedPost';
 import { Button } from '@/components/ui/button';
 
@@ -83,7 +83,7 @@ export default function Home() {
                 <h2 className="mb-8 text-2xl font-bold tracking-tight">Recent Articles</h2>
                 <div className="grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3">
                     {recentPosts.map((post) => (
-                        <BlogPostCard key={post.id} post={post} />
+                        <PostCard key={post.id} post={post} />
                     ))}
                 </div>
             </section>

src/app/styles/global.css renamed to src/app/styles/app.css

@@ -6,7 +6,7 @@ import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Badge } from '@/components/ui/badge';
 import { Card, CardFooter, CardHeader } from '@/components/ui/card';
 
-export function BlogPostCard({ post }) {
+export function PostCard({ post }) {
     return (
         <Card className="flex h-full flex-col overflow-hidden">
             <div className="relative h-48 w-full">