From 6824f0a42328976f27ea0939e057c8ce95516560 Mon Sep 17 00:00:00 2001 From: ByteBard11 Date: Sun, 3 Aug 2025 12:38:26 +1000 Subject: [PATCH 01/12] Copy of fix(ui): iOS PWA should take full screen height #2391 https://github.com/maybe-finance/maybe/pull/2391 With updated _notice tab safety area. Further fix: adjust padding to margin for safe area insets across notify compents Fix profiler location Good DRY fix from gemini Restore bottom safe area. Should be small adjust to allow for device return bar, etc. --- app/assets/tailwind/application.css | 5 +++++ app/assets/tailwind/maybe-design-system.css | 2 +- app/components/DS/dialog.html.erb | 2 +- app/views/layouts/application.html.erb | 2 +- app/views/layouts/shared/_htmldoc.html.erb | 2 +- 5 files changed, 9 insertions(+), 4 deletions(-) diff --git a/app/assets/tailwind/application.css b/app/assets/tailwind/application.css index e2df294c3e6..ee54d6cb2d0 100644 --- a/app/assets/tailwind/application.css +++ b/app/assets/tailwind/application.css @@ -38,6 +38,11 @@ } } +.profiler-button { + position: fixed; + top: env(safe-area-inset-top, 0); +} + .combobox { .hw-combobox__main__wrapper, .hw-combobox__input { diff --git a/app/assets/tailwind/maybe-design-system.css b/app/assets/tailwind/maybe-design-system.css index de87765faeb..e8fb9488a9f 100644 --- a/app/assets/tailwind/maybe-design-system.css +++ b/app/assets/tailwind/maybe-design-system.css @@ -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); } diff --git a/app/components/DS/dialog.html.erb b/app/components/DS/dialog.html.erb index ca8f86b7d5d..72b8c07409b 100644 --- a/app/components/DS/dialog.html.erb +++ b/app/components/DS/dialog.html.erb @@ -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 %>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 02854276b29..81cb66bc623 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -156,7 +156,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 %> diff --git a/app/views/layouts/shared/_htmldoc.html.erb b/app/views/layouts/shared/_htmldoc.html.erb index 25b0ba7730c..5d11b3f25e1 100644 --- a/app/views/layouts/shared/_htmldoc.html.erb +++ b/app/views/layouts/shared/_htmldoc.html.erb @@ -13,7 +13,7 @@ <%= yield :head %> - + <% if Rails.env.development? %> <% end %> From abf24f18e02679c8d441b50c05da6a5660d41bdc Mon Sep 17 00:00:00 2001 From: ByteBard11 <140880095+ByteBard11@users.noreply.github.com> Date: Sat, 25 Oct 2025 14:17:12 +1100 Subject: [PATCH 02/12] fix scrolling issues --- app/assets/tailwind/maybe-design-system.css | 5 ----- app/views/layouts/application.html.erb | 6 +++--- app/views/layouts/shared/_htmldoc.html.erb | 2 +- 3 files changed, 4 insertions(+), 9 deletions(-) diff --git a/app/assets/tailwind/maybe-design-system.css b/app/assets/tailwind/maybe-design-system.css index e8fb9488a9f..26cbeb234dc 100644 --- a/app/assets/tailwind/maybe-design-system.css +++ b/app/assets/tailwind/maybe-design-system.css @@ -266,11 +266,6 @@ --shadow-xl: 0px 20px 24px -4px --alpha(var(--color-white) / 8%); } - html { - margin-top: env(safe-area-inset-top); - padding-bottom: env(safe-area-inset-bottom); - } - button { @apply cursor-pointer focus-visible:outline-gray-900; } diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 81cb66bc623..2a8809a9cd4 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -32,7 +32,7 @@
<%# MOBILE - Top nav %> -