koekeishiya / yabai

A tiling window manager for macOS based on binary space partitioning
MIT License
23.32k stars 643 forks source link

Resize command on browser window so viewport width has specific dimensions #1834

Open jbwinn opened 1 year ago

jbwinn commented 1 year ago

I do a lot of web development work and especially focus on responsive design. As such, I often pop my browser window out of the managed windows so it can float and be resized to correctly view the page for different screens. Due to this, I'm wanting to setup a shortcut with yabai and skhd that can automatically resize my windows so that the viewport dimensions are at a my desired height and width for desktop versus tablet versus mobile development.

As of now, I was thinking of using this yabai command yabai -m window resize abs:<dx>:<dy>

This should work great to resize the window, however I'm unsure of how to determine the window size required to get the specific viewport dimensions that I want. I'm planning to setup a few different skhd keyboard shortcuts to achieve the following viewport dimensions:

Desktop: 1440x900 Desktop Large: 1920x1080 Desktop Medium: 1280x720 Desktop Small: 1024x576 Tablet Vertical: 768x1024 Tablet Small Vertical: 601x962 Tablet Horizontal: 1024x768 Phone: 425x896 Phone Small: 375x896

My goal is to map each of these to a different yabai/skhd command so I can quickly float my browser window and resize accordingly. Any help would be appreciate! Thank you!

evantravers commented 7 months ago

I've been trying to figure out how to do this myself… it's possible to do it when a window is "unmanaged" or floated… but I haven't figured out how to do it when the window is managed.

In theory if we want to do this BSP, we'd have to:

get the target window's width using `yabai -m query windows | jq`
compute the distance required to change the width to our desired width
yabai -m window --resize [left|right]:<distance>:0

I haven't done enough with more advanced commands using jq to get close to this yet.