fix: Fix image style

re-taro · Dec 16, 2022 · 932f7f6 · 932f7f6
1 parent 05d57df
commit 932f7f6
Showing 1 changed file with 11 additions and 1 deletion.
diff --git a/src/pages/edit/[id].tsx b/src/pages/edit/[id].tsx
@@ -6,6 +6,7 @@ import {
   HStack,
   useDisclosure,
   Input,
+  AspectRatio,
 } from "@chakra-ui/react";
 import type { NextPageWithLayout } from "next";
 import { useRouter } from "next/router";
@@ -148,7 +149,16 @@ const Edit: NextPageWithLayout = () => {
         />
 
         {imageUrl ? (
-          <Image width={128} height={128} src={imageUrl} alt="Preview Image" />
+          <Box w="full">
+            <AspectRatio ratio={16 / 9}>
+              <Image
+                fill
+                style={{ objectFit: "contain" }}
+                src={imageUrl}
+                alt="Preview Image"
+              />
+            </AspectRatio>
+          </Box>
         ) : null}
       </Modal>
     </Box>