Page 1 of 1

Display of logo in horizontal menu mode

Posted: 25 Oct 2018, 08:44
by statistik_at
Hi,

I am using the horizontal menu mode in my application. When I load the application and decrease the width of my browser below 1025px, suddenly the logo of the application is displayed incorrectly above the top of the page.

The bug is also reproducable in the demo serenity application. Go to https://www.primefaces.org/serenity-ng/#/forms, change the Menu Mode to Horizontal Menu and decrease the width of the browser window (I am using Chrome, but the same happens on Firefox and IE).

I so far figured out, that the bug has to do with the component that is displayed on startup of the application. The demo applikation starts with the dashboard component, defined in app.routes.ts:

Code: Select all

{path: '', component: DashboardComponent},
When I swith the component to e.g.

Code: Select all

{path: '', component: FormsDemoComponent},
the bug appears.

In my application I use an empty component at startup so far, so the logo bug is apparent.

Re: Display of logo in horizontal menu mode

Posted: 25 Oct 2018, 09:58
by mert.sincan
Thanks a lot for the info. We'll check and get back to you.

Re: Display of logo in horizontal menu mode

Posted: 25 Oct 2018, 10:39
by merve7
Please you can add the below code in your stylesheet until release;

Code: Select all

.layout-wrapper .layout-main .layout-topbar .topbar-logo {
    display: none;
}

Re: Display of logo in horizontal menu mode

Posted: 07 Nov 2018, 14:59
by statistik_at
Sorry for the late reply. When I add this to my styles.scss, the logo and the application name completetly disappears.

Re: Display of logo in horizontal menu mode

Posted: 12 Nov 2018, 14:36
by merve7
Logo and application name should only appear in horizontal mode.
In mobile mode, it should be as follows.
Image

Re: Display of logo in horizontal menu mode

Posted: 19 Nov 2018, 09:56
by statistik_at
Yes, but when I add the lines, the display of the name and the logo disappears in the non-moblie mode, which is not what I want.

Re: Display of logo in horizontal menu mode

Posted: 20 Nov 2018, 13:21
by merve7
Image


To display the logo and name, your mode should be horizontal and you need to have topbar-logo style classes like the above. Please, could you check?

Re: Display of logo in horizontal menu mode

Posted: 27 Nov 2018, 09:50
by statistik_at
Yes, my menu mode is horizontal and the topbar-logo style class is there.

Re: Display of logo in horizontal menu mode

Posted: 28 Nov 2018, 09:12
by mert.sincan
Could you please try the following code instead of the above code?

Code: Select all

/* styles.scss */

@media (max-width: 1024px) {
    .layout-wrapper .layout-main .layout-topbar .topbar-logo {
        display: none;
    }
}

Re: Display of logo in horizontal menu mode

Posted: 21 Jan 2019, 15:29
by statistik_at
That worked, thanks!