Files
tibi-svelte-starter/src/components/widgets/PromotionImage.svelte

75 lines
2.8 KiB
Svelte

<svg
class="promotion-image-wave-top"
width="1920"
height="70"
viewBox="0 0 1920 70"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="m1920 70-80-12c-80-12-240-36-400-42s-320 6-480 18-320 24-480 18S160 22 80 10L0-2v-108h1920V70z"
fill="#fff"></path>
</svg>
<!-- <img src="img/promotion/promotion-image.png" alt="" class="promotion-image" /> -->
<svg class="promotion-image-wave-bottom" viewBox="0 0 1920 137" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M0 30.708 80 24.7c80-6.008 240-18.024 400-6.008 160 12.016 320 48.065 480 42.057 160-6.009 320-54.073 480-60.082 160-6.008 320 30.041 400 48.065l80 18.025V137H0V30.708z"
fill="url(#plkj8d2oga)"></path>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M0 30.708 80 24.7c80-6.008 240-18.024 400-6.008 160 12.016 320 48.065 480 42.057 160-6.009 320-54.073 480-60.082 160-6.008 320 30.041 400 48.065l80 18.025V137H0V30.708z"
fill="url(#iwnto70uxb)"></path>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M0 30.708 80 24.7c80-6.008 240-18.024 400-6.008 160 12.016 320 48.065 480 42.057 160-6.009 320-54.073 480-60.082 160-6.008 320 30.041 400 48.065l80 18.025V137H0V30.708z"
fill="url(#aco1fmuv9c)"></path>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M0 121.708 80 108.7c80-6.008 240-48.024 400-36.008 160 12.016 320 48.065 480 42.057 160-6.009 320-94.073 480-100.081 160-6.009 320 30.04 400 48.064l80 18.025V141H0v-19.292z"
fill="#fff"></path>
<defs>
<radialGradient
id="plkj8d2oga"
cx="0"
cy="0"
r="1"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(960 0 0 41.5089 960 95.491)"
>
<stop stop-color="#FFFEFF"></stop>
<stop offset="1" stop-color="#D7FFFE"></stop>
</radialGradient>
<radialGradient
id="iwnto70uxb"
cx="0"
cy="0"
r="1"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(-652.99956 -34.96514 36.02623 -672.81617 1033.5 102.034)"
>
<stop stop-color="#BCFFFD"></stop>
<stop offset="1" stop-color="#fff" stop-opacity="0"></stop>
</radialGradient>
<radialGradient
id="aco1fmuv9c"
cx="0"
cy="0"
r="1"
gradientUnits="userSpaceOnUse"
gradientTransform="rotate(8.473 63.69 3351.307) scale(825.005 723.955)"
>
<stop stop-color="#fff"></stop>
<stop offset="1" stop-color="#fff" stop-opacity="0"></stop>
</radialGradient>
</defs>
</svg>