UPDATE: NEw ui
All checks were successful
Gitea Auto Deploy / Deploy-Container (push) Successful in 55s
All checks were successful
Gitea Auto Deploy / Deploy-Container (push) Successful in 55s
This commit is contained in:
@@ -408,20 +408,20 @@
|
|||||||
"https://starrail.honeyhunterworld.com/img/eidolon/vincit-omnia-veritas-eidolon_icon_small.webp"
|
"https://starrail.honeyhunterworld.com/img/eidolon/vincit-omnia-veritas-eidolon_icon_small.webp"
|
||||||
],
|
],
|
||||||
"1306": [
|
"1306": [
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/suspension-of-disbelief-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/suspension-of-disbelief-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/purely-fictitious-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/purely-fictitious-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/pipedream-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/pipedream-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/life-is-a-gamble-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/life-is-a-gamble-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/parallax-truth-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/parallax-truth-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/narrative-polysemy-eidolon-2_icon_small.webp"
|
"https://starrail.honeyhunterworld.com/img/eidolon/narrative-polysemy-eidolon_icon_small.webp"
|
||||||
],
|
],
|
||||||
"1307": [
|
"1307": [
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/seven-pillars-of-wisdom-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/seven-pillars-of-wisdom-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/weep-not-for-me-my-lamb-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/weep-not-for-me-my-lamb-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/as-above-so-below-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/as-above-so-below-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/in-tears-we-gift-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/in-tears-we-gift-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/linnutee-flyway-eidolon-2_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/linnutee-flyway-eidolon_icon_small.webp",
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/pantheon-merciful-masses-pitiful-eidolon-2_icon_small.webp"
|
"https://starrail.honeyhunterworld.com/img/eidolon/pantheon-merciful-masses-pitiful-eidolon_icon_small.webp"
|
||||||
],
|
],
|
||||||
"1308": [
|
"1308": [
|
||||||
"https://starrail.honeyhunterworld.com/img/eidolon/silenced-sky-spake-sooth-eidolon_icon_small.webp",
|
"https://starrail.honeyhunterworld.com/img/eidolon/silenced-sky-spake-sooth-eidolon_icon_small.webp",
|
||||||
|
|||||||
@@ -59,7 +59,6 @@ export default function ShowCaseInfo() {
|
|||||||
});
|
});
|
||||||
}, [avatarSelected, locale, transI18n]);
|
}, [avatarSelected, locale, transI18n]);
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!avatarSelected?.id) return;
|
if (!avatarSelected?.id) return;
|
||||||
const fac = new FastAverageColor();
|
const fac = new FastAverageColor();
|
||||||
@@ -570,30 +569,68 @@ export default function ShowCaseInfo() {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|
||||||
<div className="absolute top-4 left-4">
|
<div className="absolute top-4 left-3">
|
||||||
{avatarSelected && avatarInfo && avatarData?.data && typeof avatarData?.data?.rank === "number" && (
|
{avatarSelected && avatarInfo && avatarData?.data && typeof avatarData?.data?.rank === "number" && (
|
||||||
<div className="flex flex-col">
|
<div className="flex flex-col items-center gap-2 py-2">
|
||||||
{avatarInfo?.RankIcon?.map((src, index) => {
|
{avatarInfo?.RankIcon?.map((src, index) => {
|
||||||
const isActive = avatarData?.data?.rank > index;
|
const isActive = avatarData?.data?.rank > index;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div key={index} className="relative my-1 flex rounded-full">
|
<div
|
||||||
<NextImage
|
key={index}
|
||||||
src={src ?? null}
|
className="relative flex items-center justify-center"
|
||||||
alt="Rank Icon"
|
style={{
|
||||||
width={50}
|
transition: "transform 0.3s ease, filter 0.3s ease",
|
||||||
height={50}
|
}}
|
||||||
className="h-auto w-12 transition-all duration-300 ease-in-out p-px rounded-full"
|
>
|
||||||
|
|
||||||
|
{isActive && (
|
||||||
|
<div
|
||||||
|
className="absolute inset-0 rounded-full pointer-events-none"
|
||||||
|
style={{
|
||||||
|
background: "radial-gradient(circle, rgba(250,204,21,0.35) 0%, transparent 70%)",
|
||||||
|
filter: "blur(6px)",
|
||||||
|
zIndex: 0,
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<div
|
||||||
|
className="relative rounded-full p-[2.5px]"
|
||||||
style={{
|
style={{
|
||||||
opacity: isActive ? 1 : 0.6,
|
background: isActive
|
||||||
filter: isActive
|
? "linear-gradient(135deg, #facc15, #f59e0b, #facc15)"
|
||||||
? 'grayscale(0) drop-shadow(0 0 8px rgba(255,215,0,0.5))'
|
: "rgba(255,255,255,0.15)",
|
||||||
: 'grayscale(1)',
|
boxShadow: isActive
|
||||||
border: '2px solid',
|
? "0 0 10px rgba(250,204,21,0.5), 0 0 24px rgba(250,204,21,0.2)"
|
||||||
borderColor: isActive ? '#facc15' : '#ffffff', // tailwind yellow-400 = #facc15
|
: "0 2px 6px rgba(0,0,0,0.4)",
|
||||||
boxShadow: isActive ? '0 0 10px rgba(250,204,21,0.5)' : undefined, // mimic shadow-yellow-400/50
|
transition: "background 0.3s ease, box-shadow 0.3s ease",
|
||||||
|
zIndex: 1,
|
||||||
}}
|
}}
|
||||||
/>
|
>
|
||||||
|
<div
|
||||||
|
className="rounded-full overflow-hidden"
|
||||||
|
style={{
|
||||||
|
padding: "2px",
|
||||||
|
background: "#1e2230",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<NextImage
|
||||||
|
src={src ?? null}
|
||||||
|
alt="Rank Icon"
|
||||||
|
width={48}
|
||||||
|
height={48}
|
||||||
|
className="block rounded-full object-cover"
|
||||||
|
style={{
|
||||||
|
width: "44px",
|
||||||
|
height: "44px",
|
||||||
|
filter: isActive
|
||||||
|
? "grayscale(0) brightness(1.05) saturate(1.1)"
|
||||||
|
: "grayscale(0.7) brightness(0.55)",
|
||||||
|
transition: "filter 0.3s ease",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
|
|||||||
Reference in New Issue
Block a user