How do I hide an item inside a folder on mobile?

Site URL: https://aperture-22.squarespace.com/

Hello, I need to hide some pages within mobile folder navigation. I have had success on desktop (I'm hiding the first page in 'what we do' and also the first page in 'book online'). They are the only two first pages I would like to hide.

I have tried using this code to do the same on mobile:

a.Mobile-overlay-folder-item:nth-child(2) {

  display: none;

}

This however, hides all first pages within mobile view and I do not want it to do so. I only want the first page in 'what we do' and 'book online' hidden on mobile.

Thanks in advance.

Please give us the site wide password for your website so we can take a look at your issue.

Hi, it’s Frank-22

Thanks!

Add to Home > Design > Custom CSS

[data-controller-folder-toggle="what-we-do"] + a {
    display: none;
}
[data-controller-folder-toggle="book-online-folder"] + a {
    display: none;
}

That worked perfectly. Thank you!

Hi @tuanphan I have just realised that the code has now hidden the 'pricing' section within the mobile folder (it is still visible on desktop) and I do not want this section hidden. Please see screenshots. Any thoughts on how I can fix this? Thanks in advance.

 Edit code to this

[data-controller-folder-toggle="what-we-do"] {
    display: none;
}
[data-controller-folder-toggle="book-online-folder"] {
    display: none;
}

@tuanphan Could you help me with a similar problem? I am trying to hide several of the items (preventative care - dental emergencies) under "SERVICES" on mobile only.

site : https://avocado-round-p88p.squarespace.com/
password : letstalk

Thank you!

On 1/26/2021 at 10:31 AM, samantha4 said:

@tuanphan Could you help me with a similar problem? I am trying to hide several of the items (preventative care - dental emergencies) under "SERVICES" on mobile only.

site : https://avocado-round-p88p.squarespace.com/
password : letstalk

Thank you!

Add to Design > Custom CSS

a.Mobile-overlay-folder-item[href*="preventative-care"], a.Mobile-overlay-folder-item[href*="dental-emergencies"] {
    display: none;
}