#1059 - [PR #513] [CLOSED] [Feature]: Printer Page - UI improvement - starred/bambuddy

## 📋 Pull Request Information **Original PR:** https://github.com/maziggy/bambuddy/pull/513 **Author:** [@aneopsy](https://github.com/aneopsy) **Created:** 2/24/2026 **Status:** ❌ Closed **Base:** `0.2.2b1` ← **Head:** `printer-ui-improvement` --- ### 📝 Commits (7) - [`5b0c13d`](https://github.com/maziggy/bambuddy/commit/5b0c13d896dc4ca9954c906de65f29a3400186e5) fix(printers): improve mobile responsiveness and card layout - [`5a0da1d`](https://github.com/maziggy/bambuddy/commit/5a0da1d682172d8d912ec39fcfb374b4e882a084) fix(printers): resolve Tailwind class conflict and optimize media query listener - [`0328cfb`](https://github.com/maziggy/bambuddy/commit/0328cfbad6cfa3796cf88bdd54e727af5d6ecb5a) - Remove margin bottom on PrinterQueueWidget - [`40eb74f`](https://github.com/maziggy/bambuddy/commit/40eb74fe881657ae0ffe9a479bd32d6703bd4479) refactor(printers): AMS section layout improvements - [`6d32c1b`](https://github.com/maziggy/bambuddy/commit/6d32c1be14f3809b4ed7d53a89da4947f2ae592b) refactor(ams): extract AMSUnitCard and clean up card layout - [`072f533`](https://github.com/maziggy/bambuddy/commit/072f53330340bc5d665a2ba8ea87fae68627a06d) Merge remote-tracking branch 'upstream/0.2.2b1' into printer-ui-improvement - [`a72ab71`](https://github.com/maziggy/bambuddy/commit/a72ab7191380d7ccee4a65ebff2b9a84be4ed31d) Remove dead code left behind by AMSUnitCard extraction ### 📊 Changes **9 files changed** (+1632 additions, -1845 deletions) <details> <summary>View changed files</summary> 📝 `frontend/src/__tests__/components/Card.test.tsx` (+2 -1) ➕ `frontend/src/components/AMSUnitCard.tsx` (+995 -0) 📝 `frontend/src/components/Card.tsx` (+1 -1) 📝 `frontend/src/components/PrinterQueueWidget.tsx` (+2 -2) 📝 `frontend/src/pages/PrintersPage.tsx` (+195 -1404) 📝 `static/assets/index-BcvbL6Vy.js` (+434 -434) ➖ `static/assets/index-D5I4wfky.css` (+0 -1) ➕ `static/assets/index-D6abGXfT.css` (+1 -0) 📝 `static/index.html` (+2 -2) </details> ### 📄 Description ## Description - Increase printer image background size - Make AMS-HT and External sections responsive on mobile - Pin action buttons to bottom of card - Normalize spacing between elements - Expand card width on mobile for even distribution - Improve AMS filament material visibility on mobile - Remove L and XL card size options on mobile (redundant with M size) ## 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 ## Screenshots ### Desktop Before: <img width="955" height="877" alt="Screenshot 2026-02-16 at 9 22 37 PM" src="https://github.com/user-attachments/assets/21768371-7fd3-427e-a617-7e4c90154013" /> After: <img width="967" height="878" alt="Screenshot 2026-02-16 at 9 21 31 PM" src="https://github.com/user-attachments/assets/cbeea8e2-01d8-4034-aac2-bf265d6c65fd" /> ### Mobile (iPhone 12 Pro) Before: <img width="377" height="46" alt="Screenshot 2026-02-16 at 9 36 51 PM" src="https://github.com/user-attachments/assets/6c6dd1fc-7437-4d40-8037-3276c4fb5e59" /> <img width="404" height="861" alt="Screenshot 2026-02-16 at 9 22 26 PM" src="https://github.com/user-attachments/assets/38788e19-4e24-4fb8-9bc9-e4c4007817d8" /> After: <img width="377" height="42" alt="Screenshot 2026-02-16 at 9 37 23 PM" src="https://github.com/user-attachments/assets/504cf1aa-4a53-4937-bc1c-4a54c28a9820" /> <img width="403" height="859" alt="Screenshot 2026-02-16 at 9 21 55 PM" src="https://github.com/user-attachments/assets/861b286f-63b0-4da2-af73-b8459ca564f8" /> H2D/H2C Split left & right AMS: <img width="501" height="267" alt="image" src="https://github.com/user-attachments/assets/4bb3fd34-d800-4845-bc9a-c49fdb90c737" /> ## Testing  - [X] I have tested this on my local machine - [X] I have tested with my printer model: H2S, H2D, X1C ## Checklist - [x] My code follows the project's coding style - [x] I have commented my code where necessary - [x] I have updated the documentation (if needed) - [x] My changes generate no new warnings - [x] I have tested my changes thoroughly --- <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:44 +02:00

Owner

📋 Pull Request Information

Original PR: https://github.com/maziggy/bambuddy/pull/513
Author: @aneopsy
Created: 2/24/2026
Status: ❌ Closed

Base: 0.2.2b1 ← Head: printer-ui-improvement

📝 Commits (7)

5b0c13d fix(printers): improve mobile responsiveness and card layout
5a0da1d fix(printers): resolve Tailwind class conflict and optimize media query listener
0328cfb - Remove margin bottom on PrinterQueueWidget
40eb74f refactor(printers): AMS section layout improvements
6d32c1b refactor(ams): extract AMSUnitCard and clean up card layout
072f533 Merge remote-tracking branch 'upstream/0.2.2b1' into printer-ui-improvement
a72ab71 Remove dead code left behind by AMSUnitCard extraction

📊 Changes

9 files changed (+1632 additions, -1845 deletions)

View changed files

📝 frontend/src/__tests__/components/Card.test.tsx (+2 -1)
➕ frontend/src/components/AMSUnitCard.tsx (+995 -0)
📝 frontend/src/components/Card.tsx (+1 -1)
📝 frontend/src/components/PrinterQueueWidget.tsx (+2 -2)
📝 frontend/src/pages/PrintersPage.tsx (+195 -1404)
📝 static/assets/index-BcvbL6Vy.js (+434 -434)
➖ static/assets/index-D5I4wfky.css (+0 -1)
➕ static/assets/index-D6abGXfT.css (+1 -0)
📝 static/index.html (+2 -2)

📄 Description

Description

Increase printer image background size
Make AMS-HT and External sections responsive on mobile
Pin action buttons to bottom of card
Normalize spacing between elements
Expand card width on mobile for even distribution
Improve AMS filament material visibility on mobile
Remove L and XL card size options on mobile (redundant with M size)

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