Responsive Classic Redesign Support thread

Quote:

---

Originally Posted by chadlly2003

To get the hamburger on the right side are just need to make some minor adjustments to the css. Let me know if you need anything else.

Step 1

Path: \includes\templates\responsive_classic\css\stylesheet_custom_navigation.css
line: 12

find this
.sidebar {
position: fixed;
top: 0;
bottom: 0;
left: 0;
width: 270px;
background-color: #fff;
transition: transform 0.3s ease-out;
}

replace

.sidebar {
position: fixed;
top: 0;
bottom: 0;
right: 0;
width: 270px;
background-color: #fff;
transition: transform 0.3s ease-out;
}



find this
line40

.sidebar.is-hidden {
transform: translateX(-300px);
}

change to
.sidebar.is-hidden {
transform: translateX(300px);
}

Step 2
path: includes\templates\responsive_classic\css\stylesheet_zcustom.css
Paste at bottom of page

.nav_spacer {grid-template-columns: 3fr 1fr auto !important;}
.nav_spacer .row {order:2}
.baralignment {margin-left:1rem;}


@media (min-width: 576px) {
.nav_spacer {grid-template-columns: 3fr 2fr auto !important;}
}


@media (min-width: 992px) {
.nav_spacer {grid-template-columns: 1fr 2fr 1fr auto !important;}
}

Attachment 20975

---

Thank you

Another question:

How do I get the logo to be in the center of page on desktop?

I removed search_header via admin but I can't figure how to have the logo in the middle of the logoWrapper.

Thank you for the assist

Just put this piece of code at the bottom of stylesheet_zcustom.css. I believe this is what you are looking for

Dont forget to remove the search bar.

Code:

---

.nav_spacer {
  display: grid;
  grid-template-columns: auto auto auto;
  justify-items: left;
  align-items: center;
  margin: auto;
}


#logoWrapper {
  display:flex;
  justify-content:center;
}



@media (min-width: 992px)  {

.nav_spacer {
grid-template-columns:1fr 2fr 1fr}

}

---

Attachment 20976

thank you.