style: format code with Prettier and StandardJS

This commit fixes the style issues introduced in 008b20b according to the output
from Prettier and StandardJS.

Details: None

src/components/container/masonryContainer/index.jsx

@@ -5,25 +5,25 @@ const Masonry = () => {
   const masonryContainer = useMasonry()
   return (
     <div
-      className="mx-auto grid max-w-sm items-start gap-6 sm:max-w-none sm:grid-cols-2 lg:grid-cols-3"
+      className='mx-auto grid max-w-sm items-start gap-6 sm:max-w-none sm:grid-cols-2 lg:grid-cols-3'
       ref={masonryContainer}
     >
-      <div className="relative rounded-xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 140 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 80 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 150 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 120 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 130 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-gradient-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-sm transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[background:linear-gradient(to_right,theme(colors.gray.800),theme(colors.gray.700),theme(colors.gray.800))_border-box] before:[mask-composite:exclude_!important] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 50 }}>我的中国心</div>
       </div>
     </div>

src/components/hooks/useInViewport/index.jsx

@@ -37,7 +37,7 @@ const useInViewport = (triggerOnce = false, threshold = 0, rootMargin = '0px') =
 
   return {
     inViewRef,
-    inViewport,
+    inViewport
   }
 }
 

src/components/hooks/useScrollIntoView/index.jsx

@@ -26,14 +26,14 @@ const useScrollIntoView = ({ offset = 0 }) => {
       if (shouldScrollY) {
         window.scrollTo({
           top: shouldScrollY ? adjustedTop : scrollTop,
-          behavior: 'smooth',
+          behavior: 'smooth'
         })
       }
 
       if (shouldScrollX) {
         window.scrollTo({
           left: shouldScrollX ? adjustedLeft : scrollLeft,
-          behavior: 'smooth',
+          behavior: 'smooth'
         })
       }
 
@@ -49,7 +49,7 @@ const useScrollIntoView = ({ offset = 0 }) => {
 
   return {
     scrollIntoView,
-    targetRef,
+    targetRef
   }
 }
 

src/components/hooks/useWindowScroll/index.jsx

@@ -4,14 +4,14 @@ const useWindowScroll = () => {
   // 用于存储窗口滚动位置的状态
   const [scroll, setScroll] = useState({
     x: window.pageXOffset,
-    y: window.pageYOffset,
+    y: window.pageYOffset
   })
 
   // 用于更新滚动位置状态的函数
   const handleScroll = () => {
     setScroll({
       x: window.pageXOffset,
-      y: window.pageYOffset,
+      y: window.pageYOffset
     })
   }
 
@@ -30,7 +30,7 @@ const useWindowScroll = () => {
     setScroll: (newScroll) => {
       window.scrollTo(newScroll.x, newScroll.y)
       setScroll(newScroll)
-    },
+    }
   }
 }
 

src/components/stateless/AnimateOnScreen/index.jsx

@@ -38,7 +38,7 @@ const AnimateIn = ({ from, to, rootMargin, threshold, triggerOnce, children }) =
   const ref = useRef(null)
   const onScreen = useElementOnScreen(ref, rootMargin, threshold, triggerOnce)
   const defaultStyles = {
-    transition: '1000ms ease-in-out',
+    transition: '1000ms ease-in-out'
   }
   return (
     <div
@@ -47,11 +47,11 @@ const AnimateIn = ({ from, to, rootMargin, threshold, triggerOnce, children }) =
         onScreen
           ? {
               ...defaultStyles,
-              ...to,
+              ...to
             }
           : {
               ...defaultStyles,
-              ...from,
+              ...from
             }
       }
     >
@@ -106,7 +106,7 @@ const AnimateOnScreen = {
   FadeIn,
   FadeUp,
   ScaleIn,
-  DiyAnimation,
+  DiyAnimation
 }
 
 export default AnimateOnScreen

src/components/stateless/Spotlight/index.jsx

@@ -1,7 +1,7 @@
 import React, { useRef, useState, useEffect } from 'react'
 import useMousePosition from '@hooks/useMousePosition'
 
-export default function Spotlight({ children, className = '' }) {
+export default function Spotlight ({ children, className = '' }) {
   const containerRef = useRef(null)
   const mousePosition = useMousePosition()
   const mouse = useRef({ x: 0, y: 0 })