Skip to content

Instantly share code, notes, and snippets.

@michelemostarda
Created February 4, 2021 14:12
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save michelemostarda/4e291b4384077749453dc8a0fbf54ce7 to your computer and use it in GitHub Desktop.
Save michelemostarda/4e291b4384077749453dc8a0fbf54ce7 to your computer and use it in GitHub Desktop.
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="580" height="401" viewBox="0 0 580 401">
<defs>
<clipPath id="clip-ProductInfoG">
<rect width="580" height="400"/>
</clipPath>
</defs>
<g id="ProductInfoG" clip-path="url(#clip-ProductInfoG)">
<rect width="580" height="401" fill="#fff"/>
<g id="Path_2" data-name="Path 2" transform="translate(0 1)" fill="#fff" stroke-dasharray="3 3">
<path d="M0-1,400,0V400H0Z" stroke="none"/>
</g>
<g id="Rectangle_3" data-name="Rectangle 3" transform="translate(17 17)" fill="none" stroke="none" stroke-width="1" stroke-dasharray="3 3">
<rect width="367" height="367" stroke="none"/>
<rect x="0" y="0" width="366" height="366" fill="none"/>
<image id="Image_product" data-name="Image Product" width="366" height="366" xlink:href="$PRODUCT_IMAGE$"/>
</g>
<rect id="Rectangle_2" data-name="Rectangle 2" width="180" height="400" transform="translate(400 1)" fill="$COLOR$"/>
<g id="Group_1" data-name="Group 1" transform="translate(-135 -335)">
<path id="Path_1" data-name="Path 1" d="M828.066,121l-28.2,118.7h201.947L1026.191,121Z" transform="translate(-321.332 443.637)"/>
<text id="hist-min-text" data-name="hist-min-text" visibility="$HIST_MIN_VISIBILITY$" text-anchor="end" transform="translate(575 592)" fill="red" font-size="15" font-family="Avenir-BlackOblique" font-weight="800">
<tspan x="98" y="0">Minimo Storico</tspan>
</text>
<text id="curr-price" data-name="curr-price" text-anchor="end" transform="translate(575 592)" fill="#fff" font-size="45" font-family="Avenir-BlackOblique" font-style="oblique" font-weight="800">
<tspan x="38" y="45">$CURR_PRICE_INT$</tspan><tspan x="44" y="45" font-family="Avenir-BookOblique" font-weight="400">,</tspan><tspan x="80" y="45" font-size="30" font-family="Avenir-BookOblique" font-weight="400">$CURR_PRICE_CENTS$</tspan>
</text>
<text id="discount-perc" data-name="discount-perc" text-anchor="end" transform="translate(575 592)" fill="#fff" font-size="25" font-family="Avenir-BlackOblique" font-weight="800" font-style="oblique">
<tspan x="80" y="80">$DISCOUNT_PRICE_PERC$</tspan>
</text>
<circle id="Ellipse_1" data-name="Ellipse 1" cx="25" cy="25" r="25" transform="translate(658 599)" fill="#fff"/>
<text id="_" data-name="€" transform="translate(665 639)" font-size="45" font-family="Avenir-BlackOblique"><tspan x="0" y="0">€</tspan></text>
</g>
<g transform="scale(.05) translate(7700, 4700)" fill="red" visibility="$HIST_MIN_VISIBILITY$">
<path d="M243.225,333.382c-13.6,0-25,11.4-25,25s11.4,25,25,25c13.1,0,25-11.4,24.4-24.4
C268.225,344.682,256.925,333.382,243.225,333.382z"/>
<path d="M474.625,421.982c15.7-27.1,15.8-59.4,0.2-86.4l-156.6-271.2c-15.5-27.3-43.5-43.5-74.9-43.5s-59.4,16.3-74.9,43.4
l-156.8,271.5c-15.6,27.3-15.5,59.8,0.3,86.9c15.6,26.8,43.5,42.9,74.7,42.9h312.8
C430.725,465.582,458.825,449.282,474.625,421.982z M440.625,402.382c-8.7,15-24.1,23.9-41.3,23.9h-312.8
c-17,0-32.3-8.7-40.8-23.4c-8.6-14.9-8.7-32.7-0.1-47.7l156.8-271.4c8.5-14.9,23.7-23.7,40.9-23.7c17.1,0,32.4,8.9,40.9,23.8
l156.7,271.4C449.325,369.882,449.225,387.482,440.625,402.382z"/>
<path d="M237.025,157.882c-11.9,3.4-19.3,14.2-19.3,27.3c0.6,7.9,1.1,15.9,1.7,23.8c1.7,30.1,3.4,59.6,5.1,89.7
c0.6,10.2,8.5,17.6,18.7,17.6c10.2,0,18.2-7.9,18.7-18.2c0-6.2,0-11.9,0.6-18.2c1.1-19.3,2.3-38.6,3.4-57.9
c0.6-12.5,1.7-25,2.3-37.5c0-4.5-0.6-8.5-2.3-12.5C260.825,160.782,248.925,155.082,237.025,157.882z"/>
</g>
<g visibility="$FULL_PRICE_VISIBILITY$" id="Group_2" data-name="Group 2" transform="translate(-245 -94)">
<rect id="Rectangle_4" data-name="Rectangle 4" width="149" height="60" transform="translate(665 256)" fill="#fff"/>
<text id="_1234_56-2" data-name="1234,56" text-anchor="end" transform="translate(750 296)" font-size="30" font-family="Avenir-BlackOblique" font-weight="800" font-style="oblique">
<tspan x="60" y="0">$FULL_PRICE$</tspan>
</text>
<line transform="translate(665 256)" x1="5" y1="5" x2="145" y2="55" style="stroke:rgb(255,0,0);stroke-width:4" stroke-linecap="round"/>
</g>
<g id="Group_3" data-name="Group 3" transform="translate(-242 -93)">
<path id="Icon_awesome-star" data-name="Icon awesome-star" d="M18.232,1.252l-4.591,9.309-10.273,1.5A2.251,2.251,0,0,0,2.123,15.9L9.555,23.14,7.8,33.37a2.249,2.249,0,0,0,3.262,2.37l9.19-4.83,9.19,4.83A2.25,2.25,0,0,0,32.7,33.37L30.945,23.14,38.377,15.9a2.251,2.251,0,0,0-1.245-3.839l-10.273-1.5L22.268,1.252a2.252,2.252,0,0,0-4.036,0Z" transform="translate(652 450)" fill="#f5db13"/>
<text id="our-score" data-name="our-score" transform="translate(755 457)" fill="#fff" font-size="17" font-family="Avenir-BlackOblique" font-weight="800" font-style="oblique"><tspan x="-57.71" y="20">$STARS$/5 ($VOTES$)</tspan></text>
</g>
<g id="Rectangle_5" data-name="Rectangle 5" transform="translate(211)" fill="#fff" stroke="#fff" stroke-width="1">
<path d="M0,0H369a0,0,0,0,1,0,0V12a20,20,0,0,1-20,20H20A20,20,0,0,1,0,12V0A0,0,0,0,1,0,0Z" stroke="none"/>
<path d="M1,.5H368a.5.5,0,0,1,.5.5V12A19.5,19.5,0,0,1,349,31.5H20A19.5,19.5,0,0,1,.5,12V1A.5.5,0,0,1,1,.5Z" fill="none"/>
</g>
<text id="channelname" data-name="channelname" text-anchor="end" transform="translate(396 23)" font-size="20" font-family="Avenir-BlackOblique" font-weight="800" font-style="oblique"><tspan x="170" y="0">@$CHANNEL_NAME$</tspan></text>
<g id="store-logo" data-name="store-logo" transform="translate(163 -151.039)">
<image id="logo" data-name="logo" width="49" height="49" transform="translate(195 501.039)" xlink:href="$STORE_LOGO$"/>
</g>
<text visibility="$OUR_SCORE_VISIBILITY$" id="our-score" data-name="our-score" transform="translate(565 73)" fill="#fff" font-size="17" font-family="Avenir-BlackOblique" font-weight="800" font-style="oblique"><tspan x="-133.66" y="20">il nostro score</tspan><tspan font-size="42"><tspan x="-138.195" y="72">$OUR_SCORE$</tspan></tspan></text>
</g>
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment