fix: replace phosphor for lucide

Author: pheralb

website/app/components/sidebar.tsx

@@ -2,7 +2,7 @@ import { Link, useLocation } from '@remix-run/react';
 
 import { DocsRoutes } from '@/docs.routes';
 import { cn } from '@/utils/index';
-import { ArrowUpRight } from '@phosphor-icons/react';
+import { ArrowUpRight } from 'lucide-react';
 
 const SidebarContent = () => {
   const location = useLocation();
@@ -51,7 +51,7 @@ const SidebarContent = () => {
           className="flex items-center py-1 text-neutral-600 transition-colors duration-100 hover:text-black dark:text-neutral-400 dark:decoration-neutral-700 dark:hover:text-white"
         >
           <span>Create an issue</span>
-          <ArrowUpRight height={10} />
+          <ArrowUpRight height={14} />
         </a>
       </div>
     </nav>

website/app/components/theme-toggle.tsx

@@ -1,4 +1,4 @@
-import { Moon, Sun } from '@phosphor-icons/react';
+import { Moon, Sun } from 'lucide-react';
 import { Theme, useTheme } from 'remix-themes';
 
 import {
@@ -16,7 +16,11 @@ export function ModeToggle() {
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
         <Button variant="ghost" size="icon">
-          {theme === Theme.LIGHT ? <Moon size={20} /> : <Sun size={20} />}
+          {theme === Theme.LIGHT ? (
+            <Moon size={22} strokeWidth={1.5} />
+          ) : (
+            <Sun size={22} strokeWidth={1.5} />
+          )}
           <span className="sr-only">Toggle theme</span>
         </Button>
       </DropdownMenuTrigger>

website/app/routes/_index.tsx

@@ -2,7 +2,7 @@ import type { MetaFunction } from '@vercel/remix';
 import { useToast } from '@pheralb/toast';
 import { SparkleCard } from '@/ui/sparkle-card';
 import { Button } from '@/ui/button';
-import { Sparkle } from '@phosphor-icons/react';
+import { Sparkles } from 'lucide-react';
 
 export const meta: MetaFunction = () => {
   return [
@@ -35,7 +35,7 @@ export default function Index() {
               })
             }
           >
-            <Sparkle height={14} width={14} />
+            <Sparkles height={14} width={14} />
             <span>Render a toast</span>
           </Button>
           <Button

website/app/ui/dropdown-menu.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
-import { Check, ArrowRight, CheckCircle } from '@phosphor-icons/react';
+import { Check, ArrowRight, CheckCircle } from 'lucide-react';
 
 import { cn } from '@/utils';