refactor: replace grid with flex

pagebuilder
Dinesh Salunke 2023-11-07 12:03:47 +05:30
parent e1335d23eb
commit aae3c415fc
4 changed files with 8 additions and 8 deletions

View File

@ -22,15 +22,15 @@
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
<section class="featured-products clearfix mt-3">
<h2>
<section class="flex flex-col mt-16">
<span class="text-lg mt-16 font-medium">
{if $products|@count == 1}
{l s='%s other product in the same category:' sprintf=[$products|@count] d='Shop.Theme.Catalog'}
{else}
{l s='%s other products in the same category:' sprintf=[$products|@count] d='Shop.Theme.Catalog'}
{/if}
</h2>
<div class="products">
</span>
<div class="products flex flex-wrap">
{foreach from=$products item="product"}
{include file="catalog/_partials/miniatures/product.tpl" product=$product}
{/foreach}

View File

@ -26,7 +26,7 @@
<h2 class="products-section-title text-2xl font-bold">
{l s='Popular Products' d='Shop.Theme.Catalog'}
</h2>
<div class="products grid grid-cols-1 md:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-8">
<div class="products flex flex-wrap">
{foreach from=$products item="product"}
{include file="catalog/_partials/miniatures/product.tpl" product=$product}
{/foreach}

View File

@ -23,7 +23,7 @@
* International Registered Trademark & Property of PrestaShop SA
*}
{block name='product_miniature_item'}
<a href="{$product.url}" class="group w-full flex flex-col">
<a href="{$product.url}" class="group w-full md:w-1/2 lg:w-1/3 xl:w-1/4 flex flex-col p-4">
{block name='product_thumbnail'}
{if $product.cover}
<div class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100">
@ -52,7 +52,7 @@
</div>
{/block}
{block name='product_name'}
<span class="text-xl font-medium" itemprop="name">{$product.name|truncate:30:'...'}</span>
<span class="text-lg font-light" itemprop="name">{$product.name|truncate:30:'...'}</span>
{/block}
</div>
</a>

View File

@ -23,7 +23,7 @@
* International Registered Trademark & Property of PrestaShop SA
*}
<div id="js-product-list flex flex-col">
<div class="products grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
<div class="products flex flex-wrap">
{foreach from=$listing.products item="product"}
{block name='product_miniature'}
{include file='catalog/_partials/miniatures/product.tpl' product=$product}