But i cannot click on the three buttons on the left of my app bar even if they are under the safe area. I can click on the icon right under the profile icon. I also tested on testflight and Its also not clickable on my phone. I tried applying z-index to my app bar but no matter what it was not clickable. I also tried using marginin instead of padding but it did not fix anything.
I also tried to use env() in my css class but the app bar is placed far below the dynamic island:
This works but i would like the app bar to be right below the dynamic island. Is the content that appears in yellow on the pictures in this link clickable ?
you can add the “viewport-fit=cover” in the meta name viewport if you already have that meta tag else add the below code, in the head of index.html file.
I tried to set content inset to always but the result was the same as the second picture in my original post. There was too much space between the dynamic island and my top bar. I added this line in my apple delegate and the issue was fixed: