From 396d6c8a416a4cdbd0f6d440c9123185d45f5dc5 Mon Sep 17 00:00:00 2001
From: "wkylin.w@gmail.com" <wkylin.w@gmail.com>
Date: Wed, 15 Jan 2025 10:40:47 +0800
Subject: [PATCH] feat: meteors and sparkles

---
 src/pages/home/index.jsx | 33 ++++++++++++++++++++++++++++++++-
 1 file changed, 32 insertions(+), 1 deletion(-)

diff --git a/src/pages/home/index.jsx b/src/pages/home/index.jsx
index 0fd46729..969edc38 100644
--- a/src/pages/home/index.jsx
+++ b/src/pages/home/index.jsx
@@ -49,7 +49,7 @@ import TextLoader from '@stateless/TextLoader'
 import BackgroundBoxes from '@stateless/BackgroundBoxes'
 import TypeWriter from '@stateless/TypeWriter'
 import SlideText from '@stateless/SlideText'
-// import SparklesCore from '@stateless/Sparkles'
+import SparklesCore from '@stateless/Sparkles'
 
 import firstImage from '@assets/images/88-300x160.jpg'
 import secondImage from '@assets/images/2-300x160.jpg'
@@ -304,6 +304,37 @@ const Home = () => {
           ]}
         />
       </section>
+      <section
+        style={{
+          marginBottom: 15,
+          fontSize: 20,
+          height: 200,
+          width: 360,
+          background: '#111827',
+          position: 'relative',
+          overflow: 'hidden',
+        }}
+      >
+        <Meteors number={40} />
+      </section>
+      <section
+        style={{
+          marginBottom: 15,
+          fontSize: 20,
+          height: 200,
+          width: 360,
+          background: '#111827',
+        }}
+      >
+        <SparklesCore
+          background="transparent"
+          minSize={0.4}
+          maxSize={1}
+          particleDensity={1200}
+          className="w-full h-full"
+          particleColor="#FFFFFF"
+        />
+      </section>
       <section
         style={{
           marginBottom: 15,