Fix variant images being very duplicated

KSET · Aug 14, 2023 · 10cc3e6 · 10cc3e6
1 parent 7f98ace
commit 10cc3e6
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git a/src/components/base/aspect-ratio.tsx b/src/components/base/aspect-ratio.tsx
@@ -17,8 +17,8 @@ const AspectRatio: FC<AspectRatioProps> = (props) => {
     <div
       className="relative w-full"
       style={{
-        ...props.style,
         paddingBottom: `${100 / ratio}%`,
+        aspectRatio: ratio,
       }}
     >
       <div

diff --git a/src/components/base/image/variant-image/index.tsx b/src/components/base/image/variant-image/index.tsx
@@ -1,7 +1,11 @@
 import { type FC } from "react";
 
 import { cn } from "~/utils/class";
-import { src as imgSrc, urlVariants } from "~/utils/kset-image";
+import {
+  DefaultUrlVariants,
+  src as imgSrc,
+  urlVariant,
+} from "~/utils/kset-image";
 
 import AppImage, { type AppImageProps } from "../app-image";
 
@@ -27,7 +31,7 @@ const VariantImage: FC<
       aspect={{
         ratio,
         style: {
-          backgroundImage: urlVariants(src),
+          backgroundImage: urlVariant(src, DefaultUrlVariants.Thumb),
           ...aspect?.style,
         },
         ...aspect,