Page 1 of 1

Adding a new topbar-menu

Posted: 18 Aug 2020, 16:09
by jepsar
I want to add a new topbar-menu (to toggle the application language). I was hoping I could use the existing classes and scripts, so I simply duplicated `<ul class="topbar-menu">` in the topbar.xhtml file. This kind of works, after adding the CSS rule `.layout-topbar .topbar-menu { float: left; }`. The only thing is that both menu's can be opened at the same time. After having looked at the layout.js file, I'm not so sure if multiple menu's are supported, because of only having a single `$this.topbarMenuClick` boolean.

Is having multiple menu's ment to be supported and am I doing something wrong here? Or should I throw in something like a selectOneMenu?

Re: Adding a new topbar-menu

Posted: 21 Aug 2020, 10:45
by mert.sincan
should I throw in something like a selectOneMenu?
- This is related to your needs. I think you can do it with only one topbar-menu like;

Code: Select all

// topbar.xhtml
...
<div class="topbar-right">
    <ul class="topbar-menu">
        // other items
        <li class="language-item">
            <a tabindex="0">
                <i class="pi pi-home"></i>
                <span class="topbar-badge">2</span>
            </a>
            <ul class="language-menu">
                <li>
                    <a tabindex="0">
                        <i class="pi pi-home"></i>
                        EN
                    </a>
                </li>
                <li>
                    <a tabindex="0">
                        <i class="pi pi-home"></i>
                        TR
                    </a>
                </li>
            </ul>
        </li>
        // other items
    </ul>
</div>
Best Regards,

Re: Adding a new topbar-menu

Posted: 21 Aug 2020, 11:02
by jepsar
Great, thank you so much! That at least leaves me with multiple options :D

Re: Adding a new topbar-menu

Posted: 21 Aug 2020, 12:26
by mert.sincan
Glad to hear, thanks a lot for the update ;)

Re: Adding a new topbar-menu

Posted: 31 Mar 2021, 12:22
by jepsar
One small detail about the suggested solution is that the styling is off when using `language-item` and `language-menu`, so I reverted to using the profile classes. I think they could be more generic, like `topbar-right-item` and `topbar-right-menu` instead of `profile-name` and `profile-menu`.

Re: Adding a new topbar-menu

Posted: 05 May 2021, 16:21
by mert.sincan
Hi,

Thanks a lot for your feedback! We'll pay attention to it.

Best Regards,