lat9 / ZCA-Bootstrap-Template

A Bootstrap-4 template for Zen Cart versions 1.5.8 through 2.1.0. Forked from https://github.com/zcadditions/ZCA-Bootstrap-Template-for-1.5.6-v2.0.0c. See the demo site, below, for additional information.
https://zc158.vinosdefrutastropicales.com/zc158/index.php?main_page=index
GNU General Public License v3.0
4 stars 14 forks source link

Correct background bleed-through #434

Closed lat9 closed 1 month ago

lat9 commented 1 month ago

If the Sidebox Background Color is set to #ff0000, you'll see a teeny background bleed-through on any sideboxes that contain lists at the bottom of each list. That's the list-group-flush background (default: #ffffff) bleeding through:

image

lat9 commented 1 month ago

Similarly, if the Add-to-Cart Card Border Color is set to #ff00ff and site-specific styling sets #cartAdd { background-color: blue; }, there's a teeny blue bleed-through at the bottom of the add-to-cart element:

image

This Bootstrap base issue suggests adding .card-body { border-radius: inherit; } to correct the issue. Unfortunately, in this whack-a-mole situation, that results in unwanted bleed-through at the top of the element:

image

The full correction for this case is the addition of the following to the stylesheet:

.card-body {
    border-radius: inherit;
}
.card-header+.card-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

image