diff --git a/src/app/globals.css b/src/app/globals.css index 0d5905b..4e09648 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -29,11 +29,13 @@ --chart-3: 197 37% 24%; --chart-4: 43 74% 66%; --chart-5: 27 87% 67%; - --color-1: 0 100% 63%; - --color-2: 270 100% 63%; - --color-3: 210 100% 63%; - --color-4: 195 100% 63%; - --color-5: 90 100% 63%; + /* Apple retro colors (1977-1999 logo) */ + --color-1: 107 48% 50%; /* green #61bb46 */ + --color-2: 42 98% 57%; /* yellow #fdb827 */ + --color-3: 28 91% 54%; /* orange #f5821f */ + --color-4: 358 73% 55%; /* red #e03a3e */ + --color-5: 300 42% 41%; /* purple #963d97 */ + --color-6: 197 100% 43%; /* blue #009ddc */ } .dark { @@ -61,11 +63,13 @@ --chart-3: 30 80% 55%; --chart-4: 280 65% 60%; --chart-5: 340 75% 55%; - --color-1: 180 100% 63%; - --color-2: 270 100% 63%; - --color-3: 210 100% 63%; - --color-4: 195 100% 63%; - --color-5: 90 100% 63%; + /* Apple retro colors (1977-1999 logo) */ + --color-1: 107 48% 50%; /* green #61bb46 */ + --color-2: 42 98% 57%; /* yellow #fdb827 */ + --color-3: 28 91% 54%; /* orange #f5821f */ + --color-4: 358 73% 55%; /* red #e03a3e */ + --color-5: 300 42% 41%; /* purple #963d97 */ + --color-6: 197 100% 43%; /* blue #009ddc */ } * { diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 6cd7303..3da6815 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -47,7 +47,7 @@ export default function RootLayout({ children: React.ReactNode; }>) { return ( - + {children} diff --git a/src/app/page.tsx b/src/app/page.tsx index fd17d10..52f6a88 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -3,8 +3,8 @@ import { DotPattern } from "@/components/ui/dot-pattern"; export default function Home() { return ( -
- +
+
diff --git a/src/components/app-preview-container.tsx b/src/components/app-preview-container.tsx index 05f6acd..bfc5833 100644 --- a/src/components/app-preview-container.tsx +++ b/src/components/app-preview-container.tsx @@ -5,6 +5,16 @@ import { UploadButtonProvider } from "@/components/providers/upload-button-provi import VideoConvertFlow from "@/components/video-convert/VideoConvertFlow"; import { Confetti, type ConfettiRef } from "./ui/confetti"; +// Apple retro rainbow colors (1977-1999 logo) +const APPLE_CONFETTI_COLORS = [ + "#61bb46", // green + "#fdb827", // yellow + "#f5821f", // orange + "#e03a3e", // red + "#963d97", // purple + "#009ddc", // blue +]; + export default function AppPreviewContainer() { const confettiRef = useRef(null); const [isMounted, setIsMounted] = useState(false); @@ -14,7 +24,12 @@ export default function AppPreviewContainer() { }, []); const handleConversionComplete = () => { - confettiRef.current?.fire(); + confettiRef.current?.fire({ + colors: APPLE_CONFETTI_COLORS, + particleCount: 100, + spread: 70, + origin: { y: 0.6 }, + }); }; if (!isMounted) { @@ -22,7 +37,7 @@ export default function AppPreviewContainer() {
-
+
diff --git a/src/components/terminal-buttons.tsx b/src/components/terminal-buttons.tsx index fe4a754..5a56cf9 100644 --- a/src/components/terminal-buttons.tsx +++ b/src/components/terminal-buttons.tsx @@ -4,7 +4,6 @@ import { AnimatedUploadButton } from "@/components/ui/animated-upload-button"; import { BMCButton } from "@/components/ui/bmc-button"; import { Button } from "@/components/ui/button"; import { RainbowButton } from "@/components/ui/rainbow-button"; -import { cn } from "@/lib/utils"; import type { Button as ButtonType } from "@/types/terminal"; interface TerminalButtonsProps { @@ -75,15 +74,14 @@ export function TerminalButtons({ ); } + // Use variant from button config, fallback to outline for restart, default otherwise + const variant = button.variant ?? (button.action === "restart" ? "outline" : "default"); + return (
); } diff --git a/src/components/ui/rainbow-button.tsx b/src/components/ui/rainbow-button.tsx index 9aeb2b2..20afe1d 100644 --- a/src/components/ui/rainbow-button.tsx +++ b/src/components/ui/rainbow-button.tsx @@ -10,12 +10,10 @@ export const RainbowButton = ({ className, children, ...props }: RainbowButtonPr