add: toast + change bottom text color

Shobhit-Nagpal · Aug 10, 2024 · a96cc63 · a96cc63
1 parent 2542c3e
commit a96cc63
Show file tree

Hide file tree

Showing 8 changed files with 684 additions and 41 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -12,6 +12,7 @@
     "@hookform/resolvers": "^3.9.0",
     "@radix-ui/react-label": "^2.1.0",
     "@radix-ui/react-slot": "^1.1.0",
+    "@radix-ui/react-toast": "^1.2.1",
     "canvas": "^2.11.2",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",

diff --git a/src/app/api/generate/route.ts b/src/app/api/generate/route.ts
@@ -46,11 +46,12 @@ export async function POST(req: NextRequest) {
     ctx.fillText(pullRequests.toString() + " PRs", certificateImg.width * 0.57, certificateImg.height * 0.30);
     ctx.fillText(score.toString() + " pts", certificateImg.width * 0.64, certificateImg.height * 0.30);
 
-    ctx.font = 'bold 24px Arial';
-    ctx.fillText(rank.toString(), certificateImg.width * 0.235, certificateImg.height * 0.76);
-    ctx.fillText(score.toString(), certificateImg.width * 0.435, certificateImg.height * 0.76);
-    ctx.fillText(pullRequests.toString(), certificateImg.width * 0.670, certificateImg.height * 0.76);
-    ctx.fillText(badges.toString(), certificateImg.width * 0.875, certificateImg.height * 0.76);
+    ctx.font = 'bold 20px Arial';
+    ctx.fillStyle = 'white';
+    ctx.fillText(rank.toString(), certificateImg.width * 0.235, certificateImg.height * 0.758);
+    ctx.fillText(score.toString(), certificateImg.width * 0.435, certificateImg.height * 0.758);
+    ctx.fillText(pullRequests.toString(), certificateImg.width * 0.670, certificateImg.height * 0.758);
+    ctx.fillText(badges.toString(), certificateImg.width * 0.875, certificateImg.height * 0.758);
 
     const buffer = canvas.toBuffer('image/png');
 

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,5 +1,6 @@
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
+import { Toaster } from "@/components/ui/toaster";
 import "./globals.css";
 
 const inter = Inter({ subsets: ["latin"] });
@@ -16,7 +17,10 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en">
-      <body className={inter.className}>{children}</body>
+      <body className={inter.className}>
+        {children}
+        <Toaster />
+      </body>
     </html>
   );
 }