We’re with you. JoomShaper is offering a 20% Discount on all plans due to the impact of COVID-19.

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

Your Time: Our Time:

Menu colours..

Featured Lock Resolved Issue
Hi..

For some reason the menu color (what was beautiful) change into standard preset color Orange. In the preset styles on templates/styles.. I also can not change it.. But I do like the different colour..

Can you help?
http://www.edulink.nl

Attachments (2)

  • Schermafbeelding 2017-09-02 om 13.37.50.png
    Schermafbeelding 2017-09-02 om 13.37.50.png 16.5 KB
  • Schermafbeelding 2017-09-02 om 13.37.35.png
    Schermafbeelding 2017-09-02 om 13.37.35.png 35.4 KB

3 Answers

Paul Frankowski - Staff

More than a month ago #Permalink
Hoi,
indeed only 1st, preset1.css have those nice colors.
But you can easily copy them and use inside your custom.css file to use everywhere you want:

.sp-megamenu-parent >li:nth-child(n) > a {
color: #8ac53f;
}
.sp-megamenu-parent >li:nth-child(n) > a:before {
color: #8ac53f;
}
.sp-megamenu-parent >li:nth-child(n) .sp-dropdown li.sp-menu-item.active>a:not(.sp-group-title),
.sp-megamenu-parent >li:nth-child(n) .sp-dropdown li.sp-menu-item >a:focus,
.sp-megamenu-parent >li:nth-child(n) .sp-dropdown li.sp-menu-item >a:hover {
background-color: #8ac53f;
}
.sp-megamenu-parent >li:nth-child(2n) > a {
color: #2ab0ba;
}
.sp-megamenu-parent >li:nth-child(2n) > a:before {
color: #2ab0ba;
}
.sp-megamenu-parent >li:nth-child(2n) .sp-dropdown li.sp-menu-item.active>a:not(.sp-group-title),
.sp-megamenu-parent >li:nth-child(2n) .sp-dropdown li.sp-menu-item >a:focus,
.sp-megamenu-parent >li:nth-child(2n) .sp-dropdown li.sp-menu-item >a:hover {
background-color: #2ab0ba;
}
.sp-megamenu-parent >li:nth-child(3n) > a {
color: #f1c712;
}
.sp-megamenu-parent >li:nth-child(3n) > a:before {
color: #f1c712;
}
.sp-megamenu-parent >li:nth-child(3n) .sp-dropdown li.sp-menu-item.active>a:not(.sp-group-title),
.sp-megamenu-parent >li:nth-child(3n) .sp-dropdown li.sp-menu-item >a:focus,
.sp-megamenu-parent >li:nth-child(3n) .sp-dropdown li.sp-menu-item >a:hover {
background-color: #f1c712;
}
.sp-megamenu-parent >li:nth-child(4n) > a {
color: #ed117d;
}
.sp-megamenu-parent >li:nth-child(4n) > a:before {
color: #ed117d;
}
.sp-megamenu-parent >li:nth-child(4n) .sp-dropdown li.sp-menu-item.active>a:not(.sp-group-title),
.sp-megamenu-parent >li:nth-child(4n) .sp-dropdown li.sp-menu-item >a:focus,
.sp-megamenu-parent >li:nth-child(4n) .sp-dropdown li.sp-menu-item >a:hover {
background-color: #ed117d;
}
.sp-megamenu-parent >li:nth-child(5n) > a {
color: #92278f;
}
.sp-megamenu-parent >li:nth-child(5n) > a:before {
color: #92278f;
}
.sp-megamenu-parent >li:nth-child(5n) .sp-dropdown li.sp-menu-item.active>a:not(.sp-group-title),
.sp-megamenu-parent >li:nth-child(5n) .sp-dropdown li.sp-menu-item >a:focus,
.sp-megamenu-parent >li:nth-child(5n) .sp-dropdown li.sp-menu-item >a:hover {
background-color: #92278f;
}
.sp-megamenu-parent >li:nth-child(6n) > a {
color: #00a651;
}
.sp-megamenu-parent >li:nth-child(6n) > a:before {
color: #00a651;
}
.sp-megamenu-parent >li:nth-child(6n) .sp-dropdown li.sp-menu-item.active>a:not(.sp-group-title),
.sp-megamenu-parent >li:nth-child(6n) .sp-dropdown li.sp-menu-item >a:focus,
.sp-megamenu-parent >li:nth-child(6n) .sp-dropdown li.sp-menu-item >a:hover {
background-color: #00a651;
}
.sp-megamenu-parent >li:nth-child(7n) > a {
color: #00aeef;
}
.sp-megamenu-parent >li:nth-child(7n) > a:before {
color: #00aeef;
}
.sp-megamenu-parent >li:nth-child(7n) .sp-dropdown li.sp-menu-item.active>a:not(.sp-group-title),
.sp-megamenu-parent >li:nth-child(7n) .sp-dropdown li.sp-menu-item >a:focus,
.sp-megamenu-parent >li:nth-child(7n) .sp-dropdown li.sp-menu-item >a:hover {
background-color: #00aeef;
}


-----
Kidzy is based on Helix3 , so check it's manual as well.

Heppereen

More than a month ago #Permalink
Works!! thanks a lot


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

124

Templates

331464

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