ZCA Bootstrap 4 Template [Support Thread]

[lat9]

I'm using ZCA Bootstrap 3.0.0 template with ZC 157b. On some screen widths , the "add to cart" quantity box on the product listing page goes partially off screen making it difficult or impossible to change the quantity from 0 to say 1. I have turned all sideboxes off. Any ideas on correcting this?
TIA,
Dave
zc157b php 7.3.21

Dave, I'm not seeing that behavior on a 'stock' installation like the demo (https://vinosdefrutastropicales.com/zc157_bs4). Perhaps if you'd be more specific with the screen widths, additional help could be provided.

[Dave224]

Cindy,

On my laptop, shrinking the browser window to about 2/3 the screen width causes the problem on your site. I estimate the problem starts at about 666 pixels based on a 9.25 inch browser window, 72 screen pixels per inch, on a 13 inch wide screen. See attached image. MacPro 15 inch (diagonal) laptop, 2014 vintage, Firefox browser (v85.0).

[Dave224]

In version 3.0.0, on a product info page, two thin lines remain if "larger image" is clicked and then the larger image is closed. The lines are borders associated with the modal header and footer. The modal-header border bottom is set to 1 px. Similarly, the modal-footer border top is set to 1 pixel. I eliminated these lines through CSS, but some people may want to keep the lines when the large image is displayed.

Dave

[lat9]

Cindy,

On my laptop, shrinking the browser window to about 2/3 the screen width causes the problem on your site. I estimate the problem starts at about 666 pixels based on a 9.25 inch browser window, 72 screen pixels per inch, on a 13 inch wide screen. See attached image. MacPro 15 inch (diagonal) laptop, 2014 vintage, Firefox browser (v85.0).

Yep, I see that too. There's a point where the width is close to the 992px transition point where those inputs don't display real well (as identified by your screenshot). I'm currently considering that a corner-case since there aren't many customers that will be doing a screen-shrink.

[DrByte]

Cindy,

On my laptop, shrinking the browser window to about 2/3 the screen width causes the problem on your site. I estimate the problem starts at about 666 pixels based on a 9.25 inch browser window, 72 screen pixels per inch, on a 13 inch wide screen. See attached image. MacPro 15 inch (diagonal) laptop, 2014 vintage, Firefox browser (v85.0).

Yep, I see that too. There's a point where the width is close to the 992px transition point where those inputs don't display real well (as identified by your screenshot). I'm currently considering that a corner-case since there aren't many customers that will be doing a screen-shrink.

A couple additional options:
- In 3.0.0 of the template if you know your customers are going to be using strangely-sized browser windows and also will have no clue how to resize their browser to see things better, then you could just change the number of columns from 3 to 2.

- The 3.1.0 version of the template does some fancier auto-placement and resizing of cells based on viewport, and you can edit the applied classes directly in the template's HTML if your needs require slightly wider (and fewer) cells at various breakpoints.