How to give menu icons a gradient

Hi,

I'd like to give the header menu items a gradient. I did it as follows right now:

.mcb-section .mcb-wrap .mcb-item-55f53b038 .mfn-header-menu .mfn-menu-item-icon > i 

{

  background: linear-gradient(45deg, #00acee, #00e1ef) !important;

  -webkit-background-clip: text !important;

  -webkit-text-fill-color: transparent !important;

  background-clip: text !important;

  text-fill-color: transparent !important;

}


It's not the right way since the icons turn to regular color with Sticky Header. I wish there was a way to configure Gradient naturally in BeBuilder but do you have some better tip to give gradients to icons?

Thanks!

Comments

Sign In or Register to comment.