Jump to content

Move Navigation Position

Recommended Posts

  • Replies 8
  • Views 820
  • Created
  • Last Reply

CSS

#moving {
    color: #125781 !important;
    font-size: 14.5px !important;
    background: transparent !important;
    line-height: 0 !important;
    margin: 0 !important;
}

#moving .Header-nav-folder-item {
    color: rgba(176,176,176,.4) !important;
}

.Header-nav.Header-nav--secondary {
  display: flex !important;
}

Jquery

$(document).ready(function() {
  $('.Header-nav-item.Header-nav-item--folder').attr('id', 'moving');
  $('.Header-nav.Header-nav--secondary').append($('#moving'));
});

 

Link to comment

@rwp

Worked! Thank you so much.

Sorry to bother, but I missed a few things out.

The new screenshot below shows it with the code you provided.

Can I make the folder icon:
- Shift to the right a bit so it is next to the 'Search' icon
- Same size and colour as the search icon
- Same space between itself and the search as search is from the customer icon

Basically to make it look like it's part of the far right menu (Search, Account, Card, Currency)

Thanks for the help! Really appreciate it.

Screenshot 2020-09-28 at 02.38.05.png

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.