Faceted search OK button bad display on iPhone XS

prestarocket-agence / classic-rocket

Classic Rocket is a rework of "classic theme". It has been built keeping in mind : performance, accessibility and SEO.

https://demoprestashop.prestarocket.com/

Other

230 stars 127 forks source link

Open Hlavtox opened 5 years ago

Hlavtox commented 5 years ago

The OK button to confirm selected filters is squished on iPhone XS and others.

Additional info classic-rocket develop Prestashop 1.7.6 Faceted search 3.2.1

Image

prestarocket commented 5 years ago

maybe with btn-lg class ?

Hlavtox commented 5 years ago

I dont know how to solve it, no matter what padding you put there, Safari will cut it off it seems.

If you try it on other phones or on desktop in dev responsive mode, it looks OK.

micka-fdz commented 4 years ago

Maybe with -webkit-appearance: none; to prevent Safari from styling form elements.

Hlavtox commented 4 years ago

@prestarocket Found out it's general safari behaviour. It shrinks due to flex layout of the offcanvas modal.

This fixes it:

    #offcanvas_search_filter .modal-footer,
    #offcanvas_search_filter .modal-footer {
        flex-shrink: 0;
    }

To which CSS should I make a PR?