fix(ui): iOS PWA should take full screen height #2391

Closed
KenTandrian wants to merge 16 commits from bugfix/ui-pwa-ios into main
4 changed files with 4 additions and 4 deletions

View File

@@ -267,7 +267,7 @@
}
html {
padding-top: env(safe-area-inset-top);
margin-top: env(safe-area-inset-top);
padding-bottom: env(safe-area-inset-bottom);
}

View File

@@ -1,5 +1,5 @@
<%= wrapper_element do %>
<%= tag.dialog class: "w-full h-full bg-transparent theme-dark:backdrop:bg-alpha-black-900 backdrop:bg-overlay #{drawer? ? "lg:p-3" : "lg:p-1"}", **merged_opts do %>
<%= tag.dialog class: "w-full h-full bg-transparent theme-dark:backdrop:bg-alpha-black-900 backdrop:bg-overlay pt-[env(safe-area-inset-top)] pb-[env(safe-area-inset-bottom)] #{drawer? ? "lg:p-3" : "lg:p-1"}", **merged_opts do %>
<%= tag.div class: dialog_outer_classes do %>
<%= tag.div class: dialog_inner_classes, data: { DS__dialog_target: "content" } do %>
<div class="grow overflow-y-auto py-4 space-y-4 flex flex-col">

View File

@@ -155,7 +155,7 @@
<% end %>
<%# MOBILE - Bottom Nav %>
<%= tag.nav class: "lg:hidden bg-surface shrink-0 z-10 pb-[env(safe-area-inset-bottom)] border-t border-tertiary flex justify-around" do %>
<%= tag.nav class: "lg:hidden bg-surface shrink-0 z-10 border-t border-tertiary flex justify-around" do %>
<% mobile_nav_items.each do |nav_item| %>
<%= render "layouts/shared/nav_item", **nav_item %>
<% end %>

View File

@@ -13,7 +13,7 @@
<%= yield :head %>
</head>
<body class="h-full overflow-hidden lg:overflow-auto antialiased">
<body class="h-full bg-surface overflow-hidden lg:overflow-auto antialiased">
<% if Rails.env.development? %>
<button hidden data-controller="hotkey" data-hotkey="t t /" data-action="theme#toggle"></button>
<% end %>