Hi
I am trying to do 2 things with the navigation Bric: change the font size on mobile and the dropdown icon.
In my Bloc settings I give a font size for the Navigation Link and a color (in my case white). The color change works, but not the font size.
Then I would like to change the dropdown icon instead of an arrow down, I would like to have a custom icon or a “+” icon.
Is it possible or do I need to go through CSS?
Many thanks!
Once you add a setting there, it will create the custom class for you. Go to the Class Editor and you will see…
.navbar-nav li a
Use this to style your navigation menu.
Also use this sub class for changing the navigation on the mobile menu…
Also the reason you probably dont see any difference when you set the navigation link to 15px is its close to the default size of 1 rem, which is usually 16px.
I would suggest using rem over px personally.
You will have to add some CSS to the project header. The caret is using a Pseudo Element, you could replace it with something like this… this will give you a + font awesome icon…
<style>
.dropdown-toggle::after {
border: 0;
font-family: "Font Awesome 5 Free"; content: "\f067";
font-size: 0.5em;
margin-left: 0.5em;
}
</style>
The border 0 removed the caret.
1 Like