Compare commits

..

2 Commits

Author SHA1 Message Date
9b8ed0aadd feat: image_add 2025-09-26 19:44:06 +05:30
774ca83cff added dynamic card 2025-09-26 19:44:06 +05:30
3 changed files with 818 additions and 1 deletions

View File

@ -0,0 +1,411 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:v="https://svgstorm.com" viewBox="0 0 194 187" width="194" height="187">
<g fill="None" fill-opacity="0.0" stroke="#000000" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 0.00 187.00
L 194.00 187.00
L 194.00 0.00
L 0.00 0.00
L 0.00 187.00
M 119.00 10.00
C 119.08 11.32 119.00 12.68 119.00 14.00
C 119.00 15.33 119.00 16.67 119.00 18.00
C 119.00 19.33 119.00 20.67 119.00 22.00
C 119.00 23.33 119.00 24.67 119.00 26.00
C 119.00 28.00 119.00 30.00 119.00 32.00
C 119.00 33.33 119.00 34.67 119.00 36.00
C 119.00 38.67 119.00 41.33 119.00 44.00
C 119.00 46.00 119.00 48.00 119.00 50.00
C 119.00 50.50 119.00 51.00 119.00 51.00
C 119.00 65.67 119.00 80.33 119.00 95.00
C 134.00 95.00 149.00 95.00 164.00 95.00
C 164.00 111.67 164.00 128.33 164.00 145.00
C 164.00 151.00 164.00 157.00 164.00 163.00
C 164.00 165.67 164.00 168.33 164.00 171.00
C 164.00 175.33 164.00 179.67 164.00 184.00
C 149.00 184.00 134.00 184.00 119.00 184.00
C 119.00 181.67 119.00 179.33 119.00 177.00
C 118.97 175.00 119.00 173.00 119.00 171.00
C 119.00 168.33 119.00 165.67 119.00 163.00
C 119.00 160.33 119.00 157.67 119.00 155.00
C 119.00 153.67 119.00 152.33 119.00 151.00
C 119.00 149.00 119.00 147.00 119.00 145.00
C 119.00 143.33 119.00 141.67 119.00 140.00
C 104.12 141.35 88.91 138.99 74.00 140.00
C 74.00 125.00 74.00 110.00 74.00 95.00
C 59.33 95.00 44.67 95.00 30.00 95.00
C 30.00 80.33 30.00 65.67 30.00 51.00
C 32.72 47.11 45.60 50.63 51.00 50.00 C 56.40 49.37 68.13 49.47 74.00 50.00
C 74.00 44.67 74.00 39.33 74.00 34.00
C 74.00 30.00 74.00 26.00 74.00 22.00
C 74.00 18.70 73.75 15.29 74.00 12.00
C 74.75 2.23 84.89 6.70 93.00 6.00 C 101.11 5.30 110.75 6.53 119.00 6.00
C 119.00 7.33 119.00 8.67 119.00 10.00 Z" data-index="0"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#282826" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 74.00 12.00
C 76.68 6.65 89.03 11.23 95.00 10.00 C 100.97 8.77 112.52 10.92 119.00 10.00
C 119.00 8.67 119.00 7.33 119.00 6.00
C 110.75 6.53 101.11 5.30 93.00 6.00 C 84.89 6.70 74.75 2.23 74.00 12.00 Z" data-index="1"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#3D3D3B" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 74.00 12.00
C 73.75 15.29 74.00 18.70 74.00 22.00
C 74.13 21.24 74.77 19.21 75.00 18.00
C 75.25 16.71 74.81 15.30 75.00 14.00
C 89.67 14.00 104.33 14.00 119.00 14.00
C 119.00 12.68 119.08 11.32 119.00 10.00
C 112.52 10.92 100.97 8.77 95.00 10.00 C 89.03 11.23 76.68 6.65 74.00 12.00 Z" data-index="2"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#51514F" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 75.00 18.00
C 89.67 18.00 104.33 18.00 119.00 18.00
C 119.00 16.67 119.00 15.33 119.00 14.00
C 104.33 14.00 89.67 14.00 75.00 14.00
C 74.81 15.30 75.25 16.71 75.00 18.00 Z" data-index="3"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#656564" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 74.00 22.00
C 74.00 26.00 74.00 30.00 74.00 34.00
C 74.00 33.96 75.00 34.00 75.00 34.00
C 75.23 33.84 75.00 32.50 75.00 32.00
C 75.00 30.08 74.70 27.89 75.00 26.00
C 75.21 24.70 74.84 23.31 75.00 22.00
C 89.67 22.00 104.33 22.00 119.00 22.00
C 119.00 20.67 119.00 19.33 119.00 18.00
C 104.33 18.00 89.67 18.00 75.00 18.00
C 74.77 19.21 74.13 21.24 74.00 22.00 Z" data-index="4"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#7A7A78" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 75.00 26.00
C 89.67 26.00 104.33 26.00 119.00 26.00
C 119.00 24.67 119.00 23.33 119.00 22.00
C 104.33 22.00 89.67 22.00 75.00 22.00
C 74.84 23.31 75.21 24.70 75.00 26.00 Z" data-index="5"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#939392" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 75.00 32.00
C 81.13 29.28 90.30 33.42 97.00 32.00 C 103.70 30.58 112.14 33.06 119.00 32.00
C 119.00 30.00 119.00 28.00 119.00 26.00
C 104.33 26.00 89.67 26.00 75.00 26.00
C 74.70 27.89 75.00 30.08 75.00 32.00 Z" data-index="6"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#ADADAC" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 75.00 34.00
C 76.31 38.91 90.57 34.95 96.00 36.00 C 101.43 37.05 113.01 35.21 119.00 36.00
C 119.00 34.67 119.00 33.33 119.00 32.00
C 112.14 33.06 103.70 30.58 97.00 32.00 C 90.30 33.42 81.13 29.28 75.00 32.00
C 75.00 32.50 75.23 33.84 75.00 34.00 Z" data-index="7"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#C8C8C8" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 74.00 50.00
C 74.00 50.50 74.00 51.00 74.00 51.00
C 74.00 65.46 72.70 80.60 74.00 95.00
C 74.00 94.96 75.00 95.00 75.00 95.00
C 76.32 80.45 74.01 65.58 75.00 51.00
C 89.67 51.00 104.33 51.00 119.00 51.00
C 119.00 51.00 119.00 50.50 119.00 50.00
C 104.45 48.68 89.58 50.99 75.00 50.00
C 73.70 39.95 86.70 44.86 94.00 44.00 C 101.30 43.14 111.44 44.65 119.00 44.00
C 119.00 41.33 119.00 38.67 119.00 36.00
C 113.01 35.21 101.43 37.05 96.00 36.00 C 90.57 34.95 76.31 38.91 75.00 34.00
C 75.00 34.00 74.00 33.96 74.00 34.00
C 74.00 39.33 74.00 44.67 74.00 50.00 Z" data-index="8"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#EFEFEF" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 50.00
C 119.00 48.00 119.00 46.00 119.00 44.00
C 111.44 44.65 101.30 43.14 94.00 44.00 C 86.70 44.86 73.70 39.95 75.00 50.00
C 89.58 50.99 104.45 48.68 119.00 50.00 Z" data-index="9"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#585858" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 30.00 51.00
C 44.58 50.01 59.45 52.32 74.00 51.00
C 74.00 51.00 74.00 50.50 74.00 50.00
C 68.13 49.47 56.40 49.37 51.00 50.00 C 45.60 50.63 32.72 47.11 30.00 51.00 Z" data-index="10"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#868686" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 74.00 95.00
C 72.70 80.60 74.00 65.46 74.00 51.00
C 59.45 52.32 44.58 50.01 30.00 51.00
C 30.00 65.67 30.00 80.33 30.00 95.00
C 44.67 95.00 59.33 95.00 74.00 95.00 Z" data-index="11"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#FFFFFF" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 75.00 95.00
C 89.67 95.00 104.33 95.00 119.00 95.00
C 119.00 80.33 119.00 65.67 119.00 51.00
C 104.33 51.00 89.67 51.00 75.00 51.00
C 74.01 65.58 76.32 80.45 75.00 95.00 Z" data-index="12"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#AB1115" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 140.00
C 119.00 139.50 119.00 139.00 119.00 139.00
C 104.45 137.68 89.58 139.99 75.00 139.00
C 75.00 124.33 75.00 109.67 75.00 95.00
C 75.00 95.00 74.00 94.96 74.00 95.00
C 74.00 110.00 74.00 125.00 74.00 140.00
C 88.91 138.99 104.12 141.35 119.00 140.00 Z" data-index="13"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#EF191E" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 139.00
C 119.00 124.33 119.00 109.67 119.00 95.00
C 104.33 95.00 89.67 95.00 75.00 95.00
C 75.00 109.67 75.00 124.33 75.00 139.00
C 89.58 139.99 104.45 137.68 119.00 139.00 Z" data-index="14"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#AEAEAE" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 139.00
C 119.00 139.00 119.00 139.50 119.00 140.00
C 119.00 141.67 119.00 143.33 119.00 145.00
C 133.67 145.00 148.33 145.00 163.00 145.00
C 163.50 145.00 164.00 145.00 164.00 145.00
C 164.00 128.33 164.00 111.67 164.00 95.00
C 149.00 95.00 134.00 95.00 119.00 95.00
C 119.00 109.67 119.00 124.33 119.00 139.00 Z" data-index="15"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#909090" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 151.00
C 133.67 151.00 148.33 151.00 163.00 151.00
C 163.00 149.14 162.62 146.82 163.00 145.00
C 148.33 145.00 133.67 145.00 119.00 145.00
C 119.00 147.00 119.00 149.00 119.00 151.00 Z" data-index="16"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#4D4D4C" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 163.00 151.00
C 163.00 152.33 163.00 153.67 163.00 155.00
C 163.00 157.67 163.00 160.33 163.00 163.00
C 148.33 163.00 133.67 163.00 119.00 163.00
C 119.00 165.67 119.00 168.33 119.00 171.00
C 133.67 171.00 148.33 171.00 163.00 171.00
C 163.56 168.48 161.81 164.70 164.00 163.00
C 164.00 157.00 164.00 151.00 164.00 145.00
C 164.00 145.00 163.50 145.00 163.00 145.00
C 162.62 146.82 163.00 149.14 163.00 151.00 Z" data-index="17"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#7E7E7E" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 155.00
C 133.67 155.00 148.33 155.00 163.00 155.00
C 163.00 153.67 163.00 152.33 163.00 151.00
C 148.33 151.00 133.67 151.00 119.00 151.00
C 119.00 152.33 119.00 153.67 119.00 155.00 Z" data-index="18"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#696968" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 163.00
C 133.67 163.00 148.33 163.00 163.00 163.00
C 163.00 160.33 163.00 157.67 163.00 155.00
C 148.33 155.00 133.67 155.00 119.00 155.00
C 119.00 157.67 119.00 160.33 119.00 163.00 Z" data-index="19"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#373735" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 171.00
C 119.00 173.00 118.97 175.00 119.00 177.00
C 133.67 177.00 148.33 177.00 163.00 177.00
C 163.47 175.12 161.94 172.07 164.00 171.00
C 164.00 168.33 164.00 165.67 164.00 163.00
C 161.81 164.70 163.56 168.48 163.00 171.00
C 148.33 171.00 133.67 171.00 119.00 171.00 Z" data-index="20"></path>
</g>
<g fill="None" fill-opacity="0.0" stroke="#252523" stroke-opacity="1.00" stroke-width="0.3"><path d="
M 119.00 177.00
C 119.00 179.33 119.00 181.67 119.00 184.00
C 134.00 184.00 149.00 184.00 164.00 184.00
C 164.00 179.67 164.00 175.33 164.00 171.00
C 161.94 172.07 163.47 175.12 163.00 177.00
C 148.33 177.00 133.67 177.00 119.00 177.00 Z" data-index="21"></path>
</g>
<g fill="#000000" fill-opacity="1.00" stroke="None">
</g>
<g fill="#282826" fill-opacity="1.00" stroke="None">
<path d="
M 74.00 12.00
C 76.68 6.65 89.03 11.23 95.00 10.00 C 100.97 8.77 112.52 10.92 119.00 10.00
C 119.00 8.67 119.00 7.33 119.00 6.00
C 110.75 6.53 101.11 5.30 93.00 6.00 C 84.89 6.70 74.75 2.23 74.00 12.00 Z" data-index="23"></path>
</g>
<g fill="#3D3D3B" fill-opacity="1.00" stroke="None">
<path d="
M 74.00 12.00
C 73.75 15.29 74.00 18.70 74.00 22.00
C 74.13 21.24 74.77 19.21 75.00 18.00
C 75.25 16.71 74.81 15.30 75.00 14.00
C 89.67 14.00 104.33 14.00 119.00 14.00
C 119.00 12.68 119.08 11.32 119.00 10.00
C 112.52 10.92 100.97 8.77 95.00 10.00 C 89.03 11.23 76.68 6.65 74.00 12.00 Z" data-index="24"></path>
</g>
<g fill="#51514F" fill-opacity="1.00" stroke="None">
<path d="
M 75.00 18.00
C 89.67 18.00 104.33 18.00 119.00 18.00
C 119.00 16.67 119.00 15.33 119.00 14.00
C 104.33 14.00 89.67 14.00 75.00 14.00
C 74.81 15.30 75.25 16.71 75.00 18.00 Z" data-index="25"></path>
</g>
<g fill="#656564" fill-opacity="1.00" stroke="None">
<path d="
M 74.00 22.00
C 74.00 26.00 74.00 30.00 74.00 34.00
C 74.00 33.96 75.00 34.00 75.00 34.00
C 75.23 33.84 75.00 32.50 75.00 32.00
C 75.00 30.08 74.70 27.89 75.00 26.00
C 75.21 24.70 74.84 23.31 75.00 22.00
C 89.67 22.00 104.33 22.00 119.00 22.00
C 119.00 20.67 119.00 19.33 119.00 18.00
C 104.33 18.00 89.67 18.00 75.00 18.00
C 74.77 19.21 74.13 21.24 74.00 22.00 Z" data-index="26"></path>
</g>
<g fill="#7A7A78" fill-opacity="1.00" stroke="None">
<path d="
M 75.00 26.00
C 89.67 26.00 104.33 26.00 119.00 26.00
C 119.00 24.67 119.00 23.33 119.00 22.00
C 104.33 22.00 89.67 22.00 75.00 22.00
C 74.84 23.31 75.21 24.70 75.00 26.00 Z" data-index="27"></path>
</g>
<g fill="#939392" fill-opacity="1.00" stroke="None">
<path d="
M 75.00 32.00
C 81.13 29.28 90.30 33.42 97.00 32.00 C 103.70 30.58 112.14 33.06 119.00 32.00
C 119.00 30.00 119.00 28.00 119.00 26.00
C 104.33 26.00 89.67 26.00 75.00 26.00
C 74.70 27.89 75.00 30.08 75.00 32.00 Z" data-index="28"></path>
</g>
<g fill="#ADADAC" fill-opacity="1.00" stroke="None">
<path d="
M 75.00 34.00
C 76.31 38.91 90.57 34.95 96.00 36.00 C 101.43 37.05 113.01 35.21 119.00 36.00
C 119.00 34.67 119.00 33.33 119.00 32.00
C 112.14 33.06 103.70 30.58 97.00 32.00 C 90.30 33.42 81.13 29.28 75.00 32.00
C 75.00 32.50 75.23 33.84 75.00 34.00 Z" data-index="29"></path>
</g>
<g fill="#C8C8C8" fill-opacity="1.00" stroke="None">
<path d="
M 74.00 50.00
C 74.00 50.50 74.00 51.00 74.00 51.00
C 74.00 65.46 72.70 80.60 74.00 95.00
C 74.00 94.96 75.00 95.00 75.00 95.00
C 76.32 80.45 74.01 65.58 75.00 51.00
C 89.67 51.00 104.33 51.00 119.00 51.00
C 119.00 51.00 119.00 50.50 119.00 50.00
C 104.45 48.68 89.58 50.99 75.00 50.00
C 73.70 39.95 86.70 44.86 94.00 44.00 C 101.30 43.14 111.44 44.65 119.00 44.00
C 119.00 41.33 119.00 38.67 119.00 36.00
C 113.01 35.21 101.43 37.05 96.00 36.00 C 90.57 34.95 76.31 38.91 75.00 34.00
C 75.00 34.00 74.00 33.96 74.00 34.00
C 74.00 39.33 74.00 44.67 74.00 50.00 Z" data-index="30"></path>
</g>
<g fill="#EFEFEF" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 50.00
C 119.00 48.00 119.00 46.00 119.00 44.00
C 111.44 44.65 101.30 43.14 94.00 44.00 C 86.70 44.86 73.70 39.95 75.00 50.00
C 89.58 50.99 104.45 48.68 119.00 50.00 Z" data-index="31"></path>
</g>
<g fill="#585858" fill-opacity="1.00" stroke="None">
<path d="
M 30.00 51.00
C 44.58 50.01 59.45 52.32 74.00 51.00
C 74.00 51.00 74.00 50.50 74.00 50.00
C 68.13 49.47 56.40 49.37 51.00 50.00 C 45.60 50.63 32.72 47.11 30.00 51.00 Z" data-index="32"></path>
</g>
<g fill="#868686" fill-opacity="1.00" stroke="None">
<path d="
M 74.00 95.00
C 72.70 80.60 74.00 65.46 74.00 51.00
C 59.45 52.32 44.58 50.01 30.00 51.00
C 30.00 65.67 30.00 80.33 30.00 95.00
C 44.67 95.00 59.33 95.00 74.00 95.00 Z" data-index="33"></path>
</g>
<g fill="#FFFFFF" fill-opacity="1.00" stroke="None">
<path d="
M 75.00 95.00
C 89.67 95.00 104.33 95.00 119.00 95.00
C 119.00 80.33 119.00 65.67 119.00 51.00
C 104.33 51.00 89.67 51.00 75.00 51.00
C 74.01 65.58 76.32 80.45 75.00 95.00 Z" data-index="34"></path>
</g>
<g fill="#AB1115" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 140.00
C 119.00 139.50 119.00 139.00 119.00 139.00
C 104.45 137.68 89.58 139.99 75.00 139.00
C 75.00 124.33 75.00 109.67 75.00 95.00
C 75.00 95.00 74.00 94.96 74.00 95.00
C 74.00 110.00 74.00 125.00 74.00 140.00
C 88.91 138.99 104.12 141.35 119.00 140.00 Z" data-index="35" style="opacity: 1;"></path>
</g>
<g fill="#EF191E" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 139.00
C 119.00 124.33 119.00 109.67 119.00 95.00
C 104.33 95.00 89.67 95.00 75.00 95.00
C 75.00 109.67 75.00 124.33 75.00 139.00
C 89.58 139.99 104.45 137.68 119.00 139.00 Z" data-index="36" style="opacity: 1;"></path>
</g>
<g fill="#AEAEAE" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 139.00
C 119.00 139.00 119.00 139.50 119.00 140.00
C 119.00 141.67 119.00 143.33 119.00 145.00
C 133.67 145.00 148.33 145.00 163.00 145.00
C 163.50 145.00 164.00 145.00 164.00 145.00
C 164.00 128.33 164.00 111.67 164.00 95.00
C 149.00 95.00 134.00 95.00 119.00 95.00
C 119.00 109.67 119.00 124.33 119.00 139.00 Z" data-index="37" style="opacity: 1;"></path>
</g>
<g fill="#909090" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 151.00
C 133.67 151.00 148.33 151.00 163.00 151.00
C 163.00 149.14 162.62 146.82 163.00 145.00
C 148.33 145.00 133.67 145.00 119.00 145.00
C 119.00 147.00 119.00 149.00 119.00 151.00 Z" data-index="38" style="opacity: 1;"></path>
</g>
<g fill="#4D4D4C" fill-opacity="1.00" stroke="None">
<path d="
M 163.00 151.00
C 163.00 152.33 163.00 153.67 163.00 155.00
C 163.00 157.67 163.00 160.33 163.00 163.00
C 148.33 163.00 133.67 163.00 119.00 163.00
C 119.00 165.67 119.00 168.33 119.00 171.00
C 133.67 171.00 148.33 171.00 163.00 171.00
C 163.56 168.48 161.81 164.70 164.00 163.00
C 164.00 157.00 164.00 151.00 164.00 145.00
C 164.00 145.00 163.50 145.00 163.00 145.00
C 162.62 146.82 163.00 149.14 163.00 151.00 Z" data-index="39" style="opacity: 1;"></path>
</g>
<g fill="#7E7E7E" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 155.00
C 133.67 155.00 148.33 155.00 163.00 155.00
C 163.00 153.67 163.00 152.33 163.00 151.00
C 148.33 151.00 133.67 151.00 119.00 151.00
C 119.00 152.33 119.00 153.67 119.00 155.00 Z" data-index="40" style="opacity: 1;"></path>
</g>
<g fill="#696968" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 163.00
C 133.67 163.00 148.33 163.00 163.00 163.00
C 163.00 160.33 163.00 157.67 163.00 155.00
C 148.33 155.00 133.67 155.00 119.00 155.00
C 119.00 157.67 119.00 160.33 119.00 163.00 Z" data-index="41" style="opacity: 1;"></path>
</g>
<g fill="#373735" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 171.00
C 119.00 173.00 118.97 175.00 119.00 177.00
C 133.67 177.00 148.33 177.00 163.00 177.00
C 163.47 175.12 161.94 172.07 164.00 171.00
C 164.00 168.33 164.00 165.67 164.00 163.00
C 161.81 164.70 163.56 168.48 163.00 171.00
C 148.33 171.00 133.67 171.00 119.00 171.00 Z" data-index="42" style="opacity: 1;"></path>
</g>
<g fill="#252523" fill-opacity="1.00" stroke="None">
<path d="
M 119.00 177.00
C 119.00 179.33 119.00 181.67 119.00 184.00
C 134.00 184.00 149.00 184.00 164.00 184.00
C 164.00 179.67 164.00 175.33 164.00 171.00
C 161.94 172.07 163.47 175.12 163.00 177.00
C 148.33 177.00 133.67 177.00 119.00 177.00 Z" data-index="43" style="opacity: 1;"></path>
</g>
</svg>

After

Width:  |  Height:  |  Size: 17 KiB

View File

@ -534,6 +534,86 @@
</div>
</section>
<section class="practice-cards-container">
<!-- <div class="practice-cards-container"> -->
<div class="practice-container">
<h1 class="practice-title">Practice Coding & Ace Hiring Assessments</h1>
<p class="practice-subtitle">Level up your coding skills by practicing the hiring assessments of your dream companies & ace your placement game!</p>
<div class="practice-cards-wrapper">
<!-- Coding Practice Card -->
<div class="practice-card active">
<div class="practice-card-content">
<div>
<div class="practice-card-icon">💻</div>
<h3>Coding Practice</h3>
<p>Level up your coding skills by practicing the hiring Questions.</p>
</div>
<a href="#" class="practice-cta-btn">Start Now ➤</a>
</div>
<div class="practice-card-svg">
<img src="assets/images/mit-ico/ebmpapst.svg" alt="Coding Practice">
</div>
</div>
<!-- Interview Preparation Card -->
<div class="practice-card">
<div class="practice-card-content">
<div>
<div class="practice-card-icon">📋</div>
<h3>Interview Preparation</h3>
<p>Crack Top companies in just 5 days.</p>
<div class="practice-footer-text">20+ Companies</div>
</div>
<a href="#" class="practice-cta-btn">Start Now ➤</a>
</div>
<div class="practice-card-svg">
<img src="assets/images/mit-ico/ebmpapst.svg" alt="Coding Practice">
</div>
</div>
<!-- Projects Card -->
<div class="practice-card">
<div class="practice-card-content">
<div>
<div class="practice-card-icon">📂</div>
<h3>Projects</h3>
<p>Projects epitomize perfect synergy for success.</p>
<div class="practice-footer-text">15+ Projects</div>
</div>
<a href="#" class="practice-cta-btn">Start Now ➤</a>
</div>
<div class="practice-card-svg">
<img src="assets/images/mit-ico/ebmpapst.svg" alt="Coding Practice">
</div>
</div>
<!-- Skill Based Assessments Card -->
<div class="practice-card">
<div class="practice-card-content">
<div>
<div class="practice-card-icon">📝</div>
<h3>Skill Based Assessments</h3>
<p>Assess your skills and get ahead of the curve.</p>
<div class="practice-footer-text">2000+ Questions</div>
</div>
<a href="#" class="practice-cta-btn">Start Now ➤</a>
</div>
<div class="practice-card-svg">
<img src="assets/images/mit-ico/ebmpapst.svg" alt="Coding Practice">
</div>
</div>
</div>
</div>
<!-- </div> -->
</section>
<section class="card-simple">
<div class="card-easy">
<div class="card-easy-left">

328
main.css
View File

@ -1475,4 +1475,330 @@
width: 90%;
max-height: 100%;
}
}
}
/*----------------------------------------------------------------------------------------------------------------------*/
/* Practice Cards Component CSS - Unique class names to prevent conflicts */
.practice-cards-container * {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', system-ui, sans-serif;
}
.practice-cards-container {
background-color: #ffffff;
color: #1f2937;
padding: 40px 20px;
display: flex;
flex-direction: column;
align-items: center;
}
.practice-container {
max-width: 1300px;
width: 100%;
}
.practice-title {
font-size: 32px;
font-weight: 700;
margin-bottom: 12px;
color: #111827;
text-align: left;
}
.practice-subtitle {
font-size: 18px;
color: #6b7280;
max-width: 700px;
/* margin: 0 auto 40px; */
line-height: 1.5;
text-align: left;
}
.practice-cards-wrapper {
margin: 30px 0;
display: flex;
height: 380px;
border-radius: 12px;
overflow: hidden;
/* box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); */
position: relative;
gap: 1px;
background-color: #d1d5db;
padding: 1px;
}
.practice-card {
flex: 1;
display: flex;
transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
cursor: pointer;
position: relative;
overflow: hidden;
transform-origin: center;
background-color: white;
border-radius: 0;
}
.practice-card:first-child {
border-radius: 11px 0 0 11px;
}
.practice-card:last-child {
border-radius: 0 11px 11px 0;
}
.practice-card-content {
flex: 1;
padding: 24px;
display: flex;
flex-direction: column;
justify-content: space-between;
transition: all 0.7s ease;
min-width: 0;
z-index: 2;
position: relative;
}
/* Color changes for active and hover states */
.practice-card.active { background-color: #c6e0f1; }
.practice-card:nth-child(1):hover,
.practice-card:nth-child(1).active { background-color: #89CFF0; }
.practice-card:nth-child(2):hover,
.practice-card:nth-child(2).active { background-color: #FEB4CF; }
.practice-card:nth-child(3):hover,
.practice-card:nth-child(3).active { background-color: #DFC5FE; }
.practice-card:nth-child(4):hover,
.practice-card:nth-child(4).active { background-color: #FFE186; }
/* SVG Container */
.practice-card-svg {
width: 0;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
transition: all 1.3s cubic-bezier(0.23, 1, 0.32, 1);
opacity: 0;
padding: 20px;
background: transparent;
}
.practice-card-svg svg {
width: 100%;
height: 100%;
max-width: 180px;
max-height: 180px;
filter: drop-shadow(0 4px 8px rgba(0,0,0,0.1));
}
.practice-card-icon {
width: 48px;
height: 48px;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
margin-bottom: 16px;
transition: transform 0.5s ease;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.practice-card:nth-child(1) .practice-card-icon { background-color: #1268f3; color: white; }
.practice-card:nth-child(2) .practice-card-icon { background-color: #ef4444; color: white; }
.practice-card:nth-child(3) .practice-card-icon { background-color: #8b5cf6; color: white; }
.practice-card:nth-child(4) .practice-card-icon { background-color: #f59e0b; color: white; }
.practice-card h3 {
font-size: 20px;
font-weight: 600;
margin-bottom: 12px;
color: #111827;
transition: transform 0.5s ease;
}
.practice-card p {
font-size: 15px;
color: #6b7280;
line-height: 1.5;
margin-bottom: 16px;
transition: transform 0.5s ease;
}
.practice-meta-info {
display: flex;
align-items: center;
margin-bottom: 16px;
font-size: 14px;
color: #4b5563;
transition: transform 0.5s ease;
}
.practice-meta-logo {
width: 24px;
height: 24px;
background-color: #3b82f6;
border-radius: 4px;
margin-right: 8px;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-size: 12px;
font-weight: bold;
}
.practice-footer-text {
font-size: 14px;
font-weight: 600;
color: #374151;
margin-top: auto;
transition: transform 0.5s ease;
}
.practice-cta-btn {
margin-top: 16px;
background-color: #111827;
color: white;
padding: 10px 16px;
border-radius: 8px;
font-size: 14px;
font-weight: 600;
text-decoration: none;
width: fit-content;
display: inline-flex;
align-items: center;
gap: 6px;
transition: all 0.7s cubic-bezier(0.23, 1, 0.32, 1);
opacity: 0;
transform: translateY(15px);
position: relative;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.practice-cta-btn::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
transition: left 0.8s;
}
.practice-cta-btn:hover::before {
left: 100%;
}
.practice-cta-btn:hover {
background-color: #374151;
transform: translateY(-2px);
box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}
/* Active card styles */
.practice-card.active {
flex: 3.5;
transform: translateY(-8px) scale(1.02);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
z-index: 10;
}
.practice-card.active .practice-card-svg {
width: 45%;
opacity: 1;
}
.practice-card.active .practice-cta-btn {
opacity: 1;
transform: translateY(0);
}
.practice-card.active .practice-card-icon {
transform: scale(1.1) rotate(5deg);
}
.practice-card.active h3 {
transform: translateY(-3px);
}
.practice-card.active p,
.practice-card.active .practice-meta-info,
.practice-card.active .practice-footer-text {
transform: translateY(-2px);
}
/* Hover effects for non-active cards */
.practice-card:hover:not(.active) {
flex: 1.3;
transform: translateY(-4px) scale(1.01);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
z-index: 5;
}
.practice-card:hover:not(.active) .practice-card-svg {
width: 25%;
opacity: 0.8;
}
/* Subtle overlay effect */
.practice-card::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 100%);
opacity: 0;
transition: opacity 0.6s ease;
pointer-events: none;
}
.practice-card.active::after,
.practice-card:hover::after {
opacity: 1;
}
@media (max-width: 992px) {
.practice-cards-wrapper {
flex-direction: column;
height: auto;
border-radius: 12px;
}
.practice-card {
flex-direction: column;
height: auto;
border-radius: 0 !important;
}
.practice-card:first-child {
border-radius: 12px 12px 0 0 !important;
}
.practice-card:last-child {
border-radius: 0 0 12px 12px !important;
}
.practice-card.active .practice-card-svg,
.practice-card:hover .practice-card-svg {
width: 100%;
height: 200px;
}
.practice-card.active {
transform: translateY(-5px) scale(1.01);
}
.practice-card:hover:not(.active) {
transform: translateY(-3px) scale(1.005);
}
}