-
AuthorPosts
-
September 21, 2017 at 8:49 pm #855038
Hi,
i tried to use some CSS to customize burger-menu icon.
I have noticed that color is possible to set in menu section in but it’s doesn’t work me.
The same when i was using CSS for this.Could you please help me?
Here’s the site:
The CSS which i am using right now:
#header_meta .container > li.lang-item { display: none; } .my-lang { width: auto; position: relative; right: 10px; } .lang-item { display: inline; margin-right: 10px; float: right; margin-top: 6px; } .grid-entry .inner-entry { margin-right: 40px; margin-left: 40px; margin-top: 40px; margin-bottom: 40px; } .grid-entry .main_color .avia-arrow, .main_color .grid-content { background-color: #191919; color: #191919; } .main_color .grid-entry-title { background-color: #191919; color: white; } .avia-slideshow-button.avia-button.avia-color-black{ font-size: 25px; min-width: 200px;} @media only screen and (min-width: 100px) { #footer .flex_column:nth-child(1) .widgettitle { text-align: center; }} @media only screen and (min-width: 100px) { #footer .flex_column:nth-child(2) .widgettitle { text-align: center; }} @media only screen and (min-width: 100px) { #footer .flex_column:nth-child(3) .widgettitle { text-align: center; }} .comment-entry.post-entry { display: none; }
For now I’m would like to get the icons bigger (search and burger), change the color fe. black and maybe some 50% opacity background around the icon, fe. white.
Regards,
- This topic was modified 7 years, 2 months ago by itransact.
September 23, 2017 at 6:17 am #855696Hey itransact,
Are you only looking to change the colour of the burger menu? If so then please try this:
.av-hamburger-inner { background-color:red !important; }
Best regards,
RikardSeptember 25, 2017 at 9:50 am #856378Hey Rikard,
no could you please read my last message carefully?i tried to use some CSS to customize burger-menu icon.
I have noticed that color is possible to set in menu section in but it’s doesn’t work me.
The same when i was using CSS for this.For now I’m would like to get the icons bigger (search icon and burger menu icon), change the color of the icon fe. black and maybe some 50% opacity background around the icon, fe. white.
- This reply was modified 7 years, 2 months ago by itransact.
September 25, 2017 at 5:18 pm #856601Hi itransact,
THe icon will get a bit bigger if you set it to default in the theme options > main menu.
This will change the color of the burger icon#top #header.av_header_transparency div .av-hamburger-inner, #top #header.av_header_transparency div .av-hamburger-inner::before, #top #header.av_header_transparency div .av-hamburger-inner::after { background: #673AB7 !important; }
It can also be set here
https://cl.ly/2A2N2V0L0t2OIf you need further assistance please let us know.
Best regards,
VictoriaSeptember 25, 2017 at 9:17 pm #856704Victoria,
thanks – thats would help *please take a look at the attachment
but can i make it even bigger on this right now?
The same question about the “search” icon.Regards,
KamilSeptember 26, 2017 at 1:49 pm #856918Hi Kamil,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
.av-hamburger-box { width: 50px; } .av-hamburger-inner, .av-hamburger-inner::before, .av-hamburger-inner::after { height: 4px; } .av-hamburger-inner::after { bottom: -15px; } .av-hamburger-inner::before { top: -15px; } .html_burger_menu_active #top #wrap_all .menu-item-search-dropdown > a { font-size: 35px; }
If you need further assistance please let us know.
Best regards,
VictoriaSeptember 26, 2017 at 3:28 pm #856974Thank you very much :)
Regards,
KamilSeptember 26, 2017 at 5:38 pm #857052Hi,
If you need additional help, please let us know here in the forums.
Best regards,
Jordan Shannon -
AuthorPosts
- The topic ‘Burger Menu icon – size and color, border’ is closed to new replies.