Dekstop logo JA Resort alsways visible and on the left side?

Ninja

EIF
Hi
The logo position is in the left already http://prntscr.com/rjcxlr
can you recheck it https://ja-resort.demo.joomlart.com/
We are adding the forum tag, and i will move it to JA Resort forum.

EIF

Hi,

The logo is not ALWAYS on the left. It depends of the horizontal width in screen pixels you have.
When I recheck the demo and full size (1920 px), the logo is in the middle. (see screenshot) when I resize my window, just a little smaller,t he 'phone' block on the left disappears and the logo appears on the left.

What I want is instead of that phone block, alsways display the logo there, not matter which resolution.

Ninja

EIF
Hi
I tried same but its showing in left http://prntscr.com/rjihir
Can u tell me the browser version as my PC screen to have 1920px resolution but the view is not like in yours

EIF

Hi,

I am using Firefox (version 74) and Chrome (version 80). Both acting the same. But als in MS Edge it works the same also. I

I noticed the tipping point is 1600px. When I resize by browser window above 1600px, the logo is in the middle. When it is below the 1600px, it is on the right. When it becomes more smaller, like tablet or phone size, the menu transforms in a mobile menu, and the logo is smaller, but still on the left side.

What I like to have is the logo also on the left side if the resolutions is above the 1600px

EIF

Hi, do you have a solutions yet. Do you see the placing of the logo on the temp url https://kattenzorg.sankalhosting.nl ? Just like in the demo.

EIF

Ok, strange, because as you can see on my screen shot I have posted before, the logo is in the middle.

Ninja

EIF
Hi
I checked and its by design, the large screen show the logo in center. I asked dev team member if the possible option to move it for left in all size, i will update you if there is easy way.

EIF

thank you

EIF

Hi again,

If displaying the logo in the center is the only possibility, how can I change the breakpoint when the mobile menu appears? I like to set other pixel quantity. It all depends on how much menu items I have. I have more than the breakpoint, so when the resolutions is less, a part of the menu falls of. So when I can change the breakpoint, the menu will change to a mobile menu on a higher width resolution/

Ninja

Hi
you can select the mobile menu break point from Template style
Navigation Setting.
https://www.joomlart.com/documentation/t4-framework/navigation-settings

EIF

Hi, I did found that setting, but the issue is I can select 3 different kind of break points. Small, Medium and Large screen. But I need to change the exact pixels. The setting SM, MD and LG aren't sufficient. I have found the variables.scss file with the pixel settings, but somehow it doesn't work when I edit it.

As you can see on the screenshots I made before, the menu doesn't fit. So, how can I made it fit? How do I change the breakpoint pixels of the current template? And how do I keep the logo visible? Please help...

Edit: I found out that following css code has influence on yes/no display the logo on the left, when the resolutions of the screen goes smaller. Also has influence on the right part of the screen, which falls of.

.col-xl-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 98%;
    max-width: 50%;

When I change the max-width, suddenly it all fits and I got the logo back on the leftside. So the responsiveness of this new template doesn't work that well.

Please contact your dev team. Or maybe let they contact me, so I can show them exactly what and when things are go wrong.

Ninja

EIF
Hi
About the logo i already shared the details with dev team, it not a one line code, the above code you shared will make change all the sites.
I am afraid its not that simple. i will update you if there is solution for logo changes as its core part.

EIF

Thank you, and also thank you for your patience with me ;-)

To be clear, I have 2 main problems here:

The logo needs to be visible all the time.
The menu doesn't fit on the screen, right part falls of.

I think both issues have the same cause. Because the menu is too big, there is no room for the logo and there is no room for the the menu itself, so a part is not visible at lower resolution.

And because it doesn't fit, I got a third problem with it as well:

the most right menu option is not clickable when the resolution is not HD, between 1450 and 1600 px width. At this point the whole menu is still visible, but you can't click on the most right menu option. I noticed that it is caused by the a div called like this (name could be different sometimes):

d-none d-lg-block col-lg-2 col-hd-3

So the problem is that the menu in desktop modus is not that responsive. At the moment there is a width maximum I think. I hope the dev team can figure this out.

Besides that, a workaround may be a custom break point for the menu. The pixels in width where the menu should change to a mobile menu. As I wrote before the template settings allows me to choose from 3 options. But none of that is good. So I need to set my own pixel width breakpoint, which is in tune of my current menu width.

Could you tell me how the customize the breakpoint?

Ninja

Hi
Please open a new thread for other topics subjects. As this issue is regarding the logo showing issue and already answered. Further logo always show in each every screen sizes.

Thanks for your understanding and patience. I will update you if there is way to hack the logo code about center placement to left side for HD screens.

Regards