romfast/roa2web-service-auto
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(design): FINDING-005 — fix tablet 1px gap where no header shows

Browse Source 
At exactly 768px, CSS hides desktop header (max-width: 768px) but JS
isMobile used < 768 (strict), so MobileTopBar didn't show either.
Fix: change < 768 to <= 768 across all 5 views (App, Dashboard,
MaturityAnalysis, SettingsHub, DetailedInvoices).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Agent
2026-03-20 22:13:59 +00:00
parent 655f813b9b
commit 7153d87f6a
5 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.vue
View File

@@ -60,7 +60,7 @@ const router = useRouter()
// Mobile detection - reactive with resize listener // Mobile detection - reactive with resize listener
const windowWidth = ref(typeof window !== 'undefined' ? window.innerWidth : 1024) const windowWidth = ref(typeof window !== 'undefined' ? window.innerWidth : 1024)
const isMobile = computed(() => windowWidth.value < 768) const isMobile = computed(() => windowWidth.value <= 768)
const handleResize = () => { const handleResize = () => {
windowWidth.value = window.innerWidth windowWidth.value = window.innerWidth

2
src/modules/reports/views/DashboardView.vue
View File

@@ -757,7 +757,7 @@ const bancaPreviousSparkline = computed(() => {
// Detectare mobile - reactive with resize listener // Detectare mobile - reactive with resize listener
const windowWidth = ref(window.innerWidth); const windowWidth = ref(window.innerWidth);
const isMobile = computed(() => windowWidth.value < 768); const isMobile = computed(() => windowWidth.value <= 768);
const dashboardTitle = computed(() => { const dashboardTitle = computed(() => {
const company = companyStore.selectedCompany?.name; const company = companyStore.selectedCompany?.name;

2
src/modules/reports/views/DetailedInvoicesView.vue
View File

@@ -492,7 +492,7 @@ const switchTab = async (tab) => {
// Mobile detection // Mobile detection
const windowWidth = ref(window.innerWidth) const windowWidth = ref(window.innerWidth)
const isMobile = computed(() => windowWidth.value < 768) const isMobile = computed(() => windowWidth.value <= 768)
const handleResize = () => { const handleResize = () => {
windowWidth.value = window.innerWidth windowWidth.value = window.innerWidth

2
src/modules/reports/views/MaturityAnalysisView.vue
View File

@@ -125,7 +125,7 @@ const showDrawer = ref(false)
// Detectare mobile - reactive with resize listener // Detectare mobile - reactive with resize listener
const windowWidth = ref(window.innerWidth) const windowWidth = ref(window.innerWidth)
const isMobile = computed(() => windowWidth.value < 768) const isMobile = computed(() => windowWidth.value <= 768)
// Ref to MaturityAnalysisCard // Ref to MaturityAnalysisCard
const maturityCardRef = ref(null) const maturityCardRef = ref(null)

2
src/modules/reports/views/SettingsHubView.vue
View File

@@ -104,7 +104,7 @@ const showDrawer = ref(false)
// Detectare mobile - reactive with resize listener // Detectare mobile - reactive with resize listener
const windowWidth = ref(window.innerWidth) const windowWidth = ref(window.innerWidth)
const isMobile = computed(() => windowWidth.value < 768) const isMobile = computed(() => windowWidth.value <= 768)
// Handle window resize for mobile detection // Handle window resize for mobile detection
const handleResize = () => { const handleResize = () => {