added noise

sitcon-tw · Mar 7, 2024 · 7af3eb0 · 7af3eb0
1 parent 7b6172e
commit 7af3eb0
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 5 deletions.
diff --git a/public/noise.svg b/public/noise.svg
diff --git a/src/app/(game)/puzzle/Coupon.tsx b/src/app/(game)/puzzle/Coupon.tsx
@@ -43,7 +43,7 @@ export function Coupon({
         </div>
         {taken && <Taken />}
       </div>
-      <div className="flex items-center gap-2 rounded-xl bg-black/5 p-3 text-sm text-gray-600">
+      <div className="bg-noise flex items-center gap-2 rounded-xl bg-black/5 p-3 text-sm text-gray-600">
         <Info size={20} className="shrink-0" />
         <div>
           每人僅限兌換乙次抽獎券，至服務台兌換後即不得再繼續累積拼圖和更多抽獎券。

diff --git a/src/components/Dialog.tsx b/src/components/Dialog.tsx
@@ -13,7 +13,7 @@ export default function Dialog({
   return (
     <Drawer.Root open={isopen} onOpenChange={setOpen}>
       <Drawer.Portal>
-        <Drawer.Overlay className="fixed inset-0 z-50 bg-black/40 backdrop-blur" />
+        <Drawer.Overlay className="bg-noise fixed inset-0 z-50 bg-black/40 backdrop-blur" />
         <Drawer.Content className="fixed bottom-0 left-0 right-0 z-50 mt-24 flex h-max max-h-[90vh] flex-col rounded-t-[10px] bg-[#F8F3E8]">
           <div className="m-auto mt-3 h-1.5 w-20 rounded-full bg-black/20" />
           <div className="max-h-[80vh] overflow-y-auto">{children}</div>

diff --git a/tailwind.config.ts b/tailwind.config.ts
@@ -1,9 +1,7 @@
 import type { Config } from "tailwindcss";
 
 const config: Config = {
-  content: [
-    "./src/**/*.{js,ts,jsx,tsx,mdx}",
-  ],
+  content: ["./src/**/*.{js,ts,jsx,tsx,mdx}"],
   theme: {
     extend: {
       colors: {
@@ -23,6 +21,9 @@ const config: Config = {
         sans: ["Lato", "Noto Sans TC", "sans-serif"],
         rubik: ["Rubik", "Noto Sans TC", "sans-serif"],
       },
+      backgroundImage: {
+        noise: `url(/noise.svg)`,
+      },
     },
   },
   plugins: [],