JSFiddle - React, Tailwind, and code Playground

by bhupendra negi

HTML

<sly data-sly-test="${customerOrder.engravingText}">
  <tr>
    <td class="iwc-order-details-datatable-desktop-td">${'iwc.order.engraving.title' @i18n }</td>
    <td class="iwc-order-details-datatable-desktop-td" colspan="2"></td>
    <td class="iwc-order-details-datatable-desktop-td iwc-order-details-right-align-text">
      <sly data-sly-use.priceFormatter="${'com.richemont.cms.iwc.ui.models.utils.PriceFormatter' @ price=customerOrder.engravingCharge, countryCode=customerOrder.websiteCountry}">
        <sly data-sly-test="${customerOrder.engravingCharge != 0.0}">
          ${priceFormatter.formattedPrice}
        </sly>
        <sly data-sly-test="${customerOrder.engravingCharge == 0.0}">
          ${'iwc.order.delivery.free' @i18n }
        </sly>
      </sly>
    </td>
  </tr>
  <tr>
    <td class="iwc-order-details-datatable-desktop-td iwc-desktop-engrave-txt">${customerOrder.engravingText}</td>
    <td class="iwc-order-details-datatable-desktop-td" colspan="3"></td>
  </tr>
</sly>