How can I collapse navigation folders in the mobile menu (Wells template)

Site URL: https://henriqueisidoro.com

By default, the Wells template displays all navigation folders as expanded in the mobile menu, so you see all sub pages. I want people to be able to click on a folder to expand it, otherwise the mobile menu is way too busy. Is there code injection I can use to collapse the folders in the mobile menu? Thanks so much! 

I tried this one: (it works, but when it opens it's not able to show all the options, because it crops)

/* Put this into Settings->Advanced->Code injection->Footer */
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style>
.mobile-folder > ul { display: none; }
</style>
<script>
$(document).ready(function() {
	$(document).on("click", ".mobile-folder > a", function(e) {
      e.preventDefault();
      $(this).next("ul").slideToggle()    
      return false;
  })
});
</script>

16 hours ago, henriquepisidoro said:

Site URL: https://henriqueisidoro.com

By default, the Wells template displays all navigation folders as expanded in the mobile menu, so you see all sub pages. I want people to be able to click on a folder to expand it, otherwise the mobile menu is way too busy. Is there code injection I can use to collapse the folders in the mobile menu? Thanks so much! 

I tried this one: (it works, but when it opens it's not able to show all the options, because it crops)

/* Put this into Settings->Advanced->Code injection->Footer */
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style>
.mobile-folder > ul { display: none; }
</style>
<script>
$(document).ready(function() {
	$(document).on("click", ".mobile-folder > a", function(e) {
      e.preventDefault();
      $(this).next("ul").slideToggle()    
      return false;
  })
});
</script>

 

Hi. What is site access password?