forked from brooksbingham/theme-elegance
chore: updated the template files to add the accordion
parent
d6c622a60a
commit
2c937230bf
|
@ -24,7 +24,7 @@
|
|||
*}
|
||||
{if $facets|count}
|
||||
<div id="search_filters">
|
||||
<div id="search_filter_buttons" class="flex">
|
||||
<div id="search_filter_buttons" class="flex hidden">
|
||||
{block name='facets_clearall_button'}
|
||||
{if $activeFilters|count}
|
||||
<button id="_desktop_search_filters_clear_all" data-search-url="{$clear_all_link}" class="flex w-6 h-6 flex items-center justify-center select-none js-search-filters-clear-all">
|
||||
|
@ -44,15 +44,16 @@
|
|||
{/if}
|
||||
{/block}
|
||||
</div>
|
||||
<div class="th-accordion">
|
||||
{foreach from=$facets item="facet"}
|
||||
{if !$facet.displayed}
|
||||
{continue}
|
||||
{/if}
|
||||
{if $facet.widgetType === 'dropdown'}
|
||||
<div class="border-t border-gray-200 px-4 py-4">
|
||||
<div class="th-accordion-item border-t border-gray-200 px-4 py-4">
|
||||
<h3 class="-mx-2 -my-3 flow-root">
|
||||
<!-- Expand/collapse section button -->
|
||||
<button id="show-filters-{$facet.label}" data-filter-name="{$facet.label}" type="button" class="flex w-full items-center justify-between bg-white px-2 py-3 text-gray-400 hover:text-gray-500" aria-controls="filter-section-mobile-0" aria-expanded="false">
|
||||
<button id="show-filters-{$facet.label}" data-filter-name="{$facet.label}" type="button" class="th-accordion-item-trigger flex w-full items-center justify-between bg-white px-2 py-3 text-gray-400 hover:text-gray-500" aria-controls="filter-section-mobile-0" aria-expanded="false">
|
||||
<span class="font-medium text-gray-900">
|
||||
{$active_found = false}
|
||||
{foreach from=$facet.filters item="filter"}
|
||||
|
@ -75,7 +76,7 @@
|
|||
</button>
|
||||
</h3>
|
||||
<!-- Filter section, show/hide based on section state. -->
|
||||
<div class="pt-6 px-4 hidden" id="filter-section-{$facet.label}" data-filter-name="{$facet.label}">
|
||||
<div class="th-accordion-item-content pt-6 px-4 hidden" id="filter-section-{$facet.label}" data-filter-name="{$facet.label}">
|
||||
<div class="flex flex-wrap w-full">
|
||||
{foreach from=$facet.filters item="filter"}
|
||||
{if !$filter.active}
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
*}
|
||||
|
||||
<div id="js-product-list-top" class="bg-white">
|
||||
<div class="relative z-40 lg:hidden" role="dialog" aria-modal="true">
|
||||
<div class="relative z-40" role="dialog" aria-modal="true">
|
||||
<div class="fixed inset-0 z-50 flex">
|
||||
<div id="product-list-top-filters" class="relative mr-auto flex h-full w-screen md:w-64 flex-col overflow-y-auto bg-white py-4 pb-12 shadow-xl">
|
||||
<div class="flex items-center justify-between px-4">
|
||||
|
@ -39,14 +39,15 @@
|
|||
</button>
|
||||
</div>
|
||||
<form class="mt-4 border-t border-gray-200">
|
||||
{block name='sort_by'}
|
||||
{include file='catalog/_partials/sort-orders.tpl' sort_orders=$listing.sort_orders}
|
||||
{/block}
|
||||
{if !empty($listing.rendered_facets)}
|
||||
{include file='catalog/_partials/facets.tpl'}
|
||||
{else}
|
||||
<div></div>
|
||||
{/if}
|
||||
{block name='sort_by'}
|
||||
{include file='catalog/_partials/sort-orders.tpl' sort_orders=$listing.sort_orders}
|
||||
{/block}
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -23,10 +23,11 @@
|
|||
* International Registered Trademark & Property of PrestaShop SA
|
||||
*}
|
||||
|
||||
<div class="border-t border-gray-200 px-4 py-4">
|
||||
<div class="th-accordion">
|
||||
<div class="th-accordion-item border-t border-gray-200 px-4 py-4">
|
||||
<h3 class="-mx-2 -my-3 flow-root">
|
||||
<!-- Expand/collapse section button -->
|
||||
<button id="show-sort-by" type="button" class="flex w-full items-center justify-between bg-white px-2 py-3 text-gray-400 hover:text-gray-500" aria-controls="filter-section-mobile-0" aria-expanded="false">
|
||||
<button id="show-sort-by" type="button" class="th-accordion-item-trigger flex w-full items-center justify-between bg-white px-2 py-3 text-gray-400 hover:text-gray-500" aria-controls="filter-section-mobile-0" aria-expanded="false">
|
||||
<span class="font-medium text-gray-900">
|
||||
Sort By
|
||||
</span>
|
||||
|
@ -40,13 +41,13 @@
|
|||
</button>
|
||||
</h3>
|
||||
<!-- Filter section, show/hide based on section state. -->
|
||||
<div class="pt-6 hidden" id="filter-section-sort-by">
|
||||
<div class="flex flex-wrap w-full">
|
||||
<div class="pt-6 hidden th-accordion-item-content" id="filter-section-sort-by">
|
||||
<div class="flex flex-col w-full gap-4">
|
||||
{foreach from=$listing.sort_orders item=sort_order}
|
||||
<a
|
||||
rel="nofollow"
|
||||
href="{$sort_order.url}"
|
||||
class="select-list text-sm w-1/4 mb-4 {['current' => $sort_order.current, 'js-search-link' => true]|classnames}"
|
||||
class="select-list text-sm shrink-0 {['current' => $sort_order.current, 'js-search-link' => true]|classnames}"
|
||||
>
|
||||
{$sort_order.label}
|
||||
</a>
|
||||
|
@ -54,6 +55,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{*
|
||||
|
|
Loading…
Reference in New Issue