Support Forums

Support Online : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Salon menu questions

Featured Lock Resolved Issue
Hello, I have a few questions for css fixes of the menu:
- How to make the menu text white on hover, I usually have no problems with this but there is black sometimes when hovering.
- How to remove all the black "lines" from menu items on hover/active.
- How to make the off canvas toggler white.
- How to make the "close icon" (x) white in the off canvas menu.

Hope you can help asap, love the template apart from these issues.

Thanks, Per

10 Answers

Paul Frankowski - Staff

More than a month ago #Permalink
Hi Per,
start with this guide:
https://www.joomshaper.com/blog/which-line-of-css-i-have-to-edit-code-inspector-in-action

----
In meantime, I will give you extra tips.

Zqverto

More than a month ago #Permalink
Hi Paul,
I looked through the Helix Ultimate documentation yesterday and found nothing on these specific question. And it has to be something different from before as what I've done with previous templates doesn't work (ended up trying ::before/after etc just by chance).

It would be great if you could point me to the specific solutions, I'm a long term developer customer and don't use support unless I can't find solutions in the documentation or work it out myself.

Paul Frankowski - Staff

More than a month ago #Permalink
ad 2) No line in menu items


.sp-megamenu-parent > li > a::before, .secondary-menu > li > a::before,
.sp-megamenu-parent > li > span::before, .secondary-menu > li > span::before
{ background: none; }



ad 4) Offcanvas (x)

.close-icon::before, .close-icon::after { background-color: red; }


white won't be visible

Zqverto

More than a month ago #Permalink
Thanks, appreciate it!

Zqverto

More than a month ago #Permalink
I was too quick...
According to that documentation the toggler color can be changed with #offcanvas-toggler > i.fa {color: red;} .
Which looks like what I've used with other templates.
But in Salon it doesn't work, and the code in Salon looks like this:

Attachments (1)

  • offcanvascode.png
    offcanvascode.png 41.8 KB

Paul Frankowski - Staff

More than a month ago #Permalink
In that case try this

#offcanvas-toggler span {border-bottom: 2px solid yellow;}


===updated===

Zqverto

More than a month ago #Permalink
That's one I've tried and it shows like this (don't understand why):

Attachments (1)

  • toggler2.png
    toggler2.png 41.5 KB

Zqverto

More than a month ago #Permalink
(I pasted your code but changed to white).

Paul Frankowski - Staff

More than a month ago #Permalink
My mistake, it's late, I have to tired. I Mixed border with background.
----

#offcanvas-toggler span,
.icon-bar > span {
border-bottom: 2px solid yellow; }



Remove previous code.


There are no replies made for this post yet.
Be one of the first to reply to this post!

Leaderboard (30 days)

Sifat

Sifat

Total Accepted Answers: 133
Paul Frankowski

Paul Frankowski

Total Accepted Answers: 94
Toufiq

Toufiq

Total Accepted Answers: 28
Pavel

Pavel

Total Accepted Answers: 4
Al Mamun

Al Mamun

Total Accepted Answers: 3

113

Templates

289930

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us