templates/fe/modals/_share_product.html.twig line 1

Open in your IDE?
  1. <div class="l-modal-dialog ui-modal-dialog" data-l-modal="share-product" data-share-product-modal="true">
  2. <div class="ui-modal l-modal l-share-product-modal ui-share-product-modal">
  3. <button class="l-share-product-modal-close-btn ui-share-product-modal-close-btn" type="button" data-l-modal-btn="share-product">
  4. <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.63579 17.0487C1.21272 17.0733 0.796649 16.9326 0.475309 16.6564C-0.158436 16.0189 -0.158436 14.9893 0.475309 14.3517L14.3522 0.474749C15.0114 -0.142041 16.0457 -0.107754 16.6625 0.551397C17.2202 1.14746 17.2528 2.06363 16.7386 2.6977L2.77991 16.6564C2.46272 16.9286 2.05332 17.069 1.63579 17.0487Z" fill="#646464"/><path d="M15.4962 17.0487C15.0674 17.0469 14.6565 16.8767 14.352 16.5747L0.475056 2.6977C-0.112075 2.01206 -0.0322518 0.980222 0.653381 0.393036C1.26533 -0.131012 2.16782 -0.131012 2.77972 0.393036L16.7384 14.27C17.3974 14.887 17.4315 15.9213 16.8145 16.5803C16.79 16.6066 16.7646 16.6319 16.7384 16.6564C16.3966 16.9537 15.9468 17.0957 15.4962 17.0487Z" fill="#646464"/></svg>
  5. </button>
  6. <div class="ui-share-product-modal-body">
  7. <h6 class="l-share-product-modal-title ui-share-product-modal-title">
  8. {{ "share_product_with_txt"|trans }}
  9. </h6>
  10. </div>
  11. <div class="l-share-product-modal-actions">
  12. <a class="l-share-product-modal-action ui-share-product-modal-action" data-share-product-modal-share-btn-href="https://www.facebook.com/sharer/sharer.php?u=__url__" target="_blank" rel="noreferrer">
  13. <span class="l-share-product-modal-action-icon ui-share-product-modal-action-icon">
  14. <svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.0167 2.3457C12.484 2.3457 10.9663 2.64759 9.55029 3.23413C8.13426 3.82067 6.84763 4.68037 5.76384 5.76415C3.57505 7.95295 2.3454 10.9216 2.3454 14.017C2.33519 16.7121 3.26836 19.3258 4.98311 21.405L2.64885 23.7392C2.4869 23.9033 2.3772 24.1118 2.33358 24.3382C2.28996 24.5646 2.31438 24.7988 2.40375 25.0114C2.50069 25.2214 2.65784 25.3979 2.85525 25.5184C3.05267 25.6389 3.28144 25.6981 3.51253 25.6883H14.0167C17.1121 25.6883 20.0808 24.4587 22.2696 22.2699C24.4584 20.0811 25.688 17.1124 25.688 14.017C25.688 10.9216 24.4584 7.95295 22.2696 5.76415C20.0808 3.57536 17.1121 2.3457 14.0167 2.3457ZM14.0167 23.3541H6.32531L7.41075 22.2686C7.62812 22.05 7.75014 21.7541 7.75014 21.4458C7.75014 21.1375 7.62812 20.8417 7.41075 20.623C5.88249 19.0964 4.9308 17.0872 4.71781 14.9376C4.50483 12.7881 5.04374 10.6312 6.24271 8.83439C7.44169 7.03761 9.22656 5.71213 11.2932 5.08376C13.3599 4.45539 15.5805 4.56302 17.5767 5.38831C19.5729 6.2136 21.2212 7.70549 22.2408 9.6098C23.2604 11.5141 23.5882 13.713 23.1683 15.8319C22.7485 17.9508 21.6069 19.8586 19.9382 21.2302C18.2695 22.6018 16.1768 23.3524 14.0167 23.3541Z" fill="#6A6A6A"/></svg>
  15. </span>
  16. <span class="l-share-product-modal-action-title ui-share-product-modal-action-title">{{ "facebook_txt"|trans }}</span>
  17. </a>
  18. <a class="l-share-product-modal-action ui-share-product-modal-action" data-share-product-modal-share-btn-href="https://api.whatsapp.com/send?text=__url__" target="_blank" rel="noreferrer">
  19. <span class="l-share-product-modal-action-icon ui-share-product-modal-action-icon">
  20. <svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.419 16.3516C19.1856 16.2349 17.6683 15.5347 17.4349 15.4179C17.2015 15.3012 16.968 15.3012 16.7346 15.5347C16.5012 15.7681 16.0343 16.4684 15.8009 16.7018C15.6842 16.9352 15.4508 16.9352 15.2173 16.8185C14.4004 16.4684 13.5834 16.0015 12.8831 15.4179C12.2995 14.8344 11.716 14.1341 11.2491 13.4338C11.1324 13.2004 11.2491 12.967 11.3658 12.8503C11.4825 12.7335 11.5992 12.5001 11.8327 12.3834C11.9494 12.2667 12.0661 12.0333 12.0661 11.9165C12.1828 11.7998 12.1828 11.5664 12.0661 11.4497C11.9494 11.333 11.3658 9.93242 11.1324 9.34886C11.0157 8.53187 10.7822 8.53187 10.5488 8.53187C10.4321 8.53187 10.1987 8.53187 9.96526 8.53187C9.73183 8.53187 9.38169 8.76529 9.26498 8.88201C8.5647 9.58228 8.21456 10.3993 8.21456 11.333C8.33127 12.3834 8.68141 13.4338 9.38169 14.3675C10.6655 16.2349 12.2995 17.7522 14.2836 18.6859C14.8672 18.9193 15.3341 19.1528 15.9176 19.2695C16.5012 19.5029 17.0848 19.5029 17.785 19.3862C18.602 19.2695 19.3023 18.6859 19.7692 17.9856C20.0026 17.5188 20.0026 17.0519 19.8859 16.5851C19.8859 16.5851 19.6524 16.4684 19.419 16.3516ZM22.3368 5.73075C17.785 1.17894 10.4321 1.17894 5.8803 5.73075C2.14548 9.46557 1.4452 15.1845 4.01289 19.7363L2.37891 25.6887L8.5647 24.0547C10.3154 24.9884 12.1828 25.4553 14.0502 25.4553C20.4694 25.4553 25.6048 20.3199 25.6048 13.9007C25.7215 10.8661 24.4377 7.9483 22.3368 5.73075ZM19.1856 22.0706C17.6683 23.0043 15.9176 23.5879 14.0502 23.5879C12.2995 23.5879 10.6655 23.121 9.14827 22.304L8.79813 22.0706L5.18002 23.0043L6.11372 19.5029L5.8803 19.1528C3.07918 14.4842 4.47974 8.64858 9.03155 5.73075C13.5834 2.81293 19.419 4.3302 22.2201 8.76529C25.0212 13.3171 23.7374 19.2695 19.1856 22.0706Z" fill="#6A6A6A"/></svg>
  21. </span>
  22. <span class="l-share-product-modal-action-title ui-share-product-modal-action-title">{{ "whatsapp_txt"|trans }}</span>
  23. </a>
  24. <a class="l-share-product-modal-action ui-share-product-modal-action" data-share-product-modal-share-btn-href="https://twitter.com/intent/tweet?url=__url__&text=" target="_blank" rel="noreferrer">
  25. <span class="l-share-product-modal-action-icon ui-share-product-modal-action-icon">
  26. <svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M26.9117 4.62204C26.9119 4.41589 26.8574 4.21338 26.7538 4.03514C26.6502 3.8569 26.5012 3.7093 26.322 3.60737C26.1428 3.50544 25.9398 3.45282 25.7337 3.45487C25.5276 3.45691 25.3256 3.51356 25.1485 3.61903C24.4654 4.02564 23.7299 4.33703 22.9625 4.54457C21.8665 3.60413 20.4687 3.08951 19.0246 3.09477C17.4403 3.09659 15.9187 3.71404 14.7811 4.81673C13.6436 5.91942 12.979 7.42104 12.9279 9.00451C9.80464 8.50645 6.97394 6.87628 4.9756 4.42485C4.8552 4.27877 4.70143 4.16378 4.52726 4.08959C4.3531 4.0154 4.16364 3.98418 3.97488 3.99856C3.78623 4.01409 3.60419 4.07535 3.44453 4.17702C3.28486 4.2787 3.15236 4.41774 3.0585 4.58212C2.57709 5.42224 2.3006 6.36405 2.25148 7.33107C2.20237 8.2981 2.38201 9.26308 2.77583 10.1476L2.77355 10.1499C2.59655 10.2589 2.45048 10.4115 2.34931 10.5931C2.24813 10.7747 2.19524 10.9792 2.19568 11.1871C2.19354 11.3586 2.20383 11.53 2.22646 11.7C2.34567 13.1686 2.99651 14.5432 4.05694 15.5661C3.985 15.7032 3.9411 15.8532 3.92779 16.0074C3.91448 16.1616 3.93204 16.3169 3.97943 16.4643C4.44175 17.9047 5.42492 19.1208 6.73656 19.8745C5.40398 20.3898 3.96511 20.5695 2.54673 20.3977C2.28421 20.3647 2.01829 20.422 1.79259 20.56C1.56689 20.6981 1.39481 20.9088 1.30457 21.1575C1.21434 21.4062 1.21131 21.6782 1.29599 21.9289C1.38067 22.1795 1.54802 22.394 1.77059 22.537C4.21001 24.1082 7.05031 24.9435 9.95191 24.9431C13.2424 24.9801 16.4528 23.9287 19.0838 21.9523C21.7148 19.9759 23.619 17.1854 24.5 14.0149C24.912 12.6337 25.1224 11.2003 25.1246 9.759C25.1246 9.68264 25.1246 9.604 25.1234 9.52535C25.7328 8.86818 26.2049 8.09597 26.512 7.254C26.819 6.41202 26.9549 5.51722 26.9117 4.62204ZM23.0525 8.37076C22.8597 8.59875 22.7621 8.89223 22.78 9.19026C22.7914 9.38284 22.7903 9.57658 22.7903 9.759C22.7879 10.977 22.6094 12.1882 22.2603 13.355C21.5408 16.0527 19.9367 18.4309 17.7051 20.1087C15.4735 21.7865 12.7433 22.6669 9.95191 22.6088C8.9492 22.6092 7.94995 22.4913 6.97482 22.2578C8.21829 21.8571 9.38096 21.2393 10.409 20.433C10.5983 20.2839 10.7369 20.0799 10.8057 19.849C10.8744 19.618 10.8701 19.3714 10.7931 19.143C10.7162 18.9147 10.5705 18.7157 10.376 18.5734C10.1815 18.4311 9.94776 18.3525 9.70681 18.3484C8.73673 18.3333 7.81038 17.9422 7.12294 17.2576C7.29733 17.2245 7.47058 17.1835 7.64268 17.1345C7.8948 17.0627 8.11542 16.9082 8.26904 16.6958C8.42265 16.4834 8.50031 16.2255 8.48952 15.9636C8.47873 15.7017 8.38011 15.451 8.20954 15.252C8.03897 15.053 7.80638 14.9171 7.54922 14.8663C6.98612 14.7551 6.45626 14.5156 6.0008 14.1663C5.54535 13.817 5.17659 13.3674 4.92318 12.8524C5.13411 12.8811 5.34639 12.899 5.55917 12.9059C5.81195 12.9097 6.05939 12.8331 6.26572 12.687C6.47205 12.5409 6.62656 12.333 6.70692 12.0933C6.78393 11.8514 6.77997 11.591 6.69564 11.3516C6.61131 11.1122 6.45121 10.9068 6.23962 10.7666C5.72625 10.4246 5.30573 9.96057 5.01571 9.41614C4.7257 8.87172 4.57524 8.26386 4.57782 7.64701C4.57782 7.56951 4.5801 7.492 4.58466 7.41564C7.20051 9.85524 10.5934 11.2934 14.1656 11.4767C14.346 11.4838 14.5255 11.4498 14.6908 11.3773C14.8561 11.3049 15.0027 11.1958 15.1196 11.0584C15.2354 10.9196 15.3174 10.7558 15.3591 10.58C15.4008 10.4042 15.4011 10.2211 15.3601 10.0451C15.2933 9.76658 15.2593 9.48123 15.2586 9.19482C15.2597 8.19638 15.6568 7.23914 16.3628 6.53314C17.0688 5.82714 18.026 5.43005 19.0245 5.42899C19.5382 5.42762 20.0466 5.53275 20.5176 5.73775C20.9886 5.94276 21.412 6.24318 21.7611 6.62006C21.8957 6.76488 22.0651 6.87286 22.2532 6.93371C22.4414 6.99457 22.6419 7.00628 22.8359 6.96774C23.3153 6.87443 23.7879 6.74877 24.2503 6.59162C23.9349 7.23701 23.5318 7.83572 23.0525 8.37076Z" fill="#6A6A6A"/></svg>
  27. </span>
  28. <span class="l-share-product-modal-action-title ui-share-product-modal-action-title">{{ "twitter_txt"|trans }}</span>
  29. </a>
  30. <a class="l-share-product-modal-action ui-share-product-modal-action" data-share-product-modal-share-btn-href="https://telegram.me/share/url?url=__url__&text=" target="_blank" rel="noreferrer">
  31. <span class="l-share-product-modal-action-icon ui-share-product-modal-action-icon">
  32. <svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M26.0972 2.84532C25.7649 2.56887 25.3639 2.38769 24.9368 2.32105C24.5097 2.25442 24.0725 2.30484 23.6718 2.46693L2.75575 10.9115C2.30845 11.0956 1.9277 11.4113 1.66402 11.8168C1.40035 12.2223 1.26622 12.6984 1.27946 13.1819C1.29269 13.6654 1.45265 14.1334 1.73811 14.5239C2.02357 14.9143 2.42102 15.2088 2.87772 15.3681L7.10857 16.8395L9.46676 24.6379C9.4988 24.742 9.54531 24.8412 9.60492 24.9324C9.61397 24.9464 9.62672 24.9569 9.63634 24.9705C9.70521 25.0666 9.78843 25.1515 9.88311 25.2223C9.91003 25.2428 9.93582 25.262 9.9646 25.2803C10.0754 25.3538 10.1981 25.4075 10.3273 25.4391L10.3411 25.4403L10.3489 25.4436C10.4266 25.4594 10.5056 25.4675 10.5848 25.4676C10.5925 25.4676 10.5992 25.4639 10.6068 25.4638C10.7264 25.4617 10.8449 25.4411 10.9582 25.4027C10.9846 25.3938 11.0071 25.3787 11.0327 25.3679C11.1172 25.3329 11.1972 25.288 11.2711 25.2342C11.3303 25.1843 11.3896 25.1345 11.4488 25.0846L14.6026 21.6026L19.3064 25.2465C19.7205 25.5689 20.2303 25.7441 20.7551 25.7446C21.305 25.7438 21.838 25.5541 22.2646 25.2071C22.6913 24.8602 22.9857 24.3771 23.0985 23.8388L26.9065 5.1454C26.9928 4.72467 26.963 4.2884 26.8205 3.88325C26.678 3.47811 26.428 3.11934 26.0972 2.84532ZM11.0476 17.2111C10.8858 17.3723 10.7752 17.5777 10.7296 17.8015L10.3684 19.5568L9.4533 16.5304L14.198 14.0596L11.0476 17.2111ZM20.7369 23.4012L15.1782 19.0951C14.9456 18.9154 14.6539 18.8299 14.3611 18.8557C14.0684 18.8814 13.796 19.0166 13.5984 19.2341L12.5884 20.349L12.9454 18.6141L21.2121 10.3473C21.4095 10.1502 21.5297 9.88904 21.551 9.61099C21.5724 9.33294 21.4934 9.05644 21.3285 8.83157C21.1636 8.6067 20.9236 8.44834 20.652 8.38517C20.3803 8.32199 20.0951 8.35818 19.8478 8.48719L7.98363 14.6644L3.63681 13.0737L24.6201 4.6792L20.7369 23.4012Z" fill="#6A6A6A"/></svg>
  33. </span>
  34. <span class="l-share-product-modal-action-title ui-share-product-modal-action-title">{{ "telegram_txt"|trans }}</span>
  35. </a>
  36. <a class="l-share-product-modal-action ui-share-product-modal-action" data-share-product-modal-share-btn-href="mailto:?&subject=&body=__url__" target="_blank" rel="noreferrer">
  37. <span class="l-share-product-modal-action-icon ui-share-product-modal-action-icon">
  38. <svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.1506 2.3457C7.70799 2.3457 2.47925 7.57445 2.47925 14.017C2.47925 20.4596 7.70799 25.6883 14.1506 25.6883H19.9862V23.3541H14.1506C9.08521 23.3541 4.81351 19.0824 4.81351 14.017C4.81351 8.95166 9.08521 4.67996 14.1506 4.67996C19.2159 4.67996 23.4876 8.95166 23.4876 14.017V15.686C23.4876 16.608 22.6589 17.5184 21.7369 17.5184C20.8149 17.5184 19.9862 16.608 19.9862 15.686V14.017C19.9862 10.7957 17.3718 8.18136 14.1506 8.18136C10.9293 8.18136 8.3149 10.7957 8.3149 14.017C8.3149 17.2383 10.9293 19.8527 14.1506 19.8527C15.7612 19.8527 17.2318 19.1991 18.2822 18.137C19.0408 19.1757 20.348 19.8527 21.7369 19.8527C24.0362 19.8527 25.8219 17.9853 25.8219 15.686V14.017C25.8219 7.57445 20.5931 2.3457 14.1506 2.3457ZM14.1506 17.5184C12.2131 17.5184 10.6492 15.9544 10.6492 14.017C10.6492 12.0796 12.2131 10.5156 14.1506 10.5156C16.088 10.5156 17.6519 12.0796 17.6519 14.017C17.6519 15.9544 16.088 17.5184 14.1506 17.5184Z" fill="#6A6A6A"/></svg>
  39. </span>
  40. <span class="l-share-product-modal-action-title ui-share-product-modal-action-title">
  41. {{ "email_txt"|trans }}
  42. </span>
  43. </a>
  44. </div>
  45. <div class="ui-share-product-modal-body">
  46. <div class="l-share-product-modal-input-title ui-share-product-modal-input-title">
  47. {{ "or_share_with_link_txt"|trans }}
  48. </div>
  49. <div class="l-form-input-box l-form-input-and-icon-box-align-end--lg l-form-input-and-icon-box-align-end">
  50. <input class="l-form-input ui-form-input ui-form-input--lg ui-form-input--border-transparent ui-form-input--focus-border-primary-light ui-share-product-modal-input ui-share-product-modal-input" type="text" readonly value="__url__" data-share-product-modal-input-copy="true" />
  51. <svg class="l-form-input-icon l-form-input-icon l-form-input-icon--md l-form-input-icon-align-end ui-form-input-icon-action" width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.5711 23.6436H10.2341C9.30546 23.6436 8.41487 23.2747 7.75823 22.6181C7.10159 21.9614 6.7327 21.0708 6.7327 20.1422V8.47091C6.7327 8.16137 6.60973 7.8645 6.39085 7.64562C6.17197 7.42674 5.87511 7.30378 5.56557 7.30378C5.25603 7.30378 4.95916 7.42674 4.74028 7.64562C4.5214 7.8645 4.39844 8.16137 4.39844 8.47091V20.1422C4.39844 21.6899 5.01326 23.1742 6.10766 24.2686C7.20206 25.363 8.68638 25.9779 10.2341 25.9779H19.5711C19.8807 25.9779 20.1775 25.8549 20.3964 25.636C20.6153 25.4171 20.7383 25.1203 20.7383 24.8107C20.7383 24.5012 20.6153 24.2043 20.3964 23.9855C20.1775 23.7666 19.8807 23.6436 19.5711 23.6436ZM25.4068 10.7351C25.3946 10.6279 25.3712 10.5223 25.3368 10.42V10.315C25.2806 10.195 25.2058 10.0847 25.115 9.98818L18.1122 2.98539C18.0157 2.89461 17.9054 2.81976 17.7854 2.76364H17.6804L17.3069 2.63525H12.5684C11.6397 2.63525 10.7491 3.00415 10.0925 3.66079C9.43586 4.31743 9.06696 5.20802 9.06696 6.13665V17.808C9.06696 18.7366 9.43586 19.6272 10.0925 20.2838C10.7491 20.9405 11.6397 21.3093 12.5684 21.3093H21.9054C22.834 21.3093 23.7246 20.9405 24.3813 20.2838C25.0379 19.6272 25.4068 18.7366 25.4068 17.808V10.8052C25.4068 10.8052 25.4068 10.8052 25.4068 10.7351ZM18.404 6.61517L21.4269 9.63804H19.5711C19.2616 9.63804 18.9647 9.51507 18.7459 9.29619C18.527 9.07731 18.404 8.78045 18.404 8.47091V6.61517ZM23.0725 17.808C23.0725 18.1175 22.9496 18.4144 22.7307 18.6332C22.5118 18.8521 22.2149 18.9751 21.9054 18.9751H12.5684C12.2588 18.9751 11.9619 18.8521 11.7431 18.6332C11.5242 18.4144 11.4012 18.1175 11.4012 17.808V6.13665C11.4012 5.8271 11.5242 5.53024 11.7431 5.31136C11.9619 5.09248 12.2588 4.96952 12.5684 4.96952H16.0697V8.47091C16.0697 9.39954 16.4386 10.2901 17.0953 10.9468C17.7519 11.6034 18.6425 11.9723 19.5711 11.9723H23.0725V17.808Z" fill="#000000" style="fill:var(--primary-color)"/></svg>
  52. </div>
  53. </div>
  54. </div>
  55. </div>