feat: 3d card

Author: wkylin

src/components/stateless/ThreeDCard/index.jsx

@@ -108,7 +108,11 @@ const ThreeDCard = ({
     >
       {backgroundUrl && (
         <div
-          className={clsx('absolute inset-0 scale-110 bg-cover bg-center', disabled && 'brightness-75 grayscale')}
+          className={clsx(
+            'absolute inset-0 scale-110 bg-cover bg-center',
+            imageUrl ? 'blur-[1px]' : 'blur-[0]',
+            disabled && 'brightness-75 grayscale-75'
+          )}
           style={{
             backgroundImage: `url(${backgroundUrl})`,
             transform: `

src/pages/tilt/index.jsx

@@ -41,7 +41,7 @@ const ReactTilt = () => (
       <ThreeDCard title="小荷才露尖尖角，早有蜻蜓立上头" backgroundUrl={HePng} imageUrl={MacPng} variant="shine" />
       <ThreeDCard title="不知细叶谁裁出，二月春风似剪刀" backgroundUrl={SpringPng} variant="border" />
       <ThreeDCard title="明月松间照，清泉石上流" backgroundUrl={SongPng} />
-      <ThreeDCard title="柴门闻犬吠，风雪夜归人" backgroundUrl={XuePng} />
+      <ThreeDCard title="柴门闻犬吠，风雪夜归人" backgroundUrl={XuePng} disabled />
     </section>
   </FixTabPanel>
 )