From 9c15d1dec5f5d98c5b67c40a7e172a397ddc8f7d Mon Sep 17 00:00:00 2001 From: matteoscrugli Date: Sun, 11 Jan 2026 15:08:27 +0100 Subject: [PATCH] Simplify mobile bottom padding to match desktop spacing Use fixed 24px padding for mobile bottom tab bar instead of complex variable calculations. This provides consistent spacing that matches the desktop visual appearance. Co-Authored-By: Claude Opus 4.5 --- frontend/src/styles/Layout.css | 14 +++----------- 1 file changed, 3 insertions(+), 11 deletions(-) diff --git a/frontend/src/styles/Layout.css b/frontend/src/styles/Layout.css index 6882dcd..d6bb9ae 100644 --- a/frontend/src/styles/Layout.css +++ b/frontend/src/styles/Layout.css @@ -445,7 +445,7 @@ label, .main-content { margin-left: 0; --page-padding-y-mobile-gap: var(--space-3); - --page-padding-y-mobile-bottom-gap: var(--space-3); + --page-padding-y-mobile-bottom-gap: 0; --tabs-slider-height-fallback: calc(var(--tab-pill-height, 44px) + 8px); } @@ -929,11 +929,7 @@ label, [data-tab-position='bottom'] .main-content[data-has-tabs='true'] .page-content, [data-tab-position='bottom'] .main-content[data-has-tabs='true'] .admin-tab-content { - padding-bottom: calc( - var(--page-padding-y-mobile-bottom-gap, 0px) + - var(--tabs-slider-height, var(--tabs-slider-height-fallback, 52px)) + - env(safe-area-inset-bottom, 0px) - ); + padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); } } @@ -970,10 +966,6 @@ label, [data-tab-position='responsive'] .main-content[data-has-tabs='true'] .page-content, [data-tab-position='responsive'] .main-content[data-has-tabs='true'] .admin-tab-content { - padding-bottom: calc( - var(--page-padding-y-mobile-bottom-gap, 0px) + - var(--tabs-slider-height, var(--tabs-slider-height-fallback, 52px)) + - env(safe-area-inset-bottom, 0px) - ); + padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); } }