How to scale the logo in the navbar

[heatherbell]

Adjust logo size according to screen size.

Maybe experiment with CSS clamp(min, preferred, max) for much less code and easier maintenance.
Only as an example:

Code: Select all

.navbar-brand img {
  width: clamp(6rem, calc(10rem + 6vw), 25rem);
  height: auto;
  margin-top: 0;
}

[drtom]

Maybe experiment with CSS clamp(min, preferred, max) for much less code and easier maintenance.
Only as an example:

That's a new one on me. Always happy to learn.

[drtom]

So, try this in your user.css:

Code: Select all

.offcanvas-body ul.navbar-nav:last-of-type {
  margin-left: auto !important;
}

Anyway, seems to work on this demo https://psiwebsites.com/1103/ but have a test.

I did check it out, because at this point my shop really won't need a search bar.

There is one consequence you may not have intended: the items on the Horizontal Menu also scoot right.

[heatherbell]

There is one consequence you may not have intended: the items on the Horizontal Menu also scoot right.

Without the Maufacturers it will, so add the target for the cm-navbar parent like:

Code: Select all

.cm-navbar .offcanvas-body ul.navbar-nav:last-of-type {
  margin-left: auto !important;
}

[drtom]

Without the Maufacturers it will, so add the target for the cm-navbar parent like:

Code: Select all

.cm-navbar .offcanvas-body ul.navbar-nav:last-of-type {margin-left: auto !important;}

Bingo!