🎨 style(ui-prompts): replace green accents with neutral theme colors

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: bidah

apps/web/app/(app)/ui-prompts/page.tsx

@@ -14,7 +14,7 @@ export default async function UiPromptsPage() {
         {/* Hero */}
         <div className="text-center mb-12">
           <h1 className="text-4xl font-bold text-foreground mb-4">
-            UI Prompt Gallery
+            UI Prompts
           </h1>
           <p className="text-muted-foreground text-lg max-w-2xl mx-auto">
             Curated collection of AI prompts that generate beautiful React

apps/web/components/ui-prompts/phone-frame.tsx

@@ -19,7 +19,7 @@ export function PhoneFrame({ src, alt, className }: PhoneFrameProps) {
       style={{ aspectRatio: "9 / 19.5" }}
     >
       {/* Dynamic Island */}
-      <div className="absolute top-3 left-1/2 -translate-x-1/2 z-20 w-[90px] h-[28px] bg-black rounded-full" />
+      <div className="hidden absolute top-3 left-1/2 -translate-x-1/2 z-20 w-[90px] h-[28px] bg-black rounded-full" />
 
       {/* Status Bar */}
       <div className="hidden absolute top-0 left-0 right-0 z-10 flex items-center justify-between px-6 pt-3 pb-1">

apps/web/components/ui-prompts/prompt-card.tsx

@@ -30,7 +30,7 @@ export function PromptCard({
         {/* Featured Badge */}
         {featured && (
           <div className="absolute top-3 left-3 z-10">
-            <Badge className="bg-green-600 text-white border-green-500 hover:bg-green-600">
+            <Badge className="bg-foreground text-background border-foreground/80 hover:bg-foreground">
               Featured
             </Badge>
           </div>
@@ -46,7 +46,7 @@ export function PromptCard({
         </div>
 
         {/* Title */}
-        <h3 className="text-foreground font-medium truncate group-hover:text-green-600 dark:group-hover:text-green-400 transition-colors">
+        <h3 className="text-foreground font-medium truncate group-hover:text-muted-foreground transition-colors">
           {title}
         </h3>
 

apps/web/components/ui-prompts/screenshot-gallery.tsx

@@ -48,7 +48,7 @@ export function ScreenshotGallery({
                 onClick={() => setActiveIndex(index)}
                 className={`flex-shrink-0 w-12 h-24 rounded-lg overflow-hidden border-2 transition-colors ${
                   index === activeIndex
-                    ? "border-green-500"
+                    ? "border-foreground"
                     : "border-border hover:border-primary/50"
                 }`}
               >