Mobile layout fixes (#2179)

* Consolidate safe area padding

* Fix chat overflow on mobile
This commit is contained in:
Zach Gollwitzer
2025-04-30 22:24:13 -04:00
committed by GitHub
parent 23adfb2ef0
commit d8cf35eca7
13 changed files with 39 additions and 35 deletions

View File

@@ -11,13 +11,13 @@
<%= render "layouts/shared/htmldoc" do %>
<div
class="flex flex-col lg:flex-row h-dvh lg:h-full bg-surface"
class="flex flex-col lg:flex-row h-full bg-surface"
data-controller="app-layout"
data-app-layout-expanded-sidebar-class="<%= expanded_sidebar_class %>"
data-app-layout-collapsed-sidebar-class="<%= collapsed_sidebar_class %>"
data-app-layout-user-id-value="<%= Current.user.id %>">
<div
class="hidden fixed inset-0 bg-surface z-20 h-dvh w-full p-3 overflow-y-auto transition-all duration-300"
class="hidden fixed inset-0 bg-surface z-20 h-full w-full p-3 overflow-y-auto transition-all duration-300"
data-app-layout-target="mobileSidebar">
<div class="mb-2">
<%= icon("x", as_button: true, data: { action: "app-layout#closeMobileSidebar" }) %>
@@ -131,7 +131,7 @@
<% end %>
<%# MOBILE - Bottom Nav %>
<%= tag.nav class: "lg:hidden bg-surface shrink-0 z-10 pb-2 border-t border-tertiary pb-safe flex justify-around" do %>
<%= tag.nav class: "lg:hidden bg-surface shrink-0 z-10 pb-2 border-t border-tertiary flex justify-around" do %>
<% mobile_nav_items.each do |nav_item| %>
<%= render "layouts/shared/nav_item", **nav_item %>
<% end %>