JSFiddle - React, Tailwind, and code Playground
by joshmoto
HTML
<div id="order-items-meta-box" class="postbox ">
<div class="postbox-header">
<h2 class="hndle ui-sortable-handle">Order Items</h2>
<div class="handle-actions hide-if-no-js"><button type="button" class="handle-order-higher" aria-disabled="false" aria-describedby="order-items-meta-box-handle-order-higher-description"><span class="screen-reader-text">Move up</span><span class="order-higher-indicator" aria-hidden="true"></span></button><span class="hidden" id="order-items-meta-box-handle-order-higher-description">Move Order Items box up</span><button type="button" class="handle-order-lower" aria-disabled="false" aria-describedby="order-items-meta-box-handle-order-lower-description"><span class="screen-reader-text">Move down</span><span class="order-lower-indicator" aria-hidden="true"></span></button><span class="hidden" id="order-items-meta-box-handle-order-lower-description">Move Order Items box down</span><button type="button" class="handlediv" aria-expanded="true"><span class="screen-reader-text">Toggle panel: Order Items</span><span class="toggle-indicator" aria-hidden="true"></span></button></div>
</div>
<div class="inside">
<table class="wp-list-table widefat acf-table">
<thead>
<tr>
<th class="col-number">#</th>
<th class="col-description">Description</th>
<th class="col-preview">Preview</th>
<th class="col-qty">Qty</th>
<th class="col-price">Price</th>
<th class="col-sub-total">Sub Total</th>
</tr>
</thead>
<tbody>
<tr>
<td class="col-number">1</td>
<td class="col-description">
Product: <strong>Plate</strong><br> Size: <a href="/wp-admin/post.php?post=18&action=edit"><strong>Standard UK Car</strong></a><br> Reg: <strong>LR14 TUU</strong><br> Sides: <strong>Front & Rear</strong><br> </td>
<td class="col-preview" style="
width: 1000px;
">
<div data-plate="standard-uk-car"...