phlask-map icon indicating copy to clipboard operation
phlask-map copied to clipboard

Update toolbar sizing for responsive design on widescreen displays

Open kdmonroe opened this issue 9 months ago • 0 comments

Pull Request

Change Summary

Implemented responsive toolbar sizing for widescreen displays by:

  • Adding a breakpoint at 1440px using Material UI's useMediaQuery
  • Scaling up toolbar dimensions, padding, and text on wider screens
  • Ensuring icons scale proportionally with the rest of the UI

Change Reason

To address issue #383 , to match the toolbar dimensions better aligning to the Figma mock up. The original dimensions matched, but adding the breakpoint gives more proportionality to the toolbar and near me icons when displayed in wide screen.

Related Issue: #383

kdmonroe avatar May 01 '25 02:05 kdmonroe