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.

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

Dynamic column width #3331

Open
timkrief opened this issue Sep 21, 2021 · 4 comments · May be fixed by #6640
Open

Dynamic column width #3331

timkrief opened this issue Sep 21, 2021 · 4 comments · May be fixed by #6640

Comments

@timkrief
Copy link
Member

timkrief commented Sep 21, 2021

How to use GitHub

  • Please use the 👍 reaction to show that you are affected by the same issue.
  • Please don't comment if you have no relevant information to add. It's just extra noise for everyone subscribed to this issue.
  • Subscribe to receive notifications on status change and new comments.

Is your feature request related to a problem? Please describe.
I keep having to change the window's size or zoom scale, or I keep having to scroll horizontally, to be able to fit or view all stacks on the screen, sometimes I even forget about one stack that is overflowing. Plus, board with a small number of stacks feel like they could use more of the available space.

Describe the solution you'd like
The idea would be to let the columns stretch to fill the screen.
We could define a minimum and maximum width for a stack, close to the width value we use right now, and then let the stacks stretch to fill the page as long as they are not bigger or smaller than those limits.

This has some unexpected design bonuses.

  • If there are not enough stacks to fill the screen, at least they will have the max value, reducing the amount of unused space.
  • If there are not enough space to fit the stacks, at least they will have the min value, increasing the amount of information displayed.
  • Sometimes, when the left or right sidebar appears, most, or even all, stacks stay visible, they just shrink a bit instead of being covered. (see the gif)

Describe alternatives you've considered
Being able to change column width for each board manually, but this seems a bit clunky and unreliable.

Additional context
I made that work using some custom CSS and it really feels nicer to use and more professional. The values of min and max could be discussed, but using values close to what we've been using for the default width ensures that this will not massively change the look and feel of the app.

Peek 2021-09-21 05-04

This is the CSS I used. It could be cleaner if this was done natively instead of as a custom style on top of the existing one.

.smooth-dnd-container.horizontal>*,
.dashboard-column{
    flex: 1 !important;
    width: 0 !important;
    min-width: 210px !important;
    max-width: 300px !important;
}
@juliusknorr
Copy link
Member

Seems like a nice improvement to me, would you be up to send a pull request for that?

@timkrief
Copy link
Member Author

timkrief commented Oct 6, 2021

Yeah, let me some time, I'll make a PR

@dodedodo
Copy link

dodedodo commented Dec 7, 2021

Off-Topic: @timkrief, what did you do to get such a pleasant-looking deck? Would you be willing to share your css? It looks way better than the default (no offence, I know deck is limited by nextclouds theming conventions).

@ludij ludij linked a pull request Jan 1, 2025 that will close this issue
4 tasks
@ludij
Copy link
Contributor

ludij commented Jan 1, 2025

Please see the PR above, which is an attempt to improve the responsive behavior :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants