1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-10 07:55:21 +02:00

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
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
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 %>

View file

@ -1,6 +1,6 @@
<%= render "layouts/shared/htmldoc" do %>
<div class="flex flex-col h-dvh">
<div class="flex flex-col h-screen px-6 py-12 bg-surface">
<div class="flex flex-col h-full">
<div class="flex flex-col h-full px-6 py-12 bg-surface">
<div class="grow flex flex-col justify-center">
<div class="sm:mx-auto sm:w-full sm:max-w-md">
<div class="flex justify-center mt-2 md:mb-6">

View file

@ -1,5 +1,5 @@
<%= render "layouts/shared/htmldoc" do %>
<div class="flex flex-col h-dvh bg-container pt-safe">
<div class="flex flex-col h-full bg-container">
<header class="flex items-center justify-between p-8">
<%= render LinkComponent.new(
variant: "icon",

View file

@ -1,6 +1,6 @@
<%# This dialog is used as an override to the browser's confirm API when submitting forms with data-turbo-confirm %>
<%# See confirm_dialog_controller.js and _htmldoc.html.erb %>
<%= render DialogComponent.new(id: "confirm-dialog", auto_open: false, data: { controller: "confirm-dialog" }, width: "sm") do |dialog| %>
<%= render DialogComponent.new(id: "confirm-dialog", auto_open: false, data: { controller: "confirm-dialog" }, width: "sm", disable_frame: true) do |dialog| %>
<% dialog.with_body do %>
<form method="dialog" class="space-y-4">
<div class="space-y-2">

View file

@ -1,5 +1,5 @@
<%= render "layouts/shared/htmldoc" do %>
<div class="bg-container flex flex-col h-dvh pt-safe">
<div class="bg-container flex flex-col h-full">
<header class="flex items-center justify-between p-8">
<%= render LinkComponent.new(
variant: "icon",