UPDATE: Update readme and Next 16.07 (CVE-2025-66478)

src/components/card/characterCard.tsx

@@ -0,0 +1,68 @@
+"use client";
+
+import { getNameChar } from '@/helper';
+import useLocaleStore from '@/stores/localeStore';
+import { CharacterBasic } from '@/types';
+import ParseText from '../parseText';
+import Image from 'next/image';
+
+interface CharacterCardProps {
+  data: CharacterBasic
+}
+
+export default function CharacterCard({ data }: CharacterCardProps) {
+  const { locale } = useLocaleStore();
+  const text = getNameChar(locale, data)
+  return (
+    <li 
+    className="z-10 flex flex-col items-center rounded-xl shadow-xl 
+               bg-linear-to-br from-base-300 via-base-100 to-warning/70
+               transform transition-transform duration-300 ease-in-out 
+               hover:scale-105 cursor-pointer min-h-[170px] sm:min-h-[180px] md:min-h-[210px] lg:min-h-[220px] xl:min-h-[240px] 2xl:min-h-[340px]"
+    >
+      <div
+        className={`w-full rounded-md bg-linear-to-br ${data.rank === "CombatPowerAvatarRarityType5"
+          ? "from-yellow-400 via-yellow-600/70 to-yellow-800/50"
+          : "from-purple-400 via-purple-600/70 to-purple-800/50"
+          }`}
+      >
+
+        <div className="relative w-full h-full">
+          <Image
+            width={376}
+            height={512}
+            src={`https://api.hakush.in/hsr/UI/avatarshopicon/${data.id}.webp`}
+            priority={true}
+            className="w-full h-full rounded-md object-cover"
+            alt="ALT"
+          />
+          <Image
+            width={32}
+            height={32}
+      
+            src={`/icon/${data.damageType.toLowerCase()}.webp`}
+            className="absolute top-0 left-0 w-6 h-6 rounded-full"
+            alt={data.damageType.toLowerCase()}
+          />
+          <Image
+            width={32}
+            height={32}
+            src={`/icon/${data.baseType.toLowerCase()}.webp`}
+            className="absolute top-0 right-0 w-6 h-6 rounded-full"
+            alt={data.baseType.toLowerCase()}
+            style={{
+              boxShadow: "inset 0 0 8px 4px #9CA3AF"
+            }}
+          />
+        </div>
+      </div>
+
+      <ParseText
+        locale={locale}
+        text={text}
+        className="mt-2 px-1 text-center text-shadow-white font-bold leading-tight text-sm sm:text-base 2xl:text-lg"
+      />
+    </li>
+
+  );
+}