Forums / Templates, Stylesheets, Page Layout / Support Thread - Responsive Color Changes for 155

Support Thread - Responsive Color Changes for 155

Started by dbltoe on 20 Jun 2016, 8:07 PM · Views: 50,896

Results 61 to 80 of 100
16 Apr 2018, 1:59 AM
#61
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,892
Plugin Contributions:
20

Support Thread - Responsive Color Changes for 155

idtags:

I was asked in this thread about these 21+ stylesheet errors.
Where could you see them as errors?

I checked in all browsers and a few mobil devices https://www.idtagsonline.com/test/ colors appear are normal.

Thank you.Well, the short answer is that you went through the stylesheet and meticulously voided any possibility of opacity.

Almost everywhere there's an rgba listing, you've changed it to 1.0 for opacity. In other words, don't use the features of the browser to soften contrast, I'll control what the customer gets. Interesting that you left it in some and didn't in others.

You have the same problem as jasonshanks on line 300 which leads me to think a bad file might have gotten into the last upload.

As far as CURRENT problems in you css, stylesheet_colors_split.css starts with > /* /* a link tags and their colors */ /which should be > / a link tags and their colors */ The system was ignoring line 2 (a:link {color:#000;}) because of that.

On lines 99 and 100 are examples of why I made the original comment. In your original haste to remove opacity, you left > .centerBoxContentsNew {color:#006699;1.0;}

.list-price {color:#006699;1.0;}which should be > .centerBoxContentsNew {color:#006699;}
.list-price {color:#006699;}

You may want to google the use of : versus ; in stylesheets. The colon is a separator between the command and "how much" of the command. I.E. width:5%

The semi-colon tells the browser that you're through with that command and to move on. You have two semi-colons on lines 99 and 100.

The beauty of open source is that you can do what you want anytime and anywhere. You just need to be careful of what you insert in the process.

Since you've been working on this for over 8 months, I hesitate to send you back in to manipulating BUT, if you are using css button styling, line 64 of stylesheet_colors_split.css has the same color for the background and text.

W3C's jigsaw can be your friend or your nemesis.:yes:

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

16 Apr 2018, 5:27 AM
#62
jasonshanks avatar

jasonshanks

Zen Follower

Join Date:
Feb 2009
Location:
atlanta GA
Posts:
297
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

could an addon have changed it ? I pretty much thought i just installed zencart and then color changer. I will do a wipe on the test site and see if i can try again. Thank you again !

Zencart 1.5.6c PHP 7.2 Order Replacement AC Adapters and Power Cords Online https://www.missingcord.com

16 Apr 2018, 5:36 AM
#63
jasonshanks avatar

jasonshanks

Zen Follower

Join Date:
Feb 2009
Location:
atlanta GA
Posts:
297
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

So I opened the stylesheet.css directly from the archive i downloaded from this site. And I don't see the missing colon in the fresh file either.Attachment 17801

Zencart 1.5.6c PHP 7.2 Order Replacement AC Adapters and Power Cords Online https://www.missingcord.com

16 Apr 2018, 6:17 PM
#64
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,892
Plugin Contributions:
20

Re: Support Thread - Responsive Color Changes for 155

Yep, as I mentioned in the answer to idtags, it looks as if a mistake got in the upload of 1.1a

Line 291 of the download file should be```
#filter-wrapper select{width[B]:2[/B]5%;height:35px;}


It's there in all the copies on my home machine.  :blush:

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

16 Apr 2018, 8:39 PM
#65
jasonshanks avatar

jasonshanks

Zen Follower

Join Date:
Feb 2009
Location:
atlanta GA
Posts:
297
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

oh sorry about that. I actually didn't see your reply to the other poster. I was actually responding to your post to me. Hey typos happen , I kinda figured it was something like that anyway ! I am happy this is something that is easy to fix however.

Zencart 1.5.6c PHP 7.2 Order Replacement AC Adapters and Power Cords Online https://www.missingcord.com

13 Sep 2018, 6:36 PM
#66
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

Is there a way to change the colors on android? I made changes in the css that changed the colors on desktop, but android still the same.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!

13 Sep 2018, 10:54 PM
#67
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,892
Plugin Contributions:
20

Re: Support Thread - Responsive Color Changes for 155

As I posted in your other thread, your problem may be the cache on your phone. IF you are using our mod and have not left or added some other stylesheet, colors are not defined in any of the stylesheets for phones, tablets, etc.

Might we have a link?

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

13 Sep 2018, 11:56 PM
#68
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

dbltoe:

As I posted in your other thread, your problem may be the cache on your phone. IF you are using our mod and have not left or added some other stylesheet, colors are not defined in any of the stylesheets for phones, tablets, etc.

Might we have a link?

I cleared the cache and I also tried my friends tablet with same result and I had never used his tablet before.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!

14 Sep 2018, 12:28 AM
#69
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,892
Plugin Contributions:
20

Re: Support Thread - Responsive Color Changes for 155

If you can't give us a link, can you mail us your friend's tablet?:P

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

14 Sep 2018, 1:19 AM
#70
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

dbltoe:

If you can't give us a link, can you mail us your friend's tablet?:P

Thats too funny.

Link wont help. However I can give you the color css file or whatever file you think could be causing the problem.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!

14 Sep 2018, 1:56 AM
#71
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,892
Plugin Contributions:
20

Re: Support Thread - Responsive Color Changes for 155

pixelpadre:

Link wont help. However I can give you the color css file or whatever file you think could be causing the problem.You may think that, but (seriously) think about that.

Which would I rather do? Spend time going through your site to fix the problem or just send you a file/filename and be done with it?

The request for a link is in the Posting Tips for a reason. What could be done in minutes with a link, you want me to spend hours back and forth guessing each time?

I'm happy to help. I just need a little help from you as well. Like your original post. Maybe if we knew which colors you changed? Was is simply a font color change in a Nav bar? More involved I would GUESS since you are seeing a big difference.

Help us out here.

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

14 Sep 2018, 2:16 AM
#72
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

The problem does not exist for my earlier v155 sites just the latest 155f. Colors changed were the two bars above and below the header wrapper. I will also add that I changed the color of the hamburger successfully.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!

14 Sep 2018, 12:31 PM
#73
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,892
Plugin Contributions:
20

Re: Support Thread - Responsive Color Changes for 155

I would LOVE to be able to lead you out of the darkness on this, BUT...

  1. If both the earlier and 155f sites are using responsive_classic with our mod, what is the difference that makes the colors not work? I ask because, if they are NOT both using responsive_classic with our mod, it stands to reason one would work and one might not. At least I hope so.
  2. In the other post, you mentioned that you "changed line 27" and that worked. There is only one line 27 in any of the modded template's css files that deals with a color. That line is in the stylesheet_colors_split.css for an a:hover. You will need to make bookmarklets to view the hover on an Android phone.
  3. I know where several bars are located (retired military), but you don't mention what bars you are talking about. Please don't answer, "the green ones.":frusty:
  4. You did mention the headerWrapper, but you didn't specify whether you meant the headerWrapper call in the css (way far away from line 27 BTW) or the headerWrapper line when viewing the source, or some other location.
  5. You also mentioned you managed to change the hamburger. That is a fontawesome icon that is controlled by stylesheet_css_buttons.css. It is not part of the mod and, unless physically changed, is the same all over as far as colors.

I'll make one last try for one eensy bit of information. What is the name of the file in which you changed line 27? See number 2, above.

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

14 Sep 2018, 1:27 PM
#74
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

dbltoe:

I would LOVE to be able to lead you out of the darkness on this, BUT...

  1. If both the earlier and 155f sites are using responsive_classic with our mod, what is the difference that makes the colors not work? I ask because, if they are NOT both using responsive_classic with our mod, it stands to reason one would work and one might not. At least I hope so.
  1. In the other post, you mentioned that you "changed line 27" and that worked. There is only one line 27 in any of the modded template's css files that deals with a color. That line is in the stylesheet_colors_split.css for an a:hover. You will need to make bookmarklets to view the hover on an Android phone.
  1. I know where several bars are located (retired military), but you don't mention what bars you are talking about. Please don't answer, "the green ones.":frusty:
  1. You did mention the headerWrapper, but you didn't specify whether you meant the headerWrapper call in the css (way far away from line 27 BTW) or the headerWrapper line when viewing the source, or some other location.
  1. You also mentioned you managed to change the hamburger. That is a fontawesome icon that is controlled by stylesheet_css_buttons.css. It is not part of the mod and, unless physically changed, is the same all over as far as colors.

I'll make one last try for one eensy bit of information. What is the name of the file in which you changed line 27? See number 2, above.

Sorry if I misled you. I am not using any mods, just classic responsive theme. The hamburger color is controllable in css. The stylesheet_colors.css can be seen here with line 27 mainwrapper (not headerwrapper) color...amongst others. floridavoterregistration.com/stylesheet_colors.css. Like I said, it appears this is a limitation of classic responsive out of the box. Not a big deal having no colors for the android version. I just wasted a lot of time trying to figure out why desktop changes but android does not.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!

14 Sep 2018, 1:59 PM
#75
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

Ok. So I cloned and installed. Slick. For whatever reason......out of the box CR will not modify android colors. Someone should chase that down because clearly, your mod will change android colors.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!

14 Sep 2018, 2:18 PM
#76
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,892
Plugin Contributions:
20

Re: Support Thread - Responsive Color Changes for 155

You've come across the major reason we created the mod for changing color. If you look at the stylesheet (you know you could have posted it with the # symbol) you'll see the following:```
/bof font colors/body, .messageStackSuccess, .messageStackCaution, #tagline, #productQuantityDiscounts table, .categoryListBoxContents a, h2.greeting a {color:#000000;}
a:link, #navEZPagesTOC ul li a, a:hover, #navEZPagesTOC ul li a:hover, #navMain ul li a:hover, #navSupp ul li a:hover, .sideBoxContent a:visited, fieldset fieldset legend, #navBreadCrumb a:visited, #siteinfoLegal a, h3.rightBoxHeading a:hover, h3.leftBoxHeading a:hover, .cartTotalDisplay, .cartOldItem, .specialsListBoxContents, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .list-price, .itemTitle a, h2.greeting, #icon, h1, .header .fa-bars {color:#05a5cb;}
a:visited, .cat-count, .itemTitle a:hover, h2.greeting a:hover {color:#666;}
a:active {color:#0000ff;}
h2, h3, .cartAttribsList, #cart-box {color:#444;}
.blue{color:#05a5cb !important;}
.blue:hover{color:#036f89 !important;}
.alert {color: #8b0000;}
legend, .specialsListBoxContents a, .centerBoxContentsAlsoPurch a, .centerBoxContentsFeatured a, .centerBoxContentsSpecials a, .centerBoxContentsNew a, .productPriceDiscount{color:#333;}
.messageStackWarning, .messageStackError, #navMainWrapper, #navMain ul li a, #navCatTabsWrapper, #navCatTabs li a, #navCatTabs li a:hover, #navCatTabs li:hover, #navEZPagesTop, #navEZPagesTop li a, .pagination li a, #navSuppWrapper, #navSupp li a, #siteinfoIP, #siteinfoLegal, #bannerSix, #siteinfoLegal a:hover, h2.centerBoxHeading, h3.rightBoxHeading, h3.leftBoxHeading, h3.rightBoxHeading a, h3.leftBoxHeading a, .seDisplayedAddressLabel, TR.tableHeading, #shippingEstimatorContent h2, #shippingEstimatorContent th, #checkoutConfirmDefault .cartTableHeading, #filter-wrapper, .navSplitPagesLinks a, .current, .productListing-rowheading a, .productListing-rowheading a, .prod-list-wrap, #productQuantityDiscounts table tr:first-child td, #reviewsWriteHeading, #sendSpendWrapper h2, #accountDefault #sendSpendWrapper h2, #gvFaqDefaultSubHeading, #checkoutPayAddressDefaultAddress, #checkoutShipAddressDefaultAddress, #accountLinksWrapper h2, h2#addressBookDefaultPrimary, #myAccountPaymentInfo h3, #myAccountShipInfo h3, #myAccountPaymentInfo h4, #myAccountShipInfo h4, input.submit_button, input.submit_button:hover, input.cssButtonHover, span.normal_button{color: #ffffff;}
.cartNewItem {color:#33cc33;}
.productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount {color:#ff0000;}
.categoryListBoxContents a:hover, .categoryListBoxContents:hover a{color:#05a5bc;}
.list-more{color:#fff !important;}
/bof background colors/
body, #mainWrapper, #headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #contentMainWrapper, #headerWrapper, .sideBoxContent, .rightBoxContent, .rowOdd, #productQuantityDiscounts table, #accountLinksWrapper {background:#fff;}
input:focus, select:focus, textarea:focus, .specialsListBoxContents:hover, .centerBoxContentsSpecials:hover, .centerBoxContentsAlsoPurch:hover, .centerBoxContentsFeatured:hover, .centerBoxContentsNew:hover, .categoryListBoxContents:hover, .sideBoxContentItem:hover, .productListing-odd, #pinfo-right, #sendSpendWrapper {background:#f4f4f4;}
#mainWrapper {background:#00308f;}
.messageStackCaution {background-color:#ffff66;}
fieldset, .rowEven, #shippingEstimatorContent tr:nth-child(odd), #order-comments, ul.list-links li:hover, ol.list-links li:hover, #no-products, .listing-wrapper:nth-child(odd), #reviews-write-wrapper, #gvFaqDefaultContent, #checkoutPayAddressDefault .instructions, #checkoutShipAddressDefault .instructions, #addressBookDefault .instructions, #myAccountNotify, #myAccountGen, .reviews-wrapper, #accountHistInfo table td, #prevOrders td, #myAccountPaymentInfo, #myAccountShipInfo, #accountDefault #sendSpendWrapper{background:#eee;}
.tableHeading{background-color:#e9e9e9;}



Whichever loads last is king.  You can put #00308f in a call twenty times, but if the last-loading stylesheet has #fff -- you're gonna get white.

AND>>>> Now that I've seen the site, I can tell you that the color is never going to show on any mobile phone UNLESS you force the phone to show at least one of the the side columns.  By default, the left and right columns do NOT display on a mobile phone.

If you want to see that the color is really there, change the background on line 18 of stylesheet_colors.css to none or to the #00308F.  Or, place your mouse over the right-hand side of your browser and drag the browser so it closes to the left.  At approximately 1000px, the desktop will show the same as the android.

IOW, it's been doing what it was supposed to do by default from the beginning.

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

14 Sep 2018, 2:35 PM
#77
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

Couple of things. I am back to square one.

204: #navMainWrapper {background-color:#0a4d90;background-color:rgba(10,77,144);} if I change the color on this line the desktop works as expected...but android is still stuck on a default color.

Also I am not following you on displaying left and right columns on an android.

Also dragging firefox to small window gives a different result from an android.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!

14 Sep 2018, 2:51 PM
#78
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

Unfortunately firefox element inspection is not possible on an android, otherwise we would not be having this discussion.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!

14 Sep 2018, 2:54 PM
#79
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,892
Plugin Contributions:
20

Re: Support Thread - Responsive Color Changes for 155

204: #navMainWrapper {background-color:#0a4d90;background-color:rgba(10,77,144);}First, the line is invalid unless you add the a value to the rgba call. I don't believe the line will be accepted. Should be something like```
204: #navMainWrapper {background-color:#0a4d90;background-color:rgba(10,77,144,0.7);}


Also, you need to run buy a lotto ticket while you can:P  Or maybe not.  Depends on whether or not you think it's lucky to find the two biggest things that go away on a mobile phone.

The mainWrapper is hidden by the center column in the phone view because the side columns (categories on the left and Search on the Right) are not shown on a phone unless they are forced to be.  Otherwise they are accessed by the hamburger.  The navMainWrapper is replaced in responsive mode by the css buttons with the hamburger.

So, you're two for two.  Unless you get out the explosives and really blow up what Zen Cart is designed to do on a phone, you will never see the background colors of the mainWrapper OR the navMainWrapper.  Depending on the tablet screen size, you may see the navMainWrapper on a tablet.  The iPad shows the navMainWrapper in landscape but not portrait.

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

14 Sep 2018, 3:42 PM
#80
pixelpadre avatar

pixelpadre

Suspended

Join Date:
Jun 2007
Location:
Eustis, Florida, USA, EARTH
Posts:
868
Plugin Contributions:
0

Re: Support Thread - Responsive Color Changes for 155

We are getting close but still far away. Your default powder blue with the hamburger is still on my android, yet my desktop shows a different color. And its not the cache.

ZC v1.5.7 "I was so much older then...I'm younger than that now" Cut the umbilical cord with webhosts after 20 years. FREEDOM!