Currently in the demo (since v3.7), the following non-default settings are used:
Mobile Menu Display Mode
The Mobile Menu Display Mode setting is set to Modal
In the Mobile Modal Settings > Header Content setting, the custom markup for the logo and button looks like this:
<div> <img src="/path-to-your-image.jpg" alt="logo"> <a href="yoursite.com/your-link" class="button-mobile">Get UberMenu</a> </div>
and the CSS used to style it:
.ubermenu.ubermenu-main .ubermenu-mobile-header > div { width:100%; display: flex; justify-content:flex-start; align-items:center; } .ubermenu.ubermenu-main .ubermenu-mobile-header img { padding: 20px; width: 100px } .ubermenu.ubermenu-main .ubermenu-mobile-header .button-mobile{ background:#2ab2a4; color:white; padding:.7em .8em; margin-left:auto; margin-right:15px; }
which can be added in the CSS Tweaks setting.
Mobile Submenu Type
For use with the Modal mode, the Mobile Submenu Type setting is set to Accordion