How to shorten the gap between menu and submenu and remove the underline in the submenu? Dawn theme

[kaylaemcfadden]

Hello, I want to shorten the gap between my dropdown menu so that it's a bit closer to the main navigation. Also, I want to remove the underline from under the submenu when it's hovered. I was able to do it for the main menu but not yet for the submenu. Thanks! 

My website is lolaatelier.fr

[niraj_patel · Accepted solution]

Hello @kaylaemcfadden 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid

<style>
 .header__submenu.list-menu {
     padding: 0 !important;
 }
 .header__submenu .header__menu-item:hover {
    text-decoration-line: unset !important;
  }
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[niraj_patel · Accepted solution]

Hello @kaylaemcfadden 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid

<style>
 .header__submenu.list-menu {
     padding: 0 !important;
 }
 .header__submenu .header__menu-item:hover {
    text-decoration-line: unset !important;
  }
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[tysonw32]

Hey how do I add space in between two custom liquids?

[niraj_patel]

I'm not understand what you want to say.

[tysonw32]

These two are custom liquid texts both the top and bottom ones. How do I add some space between them?

[PageFly-Henry · Accepted solution]

Hi @kaylaemcfadden 

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

.header__submenu{

    padding-top: 0 !important;

}

.header__menu-item {padding-top: 10px !important;}

.header__menu-item {

    padding-bottom: 0 !important;

}

.header__menu-item:hover {

    text-decoration-line: unset !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly