forked from brooksbingham/theme-elegance
chore: work on the guest tracking page ui
parent
f44928a2a9
commit
d5606b7734
|
@ -146,7 +146,7 @@
|
|||
{$product.quantity}
|
||||
{/if}
|
||||
</div>
|
||||
<div class="text-sm">{'$'|cat:$product.total}</div>
|
||||
<div class="text-sm">{$|cat:$product.total}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -158,14 +158,14 @@
|
|||
{foreach $order.subtotals as $line}
|
||||
{if $line.value}
|
||||
<div class="order-total flex justify-between py-2">
|
||||
<div class="text-sm font-semibold">{'$line.label'}</div>
|
||||
<div class="text-sm">{'$line.value'}</div>
|
||||
<div class="text-sm font-semibold">{$line.label}</div>
|
||||
<div class="text-sm">{$line.value}</div>
|
||||
</div>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<div class="order-total flex justify-between py-2">
|
||||
<div class="text-sm font-semibold">{'$order.totals.total.label'}</div>
|
||||
<div class="text-sm">{'$order.totals.total.value'}</div>
|
||||
<div class="text-sm font-semibold">{$order.totals.total.label}</div>
|
||||
<div class="text-sm">{$order.totals.total.value}</div>
|
||||
</div>
|
||||
</div>
|
||||
{/block}
|
||||
|
|
|
@ -141,14 +141,14 @@
|
|||
{foreach $order.subtotals as $line}
|
||||
{if $line.value}
|
||||
<tr class="text-right border-t border-gray-200">
|
||||
<td colspan="5" class="px-4 py-2">{'$line.label'}</td>
|
||||
<td colspan="2" class="px-4 py-2">{'$line.value'}</td>
|
||||
<td colspan="5" class="px-4 py-2">{$line.label}</td>
|
||||
<td colspan="2" class="px-4 py-2">{$line.value}</td>
|
||||
</tr>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<tr class="text-right border-t border-gray-200">
|
||||
<td colspan="5" class="px-4 py-2">{'$order.totals.total.label'}</td>
|
||||
<td colspan="2" class="px-4 py-2">{'$order.totals.total.value'}</td>
|
||||
<td colspan="5" class="px-4 py-2">{$order.totals.total.label}</td>
|
||||
<td colspan="2" class="px-4 py-2">{$order.totals.total.value}</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
|
@ -216,13 +216,12 @@
|
|||
{if $line.value}
|
||||
<div class="order-total flex justify-between py-2 px-4 border-b border-gray-200">
|
||||
<div class="text-sm font-semibold">{$line.label}</div>
|
||||
<div class="text-sm">{'$line.value'}</div>
|
||||
<div class="text-sm">{$line.value}</div>
|
||||
</div>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<div class="order-total flex justify-between py-2 px-4 border-t border-gray-200">
|
||||
{/foreach} <div class="order-total flex justify-between py-2 px-4 border-t border-gray-200">
|
||||
<div class="text-sm font-semibold">{$order.totals.total.label}</div>
|
||||
<div class="text-sm">{'$order.totals.total.value'}</div>
|
||||
<div class="text-sm">{$order.totals.total.value}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -37,10 +37,10 @@
|
|||
|
||||
{block name='page_content' append}
|
||||
{block name='guest_to_customer'}
|
||||
<form action="{$urls.pages.guest_tracking}" method="post">
|
||||
<form action="{$urls.pages.guest_tracking}" method="post" class="table-auto p-4 mt-6 border-separate border border-gray-200 w-full" >
|
||||
<header>
|
||||
<h1 class="h3">{l s='Transform your guest account into a customer account and enjoy:' d='Shop.Theme.Customeraccount'}</h1>
|
||||
<ul>
|
||||
<h1 class="h3 font-semibold ">{l s='Transform your guest account into a customer account and enjoy:' d='Shop.Theme.Customeraccount'}</h1>
|
||||
<ul class="text-base leading-8" >
|
||||
<li> -{l s='Personalized and secure access' d='Shop.Theme.Customeraccount'}</li>
|
||||
<li> -{l s='Fast and easy checkout' d='Shop.Theme.Customeraccount'}</li>
|
||||
<li> -{l s='Easier merchandise return' d='Shop.Theme.Customeraccount'}</li>
|
||||
|
@ -49,9 +49,9 @@
|
|||
|
||||
<section class="form-fields">
|
||||
|
||||
<label>
|
||||
<span>{l s='Set your password:' d='Shop.Forms.Labels'}</span>
|
||||
<input type="password" data-validate="isPasswd" name="password" value="">
|
||||
<label class="flex flex-col sm:flex-row sm:gap-2">
|
||||
<span class="font-semibold my-auto" >{l s='Set your password:' d='Shop.Forms.Labels'}</span>
|
||||
<input type="password" data-validate="isPasswd" name="password" class="md:ml-5 mb-2 " value="">
|
||||
</label>
|
||||
|
||||
</section>
|
||||
|
@ -62,7 +62,7 @@
|
|||
<input type="hidden" name="order_reference" value="{$order.details.reference}">
|
||||
<input type="hidden" name="email" value="{$guest_email}">
|
||||
|
||||
<button class="btn btn-primary" type="submit">{l s='Send' d='Shop.Theme.Actions'}</button>
|
||||
<button class="px-6 uppercase py-2 font-medium text-center bg-blue-950 text-gray-50 hover:text-gray-50 hover:bg-blue-900" type="submit">{l s='Send' d='Shop.Theme.Actions'}</button>
|
||||
</footer>
|
||||
|
||||
</form>
|
||||
|
|
|
@ -30,7 +30,7 @@
|
|||
{block name='page_content'}
|
||||
{block name='order_infos'}
|
||||
<div id="order-infos" class="space-y-6">
|
||||
<div class="bg-white shadow rounded-lg p-6">
|
||||
<div class="border rounded p-6">
|
||||
<div class="flex flex-wrap items-center">
|
||||
<div class="w-full {if $order.details.reorder_url}lg:w-9/12{else}lg:w-full{/if}">
|
||||
<strong>
|
||||
|
@ -43,7 +43,7 @@
|
|||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div><div class="bg-white shadow rounded-lg p-6">
|
||||
</div><div class="border rounded p-6">
|
||||
<div class="flex flex-wrap items-center">
|
||||
<div class="w-full {if $order.details.reorder_url}lg:w-9/12{else}lg:w-full{/if}">
|
||||
<strong>
|
||||
|
@ -57,7 +57,7 @@
|
|||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white shadow rounded-lg p-6">
|
||||
<div class="border rounded mt-6 mb-4 p-6">
|
||||
<ul class="space-y-4">
|
||||
<li><strong>{l s='Carrier' d='Shop.Theme.Checkout'}</strong> {$order.carrier.name}</li>
|
||||
<li><strong>{l s='Payment method' d='Shop.Theme.Checkout'}</strong> {$order.details.payment}</li>
|
||||
|
@ -86,7 +86,7 @@
|
|||
{/block}
|
||||
|
||||
{block name='order_history'}
|
||||
<section id="order-history" class="bg-white shadow rounded-lg p-6">
|
||||
<section id="order-history" class="border mt-6 rounded p-6">
|
||||
<h3 class="text-xl font-semibold">{l s='Follow your order\'s status step-by-step' d='Shop.Theme.Customeraccount'}</h3>
|
||||
<table class="table-auto w-full hidden md:table">
|
||||
<thead class="text-gray-700">
|
||||
|
@ -98,8 +98,8 @@
|
|||
<tbody>
|
||||
{foreach from=$order.history item=state}
|
||||
<tr>
|
||||
<td class="px-4 py-2">{($state.history_date)}</td>
|
||||
<td class="px-4 py-2">
|
||||
<td class="text-center">{($state.history_date)}</td>
|
||||
<td class="text-center">
|
||||
<span class="inline-block px-4 py-1 rounded-full text-white" style="background-color:{$state.color}">
|
||||
{$state.ostate_name}
|
||||
</span>
|
||||
|
@ -131,18 +131,18 @@
|
|||
{/if}
|
||||
|
||||
{block name='addresses'}
|
||||
<div class="flex flex-wrap">
|
||||
<div class="flex flex-wrap justify-between mt-6 mb-6">
|
||||
{if $order.addresses.delivery}
|
||||
<div class="w-full lg:w-6/12 p-4">
|
||||
<article id="delivery-address" class="bg-white shadow rounded-lg p-6">
|
||||
<div class="w-full lg:w-[49%] mb-6 ">
|
||||
<article id="delivery-address" class="border rounded p-6">
|
||||
<h4 class="text-lg font-semibold">{l s='Delivery address %alias%' d='Shop.Theme.Checkout' sprintf=['%alias%' => $order.addresses.delivery.alias]}</h4>
|
||||
<address class="text-sm text-gray-700">{$order.addresses.delivery.formatted nofilter}</address>
|
||||
</article>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="w-full lg:w-6/12 p-4">
|
||||
<article id="invoice-address" class="bg-white shadow rounded-lg p-6">
|
||||
<div class="w-full lg:w-[49%] ">
|
||||
<article id="invoice-address" class="border rounded p-6">
|
||||
<h4 class="text-lg font-semibold">{l s='Invoice address %alias%' d='Shop.Theme.Checkout' sprintf=['%alias%' => $order.addresses.invoice.alias]}</h4>
|
||||
<address class="text-sm text-gray-700">{$order.addresses.invoice.formatted nofilter}</address>
|
||||
</article>
|
||||
|
@ -162,7 +162,7 @@
|
|||
|
||||
{block name='order_carriers'}
|
||||
{if $order.shipping}
|
||||
<div class="bg-white shadow rounded-lg p-6">
|
||||
<div class="md:border md:mt-6 hidden md:p-6">
|
||||
<table class="table-auto w-full hidden md:table">
|
||||
<thead class="text-gray-700">
|
||||
<tr>
|
||||
|
@ -173,7 +173,7 @@
|
|||
<th class="px-4 py-2">{l s='Tracking number' d='Shop.Theme.Checkout'}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tbody class="text-center" >
|
||||
{foreach from=$order.shipping item=line}
|
||||
<tr>
|
||||
<td class="px-4 py-2">{$line.shipping_date}</td>
|
||||
|
|
Loading…
Reference in New Issue