[Solved] How to make changes in "full screen menu"

hi guys, I cannot find how to change font (size and color) for full screen menu? Also how to change color of symbol? I can only add background to a symbol but can’t change color of it.

Hi @piotrek

To edit the size and color of full screen menu links, you can add a class Special Navigation Links from subclass library (in Class Manager) and edit it using the Class Editor. See the screenshot below.

I am not sure if there is a better way to edit the menu icon, but you can add the code below to edit the color and shape of menu icon (shared with me with one of Blocs users).

#nav-toggle .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='black' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");

You can edit the color by changing the “black” to what you want (like hex color number or the name of color).

You can add this code using the Code Editor window we have in Blocs app.



Thanks that helped!

Hi all,

Not a clue what I am doing here - but im having a brain freeze!!!

-Sorry to bring this up - but for some reason, I just can not seem to get edit the font size on “full screen menu” on my mobile break points - I can change, colour…font…but not the size!

It’s staring me in the face and I have done it many times before ! - I can change font on all other menu’s, just not the full screen menu.

Anyone able to help.

i have created the special navigation link from subclass and this does not work how it used to.

Hi Everyone

I know a few people have asked about about the font size in full screen menu.
All other options let me change the font, and the colour - but not the size.

This seems to change it all and thank you to @Jerry who has helped me with this. Below is the class.

.nav-special.fullscreen-nav .nav > li a

1 Like