Welcome, Guest ( Customer Panel | Login )




 All Forums
 VPCart Forum
 VP-Cart 8.00 Issues
 grey background on quick links when on mobile
 New Topic  Reply to Topic
 Printer Friendly
Author Previous Topic Topic Next Topic  

apswater
VP-CART Super User

444 Posts

Posted - May 21 2018 :  15:37:14  Show Profile  Visit apswater's Homepage  Reply with Quote
How do I change the background of the quick link and other menus when in mobile. They go black text with gray background. I can''t seem to find it in the css. It has a white background in desktop view. Here is the code for that part. you can also see it on https://www.apswater.com. Thanks!

<! LEFT BAR >
<div id="vp_leftsidebox">
<div class="col-md-3 col-sm-6 col-xs-12 col-md-pull-6 mobile-wrapper ">
<div class="vp_sidebar">
<div class="sidebarcell ">
<div id="side_freetext_title_28" class="title">
<h3 class="global-font-color">Quick Links</h3>
</div>
<div class="contentcell">
<div class="sidefreetext" ><div class="contentcell">
<ul class="sideblogs">

Edited by - apswater on May 21 2018 15:40:30

swampthink
VP-CART New User

106 Posts

Posted - May 24 2018 :  12:49:28  Show Profile  Reply with Quote
try to find this on your basic-style.css

@media (max-width: 766px)
.title {
background: #777;
}

and change the background color
Go to Top of Page

apswater
VP-CART Super User

444 Posts

Posted - May 24 2018 :  13:19:23  Show Profile  Visit apswater's Homepage  Reply with Quote
Thanks but no, that didnt fix it.

I tried all these backgrounds and nothing.

@media (max-width: 766px){
.title { background: #777; }
#flyout1 { margin-top: -20px;}
#page .title h2, #page .title h2 > a { color: #fff !important; }

.main-product > h1.global-font-color, .title > h1 {
color: #fff !important;
margin-bottom: 0px;
}

/* FOR MODAL TITLE PRODUCT HEADER */
.modal-content .title {
background: #fff;
color: #777;
}
.modal-content h1, .modal-content >.title > h1, .moda-content > .title > h2 {
background-color: #fff;
color: #777 !important;
Go to Top of Page

Alex123
VP-CART Super User

USA
223 Posts

Posted - May 24 2018 :  18:33:31  Show Profile  Reply with Quote
Your code still shows background as #777 so i doubt whether you actually modified the code. If you need white background try setting #FFFFFF as backgound color instead of #777. The code by swampthink seems working fine for me.

Might be you need to try ''Reload Shop Configuration'' too from vpcart>>advanced settings>>software configuration.

Alex
Go to Top of Page

apswater
VP-CART Super User

444 Posts

Posted - May 24 2018 :  18:44:34  Show Profile  Visit apswater's Homepage  Reply with Quote
I changed it and then changed it back when it didn''t work. I was going to search the css for #777 and look at all the places it is used.

It has to be one of these classes I would think.

<div id="vp_leftsidebox">
<div class="col-md-3 col-sm-6 col-xs-12 col-md-pull-6 mobile-wrapper ">
<div class="vp_sidebar">
<div class="sidebarcell ">
<div id="side_freetext_title_28" class="title">
<h3 class="global-font-color">Quick Links</h3>

Edited by - apswater on May 24 2018 19:22:22
Go to Top of Page

bryan23
Starting Member

Philippines
7 Posts

Posted - May 24 2018 :  21:07:17  Show Profile  Reply with Quote
Hi there,

if you still have your default basic-style.css without any modification.

locate ".title" css selector at line 638 that wrapped in media query @media (max-width: 766px) for mobile
change from:
.title {
background: #777;
}

to:
.title {
background: none;
}

then now you have to change color of the title in h2 and h1 htmltag from white to darker color. to do this, kindly do the following:

1. locate "#page .title h2, #page .title h2 > a" selector. in line 640.

change from:
#page .title h2, #page .title h2 > a {
color: #fff !important;
}

to:

#page .title h2, #page .title h2 > a {
color: #777 !important;
}

done --

and dont forget to clear browser cache for the changes take effect.

Go to Top of Page

apswater
VP-CART Super User

444 Posts

Posted - May 24 2018 :  21:47:43  Show Profile  Visit apswater's Homepage  Reply with Quote
Ding..Ding..Ding... We have a winner. Thats did it Bryan. Thanks so much.
Go to Top of Page

Alex123
VP-CART Super User

USA
223 Posts

Posted - May 25 2018 :  16:40:39  Show Profile  Reply with Quote
Thanks Bryan123 for the additional hints. The initial solution itself worked fine when i tested.

Alex
Go to Top of Page
  Previous Topic Topic Next Topic  
 New Topic  Reply to Topic
 Printer Friendly
Jump To:
Snitz Forums 2000
0 Item(s)
$0.00