Change Colors On View Cart Page

Store Builder Questions
1

Is it possible to make all the product rows in the view cart page all the same color? If so, where and how is this change made?

If they cannot be made the same color, how do I lighten the colors without changing the "Base" color of the in the theme editor? (I cannot change that "Base" color from where it is set now because it will mess up colors on many other parts of the site.)

What I am ultimately trying to do is get rid of the darker colors. I need black (#000000) text so the darker color is way too dark for legibility, IMHO. But as I said, if I lighten the "Base" color in the theme editor, it solves my problem but it creates other site-wide color problems.

Thanks in advance.

rQgAmli.png

2

Is it possible to make all the product rows in the view cart page all the same color? If so, where and how is this change made?

If they cannot be made the same color, how do I lighten the colors without changing the "Base" color of the in the theme editor? (I cannot change that "Base" color from where it is set now because it will mess up colors on many other parts of the site.)

What I am ultimately trying to do is get rid of the darker colors. I need black (#000000) text so the darker color is way too dark for legibility, IMHO. But as I said, if I lighten the "Base" color in the theme editor, it solves my problem but it creates other site-wide color problems.

Thanks in advance.

rQgAmli.png

You need to override the .ty-table tbody tr:nth-child(2n) CSS class via Custom CSS in Visual editor. Please contact us via Help Desk if you assiatance our help with this.

3

Please try

.ty-cart-content.ty-table tbody tr {
    background: red;
}.ty-cart-content.ty-table tbody tr:nth-child(2n) {
    background: green;
}
4

I tried adding eComLabs suggestion with no result.

Than I tried adding all of below one by one...

  .ty-table tbody tr:nth-child(2n) {
       color: #fff;
  }

  .ty-table tbody tr:nth-child(2n) {
       background-color: #fff;
  }

  .ty-table tbody tr:nth-child(2n) {
       background: #fff;
  }

but no luck with those either.

5

I was able to lighten the darker row (shown above in pic) by modifying the code in the LESS file for the template. I just lowered the percentage of

.ty-table tbody tr:nth-child(2n) {
    background: darken(@base, 30%);
}

to

.ty-table tbody tr:nth-child(2n) {
    background: darken(@base, 3%);
}

Result...

k8LKckA.png

Much better legibility.

6

BTW, you can use negative values if needed. Like -5%, -10%, etc.

7

I tried adding eComLabs suggestion with no result.

Do not forget to clear the cache after the changes are applied. The code was successfully tested on the clean installation

http://prntscr.com/9sfc7z