feat: animations

This commit is contained in:
Dex404 2024-04-17 11:10:46 +00:00
parent d9eb1bb3a4
commit 84c14cec5a
4 changed files with 64 additions and 3 deletions

View file

@ -63,10 +63,18 @@ export default function AboutUs() {
</div>
</div>
<div className="flex flex-col justify-around">
<div className="flex h-[315px] w-[560px] items-center justify-center bg-white max-md:h-[250px] max-md:w-[375px]">
<div className="flex h-full w-full items-center justify-center">
<div
className="flex h-[315px] w-[560px] items-center justify-center bg-white max-md:h-[250px] max-md:w-[375px]"
style={{
backgroundImage: `url('/images/player_background.png')`,
backgroundSize: "cover",
backgroundPosition: "center",
backgroundRepeat: "no-repeat",
}}
>
<div className="z-50 flex h-full w-full items-center justify-center">
<BsPlayCircle
className="fold:h-[20%] fold:w-[20%] h-[10%] w-[10%] cursor-pointer self-center"
className="fold:h-[20%] fold:w-[20%] h-[20%] w-[20%] cursor-pointer self-center text-vizoleG2"
onClick={() => setIsModalOpen(true)}
/>
<Modal isOpen={isModalOpen} onClose={() => setIsModalOpen(false)}>

View file

@ -69,6 +69,7 @@
"react-intersection-observer": "^9.8.2",
"react-reveal": "^1.2.2",
"react-scroll-motion": "^0.3.3",
"react-starfield-animation": "^1.0.1",
"react-tsparticles": "^2.12.2",
"tailwind-merge": "^2.2.2",
"tailwind-variants": "^0.2.1",

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

View file

@ -8819,6 +8819,11 @@ base64-js@^1.3.1:
resolved "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz"
integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
batch-processor@1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/batch-processor/-/batch-processor-1.0.0.tgz#75c95c32b748e0850d10c2b168f6bdbe9891ace8"
integrity sha512-xoLQD8gmmR32MeuBHgH0Tzd5PuSZx71ZsbhVxOCRbgktZEPe4SQy7s9Z50uPp0F/f7iw2XmkHN2xkgbMfckMDA==
before-after-hook@^2.2.0:
version "2.2.3"
resolved "https://registry.npmjs.org/before-after-hook/-/before-after-hook-2.2.3.tgz"
@ -10487,6 +10492,13 @@ electron-to-chromium@^1.4.668:
resolved "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.722.tgz"
integrity sha512-5nLE0TWFFpZ80Crhtp4pIp8LXCztjYX41yUcV6b+bKR2PqzjskTMOOlBi1VjBHlvHwS+4gar7kNKOrsbsewEZQ==
element-resize-detector@^1.2.1:
version "1.2.4"
resolved "https://registry.yarnpkg.com/element-resize-detector/-/element-resize-detector-1.2.4.tgz#3e6c5982dd77508b5fa7e6d5c02170e26325c9b1"
integrity sha512-Fl5Ftk6WwXE0wqCgNoseKWndjzZlDCwuPTcoVZfCP9R3EHQF8qUtr3YUPNETegRBOKqQKPW3n4kiIWngGi8tKg==
dependencies:
batch-processor "1.0.0"
elliptic@^6.5.3, elliptic@^6.5.5:
version "6.5.5"
resolved "https://registry.npmjs.org/elliptic/-/elliptic-6.5.5.tgz"
@ -15633,6 +15645,11 @@ pend@~1.2.0:
resolved "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz"
integrity sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==
performance-now@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b"
integrity sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==
picocolors@^1.0.0:
version "1.0.0"
resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz"
@ -16130,6 +16147,13 @@ queue@6.0.2:
dependencies:
inherits "~2.0.3"
raf@^3.4.0:
version "3.4.1"
resolved "https://registry.yarnpkg.com/raf/-/raf-3.4.1.tgz#0742e99a4a6552f445d73e3ee0328af0ff1ede39"
integrity sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==
dependencies:
performance-now "^2.1.0"
ramda@0.29.0:
version "0.29.0"
resolved "https://registry.npmjs.org/ramda/-/ramda-0.29.0.tgz"
@ -16308,6 +16332,24 @@ react-scroll-motion@^0.3.3:
resolved "https://registry.yarnpkg.com/react-scroll-motion/-/react-scroll-motion-0.3.3.tgz#8d9a562f98b7b59f05079ac95510f141fa6718f8"
integrity sha512-Q33prpcdWDfQaHVmED7bo/EReUEBHfL6mOfvMGFP3FhDxTKddIoocMcd3bT9qw2KQ/fqNdJNADf7aiHWSLkXuQ==
react-sizeme@^2.4.2:
version "2.6.12"
resolved "https://registry.yarnpkg.com/react-sizeme/-/react-sizeme-2.6.12.tgz#ed207be5476f4a85bf364e92042520499455453e"
integrity sha512-tL4sCgfmvapYRZ1FO2VmBmjPVzzqgHA7kI8lSJ6JS6L78jXFNRdOZFpXyK6P1NBZvKPPCZxReNgzZNUajAerZw==
dependencies:
element-resize-detector "^1.2.1"
invariant "^2.2.4"
shallowequal "^1.1.0"
throttle-debounce "^2.1.0"
react-starfield-animation@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/react-starfield-animation/-/react-starfield-animation-1.0.1.tgz#2dfd3e88849041c875a1227a3725950d1417c010"
integrity sha512-fIQ9VxUDQ/xrxrByiie2P9uqiNLXab+ABEFPu/Gw+IQx1vL4EYLqyTvvzScYIwlehXvH16JHXDsiTecglwsSUg==
dependencies:
raf "^3.4.0"
react-sizeme "^2.4.2"
react-style-singleton@^2.2.1:
version "2.2.1"
resolved "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.1.tgz"
@ -17012,6 +17054,11 @@ shallow-clone@^3.0.0:
dependencies:
kind-of "^6.0.2"
shallowequal@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
shebang-command@^2.0.0:
version "2.0.0"
resolved "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz"
@ -17817,6 +17864,11 @@ thriftrw@^3.5.0:
error "7.0.2"
long "^2.4.0"
throttle-debounce@^2.1.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/throttle-debounce/-/throttle-debounce-2.3.0.tgz#fd31865e66502071e411817e241465b3e9c372e2"
integrity sha512-H7oLPV0P7+jgvrk+6mwwwBDmxTaxnu9HMXmloNLXwnNO0ZxZ31Orah2n8lU1eMPvsaowP2CX+USCgyovXfdOFQ==
through2@^2.0.3, through2@~2.0.0:
version "2.0.5"
resolved "https://registry.npmjs.org/through2/-/through2-2.0.5.tgz"