zeon-studio / hugoplate

Hugoplate is a free starter template built with Hugo and TailwindCSS that will save you hours of work.
https://zeon.studio/preview?project=hugoplate
MIT License
870 stars 241 forks source link

Navigation not working properly on mobile #30

Closed chark1es closed 1 year ago

chark1es commented 1 year ago

When on mobile and you click the button to bring out the navigation, any navigation that has a dropdown does not work.

For example, on the demo website of hugoplate, when you press the menu button and try to press Pages, it will not show the pages linked to it.

tfsomrat commented 1 year ago

Are you sure? I have not experienced anything like this. I just rechecked the demo, and it's working fine. no issues. can you send me a screen record?

chark1es commented 1 year ago

Are you sure? I have not experienced anything like this. I just rechecked the demo, and it's working fine. no issues. can you send me a screen record?

My bad, I was using as an example to explain the problem. It's only effected on mobile devices, at least on iPhones. It's very difficult to screen record since I'm on a mobile and my physical action is difficult to record.

For the iPhone (not a simulated window using google inspect), I would have to press and hold for the dropdown in the navbar in order to show its children. The Hugo demo website works fine for me but something seems wrong with my website.

The GitHub repo is chark1es/gdpt-anoma and the website is https://chuavanhanh.org

I've been trying to mess around with the header partial but I'm not getting it to work. I'm kind of a beginner in frontend/backend so it's a little difficult for me to solve. I'm assuming it has to do something with the css?

tfsomrat commented 1 year ago

I don't know why, but the navbar on the desktop view also looks messed up on your site.

chark1es commented 1 year ago

I was experimenting earlier, but I reverted the changes. The navbar should look like similarly to the demo website now. I believe you would have to clear any cookies / anything cached on the site.

I might be wrong, but on the header.html partial, there's configurations for lg but not for any other size. Is this so it shows the entire navigation when its a large size but on any smaller size it shows the menu icon?

Productivix commented 1 year ago

same : "pages" menu does not work on mobiles : see: Capture d’écran_2023-08-28_09-50-29

tfsomrat commented 1 year ago

Hey everyone, I have added a little script to the toggle menu on mobile, instead of only the CSS hover effect. update the theme and enjoy. thanks

ElioDiNino commented 1 year ago

What is the recommended approach to "update the template"? Running npm run update-modules doesn't update the theme.