ZCA Bootstrap 4 Template [Support Thread]

[jasonshanks]

Take a look in the template's stylesheet_colors.css file.

ah so no way to change it from admin then ? Aw well.

[jasonshanks]

ah so no way to change it from admin then ? Aw well.

And I really should just try something first before commenting on it. THAT WAS EASY. just edit line 64 and 62 and you can change the color. Thanks so much again guys !

[lat9]

ah so no way to change it from admin then ? Aw well.

And I really should just try something first before commenting on it. THAT WAS EASY. just edit line 64 and 62 and you can change the color. Thanks so much again guys !

FWIW, the inclusion of the coloring of that add-to-cart section is on my list of things to add to the admin-controlled coloring.

[jasonshanks]

FWIW, the inclusion of the coloring of that add-to-cart section is on my list of things to add to the admin-controlled coloring.

that would be wonderful :) You do great work along with the other devs. bootstrap feels like such a major modernizing of zencart. It looks so fresh and clean.

[lat9]

that would be wonderful :) You do great work along with the other devs. bootstrap feels like such a major modernizing of zencart. It looks so fresh and clean.

Thanks for the compliment; the change will be tracked via this GitHub issue: https://github.com/lat9/ZCA-Bootstra...late/issues/54

[dennisns7d]

Looking at the details in stylesheet_colors.css reveals that the Add Selected to Cart button on product listing pages and the Add to Cart button on product info pages were apparently intended to have the same coloring, but the cascading overruled this. Making the selectors more specific fixes this.

/* Product Listing Pages */
.btn.button_add_selected {background:#00C851;color:#FFF;}
.btn.button_add_selected:hover {background:#007E33;color:#FFF;}

/* Product Info Pages */
#addToCart-card-header, .btn.button_in_cart {background:#00C851;color:#FFF;}
.btn.button_in_cart:hover {background:#007E33;color:#FFF;}
#addToCart-card {border-color:#00C851;}

[dennisns7d]

After fixing the header alerts being hidden by the nav-bar, the bright red text for success and info alerts didn't seem appropriate (my opinion). I added the following to the template's stylesheet_colors.css file to use the standard Bootstrap text colors:

/* Keep standard bootstrap alert colors */
.alert.alert-success {color:#155724;}
.alert.alert-info {color:#0c5460;}

For me, the bright red text for danger and warning alerts were fine.

[dennisns7d]

While poking around adding products to my cart and then viewing the cart, I noticed that sometimes the trash icon didn't exhibit the usual hover action nor did it remove the product from the cart when clicked. I've determined that the cause of this is the back-to-top button. This button is visible only when one has scrolled down far enough. Until then the button is not visible due to opacity being set to 0. So even though the button is not visible, it is still "in front" of whatever is beneath it (blocking whatever action may be expected).

My "fix" was to change z-index to -1 for #back-to-top when the show class was not active (in stylesheet.css).

[lat9]

Looking at the details in stylesheet_colors.css reveals that the Add Selected to Cart button on product listing pages and the Add to Cart button on product info pages were apparently intended to have the same coloring, but the cascading overruled this. Making the selectors more specific fixes this.

/* Product Listing Pages */
.btn.button_add_selected {background:#00C851;color:#FFF;}
.btn.button_add_selected:hover {background:#007E33;color:#FFF;}

/* Product Info Pages */
#addToCart-card-header, .btn.button_in_cart {background:#00C851;color:#FFF;}
.btn.button_in_cart:hover {background:#007E33;color:#FFF;}
#addToCart-card {border-color:#00C851;}

I'll get these added to the color-selection available in the admin as well!