completed animations on desktop size

This commit is contained in:
HAM!DREZA
2024-05-08 22:59:17 +03:30
parent 9e8d5abc19
commit a41a54788d
8 changed files with 434 additions and 259 deletions
+7 -9
View File
@@ -8,6 +8,7 @@
نقشه راه از تولید به مصرف محصولات شینان
</h2>
<div ref="main" class="relative mt-[10vw] lg:mt-0 flex justify-center">
<svg
id="motionSVG"
class="hidden lg:block box z-[1] absolute mt-[8vw] lg:mt-[2.4vw] h-[15.385vw] w-[15.385vw] lg:h-[5.625vw] lg:w-[5.625vw]"
@@ -33,6 +34,7 @@
fill="#383E43"
/>
</svg>
<svg
class="motionPath hidden lg:block absolute mt-[8vw] w-[81.146vw] h-[107.604vw]"
viewBox="0 0 1558 2066"
@@ -49,14 +51,9 @@
</svg>
<svg
class="box hidden absolute"
id="motionSVG"
class="box2 block md:hidden !mt-[18vw] absolute"
id="motionSVG2"
width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="30" cy="30" r="29.5" stroke="#383E43" stroke-dasharray="5 5"/>
<circle cx="30" cy="30" r="18" fill="white"/>
@@ -64,8 +61,9 @@
<path d="M33.2104 32L26.7804 32C26.3904 32 26.1504 32.42 26.3504 32.75L26.9904 33.85C28.6404 36.72 31.3604 36.72 33.0104 33.85L33.6504 32.75C33.8404 32.42 33.6004 32 33.2104 32Z" fill="#383E43"/>
</svg>
<svg
class="motionPath block absolute lg:hidden mt-[20vw]"
class="motionPath2 block absolute md:hidden mt-[20vw]"
width="98vw"
height="359.487vw"
viewBox="0 0 390 1402"
@@ -73,7 +71,7 @@
xmlns="http://www.w3.org/2000/svg"
>
<path
id="motionPath"
id="motionPath2"
d="M195.25 -8.51273e-06L195.211 9.21222C195.094 36.7434 172.743 59 145.212 59L50 59C22.3858 59 5.86356e-05 81.3858 5.88568e-05 109L6.27834e-05 599C6.30047e-05 626.614 22.3858 649 50.0001 649L339.999 649C367.613 649 389.999 671.386 389.999 699L389.999 1238C389.999 1265.61 367.613 1288 339.999 1288L245 1288C217.386 1288 195 1310.39 195 1338L195 1402"
stroke="#383E43"
stroke-dasharray="5 5"