Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Breakpoint change #171

Closed
marko-srb opened this issue Sep 21, 2023 · 3 comments · Fixed by #175
Closed

Breakpoint change #171

marko-srb opened this issue Sep 21, 2023 · 3 comments · Fixed by #175
Assignees
@ryelle
Labels
[Component] Theme Templates, patterns, CSS
Milestone
MVP

Comments

@marko-srb
Copy link

marko-srb commented Sep 21, 2023 •
edited
Loading

Live version has 3 columns after a breakpoint (1440px). We discussed having that breakpoint at 1920px, as in design.

  1. What bugs can happen if we do that?
  2. Is it lot of work to do it?
Screen Shot 2023-09-21 at 15 31 00

CC: @jasmussen @ryelle
@ryelle
Copy link
Contributor

ryelle commented Sep 21, 2023

@marko-srb This is pretty trivial to change, so it's more a question of what works well.

The difference between 1440 and 1920 feels like a lot— right before the cutoff, the images will be 830x460, which is quite large. We could do somewhere in the 1600-1700 range? Then the images would be around 700x400. That would catch 60% of all desktop screen sizes (and that's assuming people use full-width viewports).
@ryelle ryelle added [Component] Theme Templates, patterns, CSS [Status] Needs Design Feedback Feedback is needed on an existing or new component labels Sep 21, 2023
@marko-srb
Copy link
Author

@ryelle
Yes. Yes. My mistake, we were speaking about the middle yesterday, I was just forgetting about it. Sorry!

1536 x 960 seems macbook 16", so I think a breakpoint of 1600 will be perfect. Any downsides?

Thank you!
@ryelle
Copy link
Contributor

ryelle commented Sep 21, 2023

nope! we can go with 1600 👍🏻
@ryelle ryelle removed the [Status] Needs Design Feedback Feedback is needed on an existing or new component label Sep 21, 2023
@ryelle ryelle self-assigned this Sep 22, 2023
ryelle added a commit that referenced this issue Sep 22, 2023
@ryelle
Site grid: Update breakpoint for 3-column display
28c5d02 
Fixes #171
@ryelle ryelle mentioned this issue Sep 22, 2023
Merged
@ryelle ryelle added this to the MVP milestone Sep 26, 2023
ryelle added a commit that referenced this issue Sep 27, 2023
@ryelle
Site screenshot: Add responsive image support to the screenshot block (…
232f6f0 
…#175)

* Site grid: Update breakpoint for 3-column display

Fixes #171

* Site screenshot: Add size as a separate parameter from type

* Images: Add extra sizes for desktop screenshot

* Site screenshot: Add responsive image support to the screenshot block

Fixes #156

* Use a "location" attribute to pass better information to block

* Set the `location` attribute when displaying screenshots

* Add a readme to the screenshot block
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Component] Theme Templates, patterns, CSS
2 participants
@ryelle @marko-srb