[GH-ISSUE #60] Would you be open to a PR changing from grid layout to flexbox layout? #48

New issue

Closed

opened 2026-02-27 10:15:29 +03:00 by kerem · 5 comments

kerem commented

2026-02-27 10:15:29 +03:00

Owner

Originally created by @kshannoninnes on GitHub (Jun 28, 2024).
Original GitHub issue: https://github.com/matze/wastebin/issues/60

Love the minimalist style, but it's bothering me that the content div is overflowing and creating a scrollbar. I've looked through the stylesheet a bit and played around, and I believe the cause is due to the way the grid layout is used (although I'm not 100% on this).

If you prefer to stay with the grid style, that's cool. I'll keep my forked version for my own usage.

Originally created by @kshannoninnes on GitHub (Jun 28, 2024). Original GitHub issue: https://github.com/matze/wastebin/issues/60 Love the minimalist style, but it's bothering me that the content div is overflowing and creating a scrollbar. I've looked through the stylesheet a bit and played around, and I believe the cause is due to the way the grid layout is used (although I'm not 100% on this). If you prefer to stay with the grid style, that's cool. I'll keep my forked version for my own usage.

kerem closed this issue

2026-02-27 10:15:29 +03:00

kerem commented

2026-02-27 10:15:30 +03:00

Author

Owner

@matze commented on GitHub (Jun 28, 2024):

Do you have some example how you would like to have it? Not sure what the layout change would look like.

@matze commented on GitHub (Jun 28, 2024): Do you have some example how you would like to have it? Not sure what the layout change would look like.

kerem commented

2026-02-27 10:15:30 +03:00

Author

Owner

@kshannoninnes commented on GitHub (Jun 29, 2024):

On further investigation I believe the scrollbar is actually mostly due to the way you've implemented the select box for languages. I'm not sure if there's a way to apply a dynamic size in this case, as 23 (with the spacing between elements in that right-menu) is too large and introduces a page scrollbar (screenshot below).

I think there are a couple potential ways of solving my issue.

Re-design the right menu to use actual dropdown select boxes instead of the current list style
Change the size element (and make some height attribute changes to a few other elements) to a lower number

I don't think any of the suggestions are good ones. It might be best for me to just keep a forked version for myself? Open to ideas. I've included a screenshot of the second option of changes that I implemented on my own copy below (ignore the random artifacts in the bottom right, that's the old screenshot behind it in paint).

Here's a link to my fork commit for the changes that achieve the second screenshot: github.com/kshannoninnes/wastebin@238e53d5fc

@kshannoninnes commented on GitHub (Jun 29, 2024): On further investigation I believe the scrollbar is actually mostly due to the way you've implemented the select box for languages. I'm not sure if there's a way to apply a dynamic size in this case, as 23 (with the spacing between elements in that right-menu) is too large and introduces a page scrollbar (screenshot below). I think there are a couple potential ways of solving my issue. - Re-design the right menu to use actual dropdown select boxes instead of the current list style - Change the size element (and make some height attribute changes to a few other elements) to a lower number I don't think any of the suggestions are good ones. It might be best for me to just keep a forked version for myself? Open to ideas. I've included a screenshot of the second option of changes that I implemented on my own copy below (ignore the random artifacts in the bottom right, that's the old screenshot behind it in paint). Here's a link to my fork commit for the changes that achieve the second screenshot: https://github.com/kshannoninnes/wastebin/commit/238e53d5fca35601ceecd7c7bc1b9b3945736878 ![image](https://github.com/matze/wastebin/assets/19289767/72c6094d-f15d-42f8-8162-c74deba552bd) ![image](https://github.com/matze/wastebin/assets/19289767/eb4a5a13-2d48-4be4-be1b-b7c0fc1089b2)

kerem commented

2026-02-27 10:15:30 +03:00

Author

Owner

@matze commented on GitHub (Jun 29, 2024):

I'm fine reducing the size again. In fact the list used to be shorter.

@matze commented on GitHub (Jun 29, 2024): I'm fine reducing the size again. In fact the list used to be shorter.

kerem commented

2026-02-27 10:15:30 +03:00

Author

Owner

@matze commented on GitHub (Jun 30, 2024):