diff --git a/src/assets/animations/logoanimation.json b/src/assets/animations/logo.json
similarity index 100%
rename from src/assets/animations/logoanimation.json
rename to src/assets/animations/logo.json
diff --git a/src/components/LogoAnimation.tsx b/src/components/LogoAnimation.tsx
index 38b9f63..3a51d2b 100644
--- a/src/components/LogoAnimation.tsx
+++ b/src/components/LogoAnimation.tsx
@@ -1,7 +1,7 @@
import { VStack } from "panda/jsx";
import { type ReactElement } from "react";
import LottiePlayer from "./LottiePlayer";
-import logoAnimation from "@/assets/animations/logoAnimation.json";
+import logoAnimation from "@/assets/animations/logo.json";
export function LogoAnimation(): ReactElement {
return (
diff --git a/src/components/LottiePlayer.tsx b/src/components/LottiePlayer.tsx
index 8e508b0..04549fc 100644
--- a/src/components/LottiePlayer.tsx
+++ b/src/components/LottiePlayer.tsx
@@ -23,7 +23,7 @@ export default function LottiePlayer({
const _stopAtEnd = stopAtEnd ?? false;
useEffect(() => {
- if (_stopAtEnd && lottieState) {
+ if (_stopAtEnd && lottieState != null) {
const lastFrame = lottieState.totalFrames - 1;
lottieState.addEventListener("complete", () => {
@@ -44,11 +44,11 @@ export default function LottiePlayer({
return (
{
setLottieState(instance);
}}
onEvent={eventHandler}
- loop={!_stopAtEnd}
style={{
height: "100%",
}}
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index 8268686..a79af74 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -7,9 +7,9 @@ import headerLeft from "@/assets/svg/background/header-left.svg";
import headerRight from "@/assets/svg/background/header-right.svg";
import wakaba from "@/assets/svg/background/wakaba.svg";
import wakabaIcon from "@/assets/svg/icon/wakaba.svg";
+import { LogoAnimation } from "@/components/LogoAnimation";
import { Button } from "@/components/cva/Button";
import { Expanded } from "@/components/cva/Expanded";
-import { LogoAnimation } from "@/components/LogoAnimation";
export const Route = createFileRoute("/")({
component: () => {
@@ -61,14 +61,13 @@ export const Route = createFileRoute("/")({
backgroundColor="white"
display="grid"
duration="1000"
- slideInX="-10"
height={{
base: "50vh",
sm: "50vh",
-
lg: "50vh",
xl: "50vh",
}}
+ slideInX="-10"
style={{
position: "relative",
backgroundImage: `url("${headerLeft}")`,
@@ -79,8 +78,8 @@ export const Route = createFileRoute("/")({
>
@@ -110,9 +109,9 @@ export const Route = createFileRoute("/")({
ref={ref1}
display="grid"
fadeIn="2"
- slideInX="100"
height={{ base: "400px", sm: "600px", lg: "40vh", xl: "60vh" }}
placeItems="center"
+ slideInX="100"
style={{
backgroundImage: `url("${wakabaIcon}"), url("${decorationRight}")`,
backgroundSize: "auto 15%, auto 15%",