diff --git a/reports-app/frontend/src/App.vue b/reports-app/frontend/src/App.vue index 86a71fb..be575db 100644 --- a/reports-app/frontend/src/App.vue +++ b/reports-app/frontend/src/App.vue @@ -86,8 +86,8 @@ onMounted(async () => { } .main-content.with-navbar { - margin-top: 0; - min-height: calc(100vh - 70px); + margin-top: var(--header-height, 56px); + min-height: calc(100vh - var(--header-height, 56px)); } .main-content:not(.with-navbar) { diff --git a/reports-app/frontend/src/assets/css/mobile.css b/reports-app/frontend/src/assets/css/mobile.css index 8ef6dec..cf2ccdf 100644 --- a/reports-app/frontend/src/assets/css/mobile.css +++ b/reports-app/frontend/src/assets/css/mobile.css @@ -45,6 +45,22 @@ } } +/* Mobile Page Headers - Ensure titles are visible */ +@media (max-width: 768px) { + .page-header { + margin-bottom: var(--space-md, 1rem); + text-align: center; + } + + .page-title { + font-size: 1.5rem; + display: flex; + justify-content: center; + align-items: center; + gap: 0.5rem; + } +} + /* Mobile DataTable Enhancements */ @media (max-width: 768px) { .p-datatable .p-datatable-wrapper { @@ -903,7 +919,7 @@ padding: 0.5rem 0.75rem; background: var(--surface-ground, #f8fafc); border-radius: 6px; - font-size: 0.8125rem; + font-size: 0.875rem; width: 100%; } @@ -927,14 +943,14 @@ .mobile-totals-grid .total-label { color: var(--text-color-secondary, #64748b); - font-size: 0.75rem; + font-size: 0.8125rem; white-space: nowrap; } .mobile-totals-grid .total-value { font-weight: 600; font-variant-numeric: tabular-nums; - font-size: 0.875rem; + font-size: 0.9375rem; } .mobile-totals-grid .total-value.incasari, diff --git a/reports-app/frontend/src/views/DashboardView.vue b/reports-app/frontend/src/views/DashboardView.vue index 7646033..3c38096 100644 --- a/reports-app/frontend/src/views/DashboardView.vue +++ b/reports-app/frontend/src/views/DashboardView.vue @@ -3,10 +3,7 @@
{{ currentMonthLabel }}
+