Jump to content

Remove main underline

Recommended Posts

Site URL: https://www.nickbarr.co/

Hey,

I added some code to reveal an underline on selected menu titles on roll over.

How do I remove the main page underline. Here is my code and screen grab. I have tried other older posts but nothing has worked.

@media screen and (min-width:768px) {
/* masonry-gallery-image-grow-on-hover sqs.7.1  */
.gallery-masonry-wrapper :hover img {
               display: inline-block;
               vertical-align: middle;
               -webkit-transform: translateZ(0);
                       transform: translateZ(0);
               box-shadow: 0 0 1px rgba(0, 0, 0, 0);
               -webkit-backface-visibility: hidden;
                       backface-visibility: hidden;
                   -moz-osx-font-smoothing: grayscale;
               -webkit-transition-duration: 0.3s ;
                       transition-duration: 0.3s ;
               -webkit-transition-property: transform;
                       transition-property: transform;
             }
            .gallery-masonry-wrapper :hover img,
             .gallery-masonry-wrapper:active img {
               -webkit-transform: scale(1.0) ;
                       transform: scale(1.02
                       ) ;
             }
.header-nav-item a:hover {
    color: grey !important;
}
}
.header-nav-item a:hover {
    text-decoration: underline;
}

Screen Shot 2020-05-12 at 3.04.53 PM.png

Link to comment
  • Replies 9
  • Views 1.1k
  • Created
  • Last Reply

Do you mean remove the line under the active navigation item? You can do this by adding this code to Design > Custom CSS

/* remove underline on nav */
.header-nav-item--active a {
  background-image: none !important;
}

 

Link to comment
  • 4 months later...

Hi @carolynmackin,

Montauk has a different code base. Here's what you'll need to add to Design > Custom CSS to remove the active link underline:

#topNav ul>li.active-link>a {
border-bottom-width: 0 !important;
}

 

Link to comment
  • 6 months later...

Hi @brightbarboston, you're on a 7.1 template so you'll need to use this code:

/* change header nav active style */
.header-nav-item--active a {
  background-image: none !important;
}

You can find that and lots more in this post: How to Customize your Navigation in Squarespace 7.1

If that code isn't working for you, check and see if you already have some custom code affecting navigation - you'd need to edit that instead.

Link to comment
15 minutes ago, christyprice said:

Hi @brightbarboston, you're on a 7.1 template so you'll need to use this code:


/* change header nav active style */
.header-nav-item--active a {
  background-image: none !important;
}

You can find that and lots more in this post: How to Customize your Navigation in Squarespace 7.1

If that code isn't working for you, check and see if you already have some custom code affecting navigation - you'd need to edit that instead.

Hey! I tried that and it still wont go away! My site is brightbarboston.com

any chance you could take a peak at it?

Link to comment

@brightbarboston, this is not an elegant solution, but it should get you there:

.tweak-global-animations-animation-type-flex .header-nav-item:not(.header-nav-item--folder) a::after, .tweak-global-animations-animation-type-flex .header-nav-folder-item a::after {
    height: 0;
}

 

Link to comment
On 4/13/2021 at 5:45 PM, christyprice said:

@brightbarboston, this is not an elegant solution, but it should get you there:


.tweak-global-animations-animation-type-flex .header-nav-item:not(.header-nav-item--folder) a::after, .tweak-global-animations-animation-type-flex .header-nav-folder-item a::after {
    height: 0;
}

 

Thanks Christine! One more question actually!

I am trying to do a title overlap slideshow but it looks pretty weird on front page so I deleted the "A Tan you can Trust" line for now. I can't figure this out but I want my header slideshow to look like this but I can't get rid of the padding: any thoughts? This is my current site:

https://brightbarboston.com

Here is the goal:

https://katiforner.com/

 

Thank you in advance!

Screen Shot 2021-04-08 at 5.36.02 AM.png

Screen Shot 2021-04-08 at 5.37.26 AM.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.