Hiding Nav Items on Mobile

Site URL: https://lyceumeducation.squarespace.com/

Site URL: https://lyceumeducation.squarespace.com/

https://lyceumeducation.squarespace.com/

password: lyceum

Hi Guys,

I have hidden nav items on desktop and attempted to do the same in mobile. The mobile nav is still showing the nav items though. I have two main pages with their own nav items. This is my code I injected into the header of the page School Partners:

<style>

  /* desktop */
  
  .header-nav-item:nth-of-type( 6 ), /* admissions */
  .header-nav-item:nth-of-type( 7 ), /* applications */
  .header-nav-item:nth-of-type( 8 ), /* universities */
  .header-nav-item:nth-of-type( 9 ), /* learning */
  .header-nav-item:nth-of-type( 10 ), /* our_tutors */
  
  /* mobile */
  
  .header-menu-nav-item:nth-of-type( 6 ), /* admissions */
  .header-menu-nav-item:nth-of-type( 7 ) /* applications */
  .header-menu-nav-item:nth-of-type( 8 ) /* universities */
  .header-menu-nav-item:nth-of-type( 9 ) /* learning */
  .header-menu-nav-item:nth-of-type( 10 ) /* our_tutors */
  
    {
    
    display: none;
    
    }
    
  </style>

and the same for the Families page:

<style>

  /* desktop */
  
  .header-nav-item:nth-of-type( 2 ), /* school_partners */
  .header-nav-item:nth-of-type( 3 ), /* how_it_works */
  .header-nav-item:nth-of-type( 4 ), /* benefits */
  
  /* mobile */
  
  .header-menu-nav-item:nth-of-type( 2 ), /* school_partners */
  .header-menu-nav-item:nth-of-type( 3 ) /* how_it_works */
  .header-menu-nav-item:nth-of-type( 4 ) /* benefits */
  
    {
    
    display: none;
    
    }
    
  </style>

If anyone can see the mistake I have made, I presume with my code since its working for desktop and not mobile on both, that would be a great help!

Hi,

Which items you want to hide on School Partners/Students Families?

On 9/12/2021 at 3:17 AM, tuanphan said:

Hi,

Which items you want to hide on School Partners/Students Families?

HI @tuanphan

On School Partners page:

About Lyceum

School Partnerships

How It Works

Benefits

Tutoring

On Students / Families Page:

About Lyceum

Tutoring

Admissions

Applications

Top Universities

Learning

Our Tutors

thanks!

To anyone who might be searching for this it worked using the following code from @bangank36:

.header-menu-nav-list [data-folder="root"] .header-menu-nav-folder-content > div:nth-child(1) {
  display: none !important;
}