How to fix Catalog Filter View in Mobile

zaheer · Post by **zaheer** » 22 Jan 2021, 06:25

Hi,
The catalog filter on a mobile device looks like this (width >= 370) :

: view-disturbed.jpg (19.39 KiB) Viewed 688 times

How can I fix it to look like this :

: view-correct.jpg (18.15 KiB) Viewed 688 times

I changed the code in
\ext\ai-client-html\client\html\templates\catalog\filter\body-standard.php
<div style="width:100%;">
<?= $this->block()->get( 'catalog/filter/search' ); ?>
</div>
<?= $this->block()->get( 'catalog/filter/tree' ); ?>
<?= $this->block()->get( 'catalog/filter/price' ); ?>
<?= $this->block()->get( 'catalog/filter/supplier' ); ?>
<?= $this->block()->get( 'catalog/filter/attribute' ); ?>

This does resolve the issue but changing the core is not recommended.

Post by **aimeos** » 23 Jan 2021, 10:18

Add your own CSS in the public/css/app.css file to fix it.
Alternatively, you can run

Code: Select all

composer req aimeos/ai-client-html:2020.10.x-dev

which includes the fix.

Help for Aimeos