Burger colour mobile
-
HI
Im trying to change the colour of the burger on the mobile version to coincide with my coloured category pages / projects
i have pasted in this this code - example given for "isolated" project
.slug-fashion .burger span {
background-color: #ff1900;
}
body[data-type="category"][data-id="5"] .burger span:before,
body[data-type="category"][data-id="5"] .burger span:after{
background-color: #ff1900;
}
body[data-type="project"][data-id="875"] .burger span:before,
body[data-type="project"][data-id="875"] .burger span:after{
background-color: #ff1900;
}It works on the category pages but on the project page the middle bar of the menu remains white
have I missed something in my code?
Cheers
Toby -
Hi @Toby
you need to paste this code also in the MOBILE CSS section and not only in the DESKTOP CSS section.I hope that solves the issue!
Best!
Marius
-
@toby said in Burger colour mobile:
body[data-type="category"][data-id="5"] .burger span:before,
body[data-type="category"][data-id="5"] .burger span:after{
background-color: #ff1900;
}
body[data-type="project"][data-id="875"] .burger span:before,
body[data-type="project"][data-id="875"] .burger span:after{
background-color: #ff1900;
}Hi Marius
The code is already in my mobile css section - I added to my desktop section too
but the white middle bar still remains!?Cheers
Toby -
-
-
Hi Marius
It does until you click through into the project pages and then the middle line turns white.
Cheers
Toby -
Hi @Toby
it looks like you need to add more custom CSS code.Try to add this as well:
.burger span, .burger span:before, .burger span:after { background: red !important; }
All the best and a happy new year!
Marius
-
@mariusjopen said in Burger colour mobile:
.burger span, .burger span:before, .burger span:after {
background: red !important;
}Hi Marius
HNY
Thanks however adding that code turns the menu bar red throughout my website - overwriting the other colour changes I have for my categories - blue for architecture / green for portraits etc
is there a way to isolate that code to the project page?Cheers
Toby -
Hi @Toby
exactly. Since you have different colors for different pages.
It is quite complex to adjust the colors. Quite a pain in the ass :-)You need to play around with it. Things interfere with each other and the code can get quite messy.
You are almost there!
Good luck!!
Marius
Before you post
Use the Search Feature. Maybe there is already a solution to your issue.
1. Update Lay Theme and all Lay Theme Addons
2. Disable all Plugins
3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
4. Now see if your problem solved itself
5. Go here, see if your problem is listed here:
Troubleshooting
When you post:
1. Post a link to where the problem is
2. If the problem is difficult to explain, post screenshots / link to a video to explain it