From 0d1c0f4e75b1a5418a6cb724ea3d9f0cfbcf05ec Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Jul 2025 14:26:58 -0500 Subject: [PATCH] Try using env safe insets to avoid overlapping elements on mobile --- app/assets/stylesheets/header.css | 2 +- app/assets/stylesheets/terminals.css | 2 +- app/assets/stylesheets/trays.css | 2 +- app/views/layouts/shared/_head.html.erb | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/header.css b/app/assets/stylesheets/header.css index acbb3eb59..2b85dbde0 100644 --- a/app/assets/stylesheets/header.css +++ b/app/assets/stylesheets/header.css @@ -9,7 +9,7 @@ align-items: center; display: flex; - padding: var(--block-space-half) var(--inline-space); + padding: calc(var(--block-space-half) + env(safe-area-inset-top)) var(--inline-space); /* Change the grid size depending on how many buttons are present */ &:has(.header__actions > *:nth-child(1)) { --header-button-count: 1; } diff --git a/app/assets/stylesheets/terminals.css b/app/assets/stylesheets/terminals.css index c2f543fb6..0cb800f54 100644 --- a/app/assets/stylesheets/terminals.css +++ b/app/assets/stylesheets/terminals.css @@ -7,7 +7,7 @@ font-family: var(--font-mono); font-size: var(--text-normal); inset: auto 0 0 0; - padding: var(--block-space) calc(var(--tray-size) + calc(var(--inline-space) * 3)); + padding: var(--block-space) calc(var(--tray-size) + calc(var(--inline-space) * 3)) calc(var(--block-space) + env(safe-area-inset-bottom)); position: fixed; z-index: var(--z-terminal); diff --git a/app/assets/stylesheets/trays.css b/app/assets/stylesheets/trays.css index 8ea7aea54..5d8f86006 100644 --- a/app/assets/stylesheets/trays.css +++ b/app/assets/stylesheets/trays.css @@ -11,7 +11,7 @@ align-items: end; block-size: var(--footer-height); display: grid; - inset-block: auto 0; + inset-block: auto env(safe-area-inset-bottom); inline-size: var(--tray-size); position: fixed; z-index: var(--z-tray); diff --git a/app/views/layouts/shared/_head.html.erb b/app/views/layouts/shared/_head.html.erb index d13ee7ea1..b79c9ba58 100644 --- a/app/views/layouts/shared/_head.html.erb +++ b/app/views/layouts/shared/_head.html.erb @@ -1,7 +1,7 @@ <%= page_title_tag %> - +