feat: enhance image handling and layout adjustments

- Added image quality settings and device sizes in next.config.ts for better image optimization.
- Updated package dependencies, including cheerio and baseline-browser-mapping.
- Improved global styles for blog content images to ensure responsiveness.
- Refactored button components for consistent sizing and styling across the application.
- Enhanced blog post card layout with new variants and improved author name formatting.
- Adjusted hero section and content layout for better visual appeal and user experience.

components/theme-toggle.tsx

@@ -18,8 +18,7 @@ export function ThemeToggle() {
     return (
       <Button
         variant="ghost"
-        size="sm"
-        className="size-9 rounded-lg"
+        size="icon"
         aria-label="Toggle theme"
       >
         <Sun className="size-4" />
@@ -30,9 +29,8 @@ export function ThemeToggle() {
   return (
     <Button
       variant="ghost"
-      size="sm"
+      size="icon"
       onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
-      className="size-9 rounded-lg transition-all duration-300 hover:bg-muted"
       aria-label="Toggle theme"
     >
       <Sun className="size-4 rotate-0 scale-100 transition-all duration-300 dark:-rotate-90 dark:scale-0" />