From 9a491c6dd52901c235457cd6724a6c2020d8b49d Mon Sep 17 00:00:00 2001
From: maretol <maretol@outlook.com>
Date: Tue, 14 Jan 2025 22:39:43 +0900
Subject: [PATCH] =?UTF-8?q?modal=E3=81=AE=E3=82=B5=E3=82=A4=E3=82=BA?=
 =?UTF-8?q?=E3=81=A8=E3=81=8B=E8=89=B2=E3=81=A8=E3=81=8B=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../blog/[article_id]/@modal/(.)image/[src]/modal.tsx  | 10 +++++-----
 pages/components/ui/dialog.tsx                         |  4 ++--
 pages/lib/api/workers.ts                               |  4 ++--
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/pages/app/blog/[article_id]/@modal/(.)image/[src]/modal.tsx b/pages/app/blog/[article_id]/@modal/(.)image/[src]/modal.tsx
index 4096537..fdafcc4 100644
--- a/pages/app/blog/[article_id]/@modal/(.)image/[src]/modal.tsx
+++ b/pages/app/blog/[article_id]/@modal/(.)image/[src]/modal.tsx
@@ -17,16 +17,16 @@ export default function Modal({ imageSrc }: { imageSrc: string }) {
   )
   return (
     <Dialog defaultOpen onOpenChange={onClose}>
-      <DialogContent className="w-max h-max m-0 p-0">
+      <DialogContent className="max-w-[96dvw] max-h-[96dvh] h-auto w-auto m-0 py-10 px-0 bg-blue-300 bg-opacity-30 border-0">
         <DialogTitle></DialogTitle>
         <DialogDescription></DialogDescription>
-        <div className="flex justify-center items-center p-0 m-0 overflow-hidden">
+        <div className="p-2 w-max h-max">
           <ClientImage
             src={imageSrc}
             alt=""
-            width={1000}
-            height={1000}
-            className="my-10 w-full max-w-fit h-full max-h-fit shadow-lg"
+            width={100}
+            height={100}
+            className="h-fit w-auto max-h-[95dvh] shadow-lg overflow-contain"
           />
         </div>
       </DialogContent>
diff --git a/pages/components/ui/dialog.tsx b/pages/components/ui/dialog.tsx
index 3c86f94..40c848d 100644
--- a/pages/components/ui/dialog.tsx
+++ b/pages/components/ui/dialog.tsx
@@ -31,14 +31,14 @@ const DialogContent = React.forwardRef<
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
-        'fixed left-[50%] top-[50%] max-h-full max-w-full w-max z-50 flex justify-center items-center translate-x-[-50%] translate-y-[-50%] border bg-background shadow-lg duration-200',
+        'fixed left-[50%] top-[50%] max-h-full max-w-full h-auto w-auto z-50 flex justify-center items-center translate-x-[-50%] translate-y-[-50%] border bg-background shadow-lg duration-200',
         className
       )}
       {...props}
     >
       {children}
       <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
-        <X className="h-4 w-4" />
+        <X className="h-8 w-8" />
         <span className="sr-only">Close</span>
       </DialogPrimitive.Close>
     </DialogPrimitive.Content>
diff --git a/pages/lib/api/workers.ts b/pages/lib/api/workers.ts
index 4ac01be..9d8027c 100644
--- a/pages/lib/api/workers.ts
+++ b/pages/lib/api/workers.ts
@@ -44,8 +44,8 @@ async function getOGPDataOrigin(targetURL: string) {
   }
 
   // 成功時はcacheに保存する
-  // 有効期限は3日。devのときは1秒
-  const expirationTtl = dev ? 1 : 60 * 60 * 24 * 3
+  // 有効期限は3日。devのときは60秒
+  const expirationTtl = dev ? 60 : 60 * 60 * 24 * 3
   await env.OGP_FETCHER_CACHE.put(targetURL, JSON.stringify(data), { expirationTtl })
 
   return data