Responsive Logo / Navigation Help

Design help General
1

Hi there. I’m wondering if someone could advise me on how to do this:

So I have a pretty standard nav bar for desktop with the logo on the left with a logotype. I want the nav bar for tablet/mobile to have a menu symbol (easy enough) but I want the menu to be on the left and the logo to move to the middle and I want the logo to change on the mobile to a simplified version of the logo with no logotype. When I try to change it at the breakpoints mentioned it makes the changes on desktop too.

Is there a way around this?

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

I’m not sure about your implementation, but I expect have applied flex or grid layout on the menu. If that is the case then you can easily change the position of the inner elements, with order settings for the child element. Just select the child element and change the order.

Screen Shot 2022-08-08 at 10.38.51 PM
Screen Shot 2022-08-08 at 10.38.51 PM750×1160 59.3 KB

And changing logos through the breakpoints should work, but I’m not totally sure about the issue.
Also it would be best to check your project to properly diagnose the issue.