When I wrote this code, only me and God knew how it works. Now only God knows…


E-Commerce

Banner
  • bannerType - generic
  • Theme -
  • genericData.isProductBanner - false
  • genericData.withBreadCrumb - true
  • genericData.title - <div class='flex items-center gap-5'><svg width="56" height="37" class="my-element" viewBox="0 0 56 37" fill="none" xmlns="http://www.w3.org/2000/svg"> <mask id="mask0_4_145" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="56" height="37"> <path d="M55.897 0H0V36.154H55.897V0Z" fill="white"/> </mask> <g mask="url(#mask0_4_145)"> <path d="M30.035 34.074C32.819 32.008 34.835 25.915 34.835 18.721C34.835 18.4377 34.8317 18.1557 34.825 17.875C42.901 16.663 48.69 13.375 48.69 9.517C48.6898 9.34172 48.6778 9.16665 48.654 8.993C50.6941 11.3237 51.8409 14.3029 51.89 17.4C51.89 26.153 42.281 33.337 30.036 34.076M4.007 17.4C4.05593 14.304 5.20153 11.3257 7.24 8.995C7.21619 9.16865 7.20416 9.34372 7.204 9.519C7.204 13.381 12.994 16.665 21.069 17.876C21.0623 18.1567 21.0593 18.4387 21.06 18.722C21.06 25.916 23.078 32.008 25.86 34.074C13.618 33.336 4.008 26.153 4.007 17.4ZM27.948 2.617C24.948 2.617 22.395 7.104 21.448 13.364C15.765 12.476 11.797 10.464 11.797 8.115C11.797 4.949 19.027 2.383 27.946 2.382C36.865 2.381 44.1 4.949 44.1 8.115C44.1 10.46 40.132 12.477 34.449 13.365C33.504 7.104 30.949 2.618 27.949 2.618M23.949 13.67C24.574 9.649 26.13 6.799 27.949 6.799C29.768 6.799 31.327 9.648 31.949 13.669C30.669 13.785 29.328 13.847 27.949 13.847C26.57 13.847 25.226 13.786 23.949 13.67ZM27.949 28.395C25.655 28.395 23.78 23.875 23.659 18.185C25.043 18.309 26.478 18.375 27.949 18.375C29.42 18.375 30.855 18.31 32.239 18.185C32.118 23.875 30.239 28.395 27.95 28.395M27.948 0C12.512 0 0 8.095 0 18.079C0 28.063 12.514 36.155 27.949 36.154C43.384 36.153 55.9 28.06 55.9 18.076C55.9 8.092 43.383 0 27.948 0Z" fill="white"/> </g> </svg> <div class='px-5 border-l-white border-l-2'>Buy Toyota Products Online</div></div> <style> .my-element { filter: invert(0); } @media (max-width: 640px) { .my-element { filter: invert(1); } } </style>
  • genericData.textTheme -
  • backgroundImage -
Spacer
  • seperator -
  • spacerType - custom
  • custom.mobile - 30
  • custom.tabletPortrait - 40
  • custom.tabletLandscape - 60
  • custom.desktop - 90
  • custom.largeDesktop - 90
Ecommerce Grid
  • main title - Drive Value With Toyota: Shop Quality And Style
  • sub title -
  • description.items[0].content - Drive Value With Toyota: Shop Quality And Style
  • theme - default
  • columns - 3
  • items
    asd
    asd
    • item[0]
      • item[0].title -
      • item[0].subtitle.items[0].content -
      • item[0].image -
      • ====== ==============
      • item.button
      • button[0].defaultButton
        • buttons[0].button.linkLabel - Buy Parts Online
        • buttons[0].button.linkUrl - https://shop.toyota.co.za/parts
        • buttons[0].button.linkWindow - false
    • item[1]
      • item[1].title -
      • item[1].subtitle.items[0].content -
      • item[1].image -
      • ====== ==============
      • item.button
      • button[0].defaultButton
        • buttons[0].button.linkLabel - Buy Accessories Online
        • buttons[0].button.linkUrl - https://shop.toyota.co.za/accessories
        • buttons[0].button.linkWindow - false
    • item[2]
      • item[2].title -
      • item[2].subtitle.items[0].content -
      • item[2].image -
      • ====== ==============
      • item.button
      • button[0].defaultButton
        • buttons[0].button.linkLabel - Buy Merchandise Online
        • buttons[0].button.linkUrl - https://shop.toyota.co.za/merchandise
        • buttons[0].button.linkWindow - false
Spacer
  • seperator -
  • spacerType - custom
  • custom.mobile - 30
  • custom.tabletPortrait - 40
  • custom.tabletLandscape - 60
  • custom.desktop - 90
  • custom.largeDesktop - 90