[PR #382] [MERGED] Fix UI clipping in mobile view

## 📋 Pull Request Information **Original PR:** https://github.com/maziggy/bambuddy/pull/382 **Author:** [@Keybored02](https://github.com/Keybored02) **Created:** 2/15/2026 **Status:** ✅ Merged **Merged:** 2/15/2026 **Merged by:** [@maziggy](https://github.com/maziggy) **Base:** `0.2.0b` ← **Head:** `feature/mobile_view_fix` --- ### 📝 Commits (9) - [`b6c304d`](https://github.com/maziggy/bambuddy/commit/b6c304d4a958f7b8c595f224755999b9e24cfe6e) Fixed mobile view - [`4d9d333`](https://github.com/maziggy/bambuddy/commit/4d9d333a1c70d118b06b3856890ee11e4450aa0f) Fix AMS Hum/Temp card items clipping, extend mobile breakpoint for better visibility on tablets - [`c5ff824`](https://github.com/maziggy/bambuddy/commit/c5ff8243727cbf32ac02830174f8a378c67a40d2) Merge branch '0.2.0b' into feature/mobile_view_fix - [`33fb12a`](https://github.com/maziggy/bambuddy/commit/33fb12a0805fcad1d02c52215d7314546f4a280e) Merge branch '0.2.0b' into feature/mobile_view_fix - [`13de691`](https://github.com/maziggy/bambuddy/commit/13de6919d35d732b33d7f2c20546f6e441207a26) Merge branch '0.2.0b' into feature/mobile_view_fix - [`66dcca5`](https://github.com/maziggy/bambuddy/commit/66dcca50f83e452bd23e550e9e0b42adeccc8ec3) Merge branch '0.2.0b' into feature/mobile_view_fix - [`9886cb2`](https://github.com/maziggy/bambuddy/commit/9886cb20071e58f6d126fcf06c08bf798ceb00b4) Merge branch '0.2.0b' into feature/mobile_view_fix - [`4ff3e2a`](https://github.com/maziggy/bambuddy/commit/4ff3e2a60fb764145fd47b5e9acd3e8aed66ea7c) Update responsive breakpoints for various components, implement useIsSidebarCompact hook - [`cf5d403`](https://github.com/maziggy/bambuddy/commit/cf5d403c262e5102ddb28642bfd6bc5a62e0fe16) Merge branch 'feature/mobile_view_fix' of https://github.com/Keybored02/bambuddy into feature/mobile_view_fix ### 📊 Changes **11 files changed** (+182 additions, -98 deletions) <details> <summary>View changed files</summary> 📝 `frontend/src/components/AMSHistoryModal.tsx` (+12 -12) 📝 `frontend/src/components/Dashboard.tsx` (+48 -15) 📝 `frontend/src/components/FilamentTrends.tsx` (+18 -12) 📝 `frontend/src/components/Layout.tsx` (+28 -28) 📝 `frontend/src/hooks/useIsMobile.ts` (+1 -1) ➕ `frontend/src/hooks/useIsSidebarCompact.ts` (+24 -0) 📝 `frontend/src/index.css` (+16 -0) 📝 `frontend/src/pages/MaintenancePage.tsx` (+3 -3) 📝 `frontend/src/pages/PrintersPage.tsx` (+22 -18) 📝 `frontend/src/pages/ProfilesPage.tsx` (+9 -9) 📝 `frontend/src/pages/StatsPage.tsx` (+1 -0) </details> ### 📄 Description ## Description Fix UI elements with overlapping and clipping issues on mobile. This mainly affects the printer card, maintenance page, profile page, statistic page. The breakpoint for mobile view has been extended for improved view from a tablet. ## Type of Change  - [x] Bug fix (non-breaking change that fixes an issue) - [ ] New feature (non-breaking change that adds functionality) - [ ] Breaking change (fix or feature that would cause existing functionality to change) - [ ] Documentation update - [ ] Code refactoring - [ ] Performance improvement - [ ] Test addition or update ## Changes Made - Printer card pause and stop buttons no longer risk overlap - AMS card temp/hum text no longer clips - Profile page filter button now group on resize - Statics now move in a column on resize - Maintenance page now shows tasks name fully - The breakpoint for mobile view has been changed to an higher value for improved view from a tablet. ## Screenshots <img width="359" height="749" alt="Screenshot 2026-02-15 095138" src="https://github.com/user-attachments/assets/4f2ef530-8bef-405b-85dc-efc577052bfb" /> <img width="379" height="764" alt="Screenshot 2026-02-15 095113" src="https://github.com/user-attachments/assets/00fdaf14-3949-4f8e-ad45-9dcbd76f99e7" /> <img width="380" height="780" alt="Screenshot 2026-02-15 095205" src="https://github.com/user-attachments/assets/2992c156-09e3-4288-ac53-c423d715efff" /> <img width="381" height="786" alt="Screenshot 2026-02-15 095258" src="https://github.com/user-attachments/assets/e3ff78a1-5ec3-49e6-9212-3b6d3e57761d" /> <img width="388" height="770" alt="Screenshot 2026-02-15 095219" src="https://github.com/user-attachments/assets/ed0bbceb-500b-4f54-bf99-12ed27012ebf" /> <img width="378" height="770" alt="Screenshot 2026-02-15 095309" src="https://github.com/user-attachments/assets/e086f63e-aa94-4ee3-8a82-4a9a5527c6f1" /> <img width="381" height="782" alt="Screenshot 2026-02-15 095228" src="https://github.com/user-attachments/assets/01060d19-928a-4bf0-8560-1529fa73291a" /> <img width="382" height="783" alt="Screenshot 2026-02-15 095318" src="https://github.com/user-attachments/assets/349edce4-f0a0-4701-a0eb-dd9f58b58d7e" /> ## Testing  - [x] I have tested this on my local machine - [x] I have tested with my printer model: H2C ## Checklist - [x] My code follows the project's coding style - [x] I have commented my code where necessary - [ ] I have updated the documentation (if needed) - [x] My changes generate no new warnings - [x] I have tested my changes thoroughly ## Additional Notes New mobile breakpoint might be changed - Tested on iPad Mini and Pro 2024. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>

BreizhHardware commented

2026-05-06 12:34:30 +02:00

Owner

📋 Pull Request Information

Original PR: https://github.com/maziggy/bambuddy/pull/382
Author: @Keybored02
Created: 2/15/2026
Status: ✅ Merged
Merged: 2/15/2026
Merged by: @maziggy

Base: 0.2.0b ← Head: feature/mobile_view_fix

📝 Commits (9)

b6c304d Fixed mobile view
4d9d333 Fix AMS Hum/Temp card items clipping, extend mobile breakpoint for better visibility on tablets
c5ff824 Merge branch '0.2.0b' into feature/mobile_view_fix
33fb12a Merge branch '0.2.0b' into feature/mobile_view_fix
13de691 Merge branch '0.2.0b' into feature/mobile_view_fix
66dcca5 Merge branch '0.2.0b' into feature/mobile_view_fix
9886cb2 Merge branch '0.2.0b' into feature/mobile_view_fix
4ff3e2a Update responsive breakpoints for various components, implement useIsSidebarCompact hook
cf5d403 Merge branch 'feature/mobile_view_fix' of https://github.com/Keybored02/bambuddy into feature/mobile_view_fix

📊 Changes

11 files changed (+182 additions, -98 deletions)

View changed files

📝 frontend/src/components/AMSHistoryModal.tsx (+12 -12)
📝 frontend/src/components/Dashboard.tsx (+48 -15)
📝 frontend/src/components/FilamentTrends.tsx (+18 -12)
📝 frontend/src/components/Layout.tsx (+28 -28)
📝 frontend/src/hooks/useIsMobile.ts (+1 -1)
➕ frontend/src/hooks/useIsSidebarCompact.ts (+24 -0)
📝 frontend/src/index.css (+16 -0)
📝 frontend/src/pages/MaintenancePage.tsx (+3 -3)
📝 frontend/src/pages/PrintersPage.tsx (+22 -18)
📝 frontend/src/pages/ProfilesPage.tsx (+9 -9)
📝 frontend/src/pages/StatsPage.tsx (+1 -0)

📄 Description

Description

Fix UI elements with overlapping and clipping issues on mobile. This mainly affects the printer card, maintenance page, profile page, statistic page.
The breakpoint for mobile view has been extended for improved view from a tablet.

Type of Change

Bug fix (non-breaking change that fixes an issue)
New feature (non-breaking change that adds functionality)
Breaking change (fix or feature that would cause existing functionality to change)
Documentation update
Code refactoring
Performance improvement
Test addition or update

Changes Made

Printer card pause and stop buttons no longer risk overlap
AMS card temp/hum text no longer clips
Profile page filter button now group on resize
Statics now move in a column on resize
Maintenance page now shows tasks name fully
The breakpoint for mobile view has been changed to an higher value for improved view from a tablet.