search

nextcloud-libraries / nextcloud-vue

🍱 Vue.js components for Nextcloud app development ✌ https://npmjs.org/@nextcloud/vue
https://nextcloud-vue-components.netlify.app/
Other
214 stars 84 forks source link

AppContentList is limited to 300px width in CSS but shouldn't be #1561

Open cdbrkfxrpt opened 3 years ago

cdbrkfxrpt commented 3 years ago

Feature Request

Currently the layout, as good as it is, doesn't allow for the messages list to grow any wider than 300px. This makes the app all but unusable for us. Simply changing this to a more reasonable value would enable having proper message previews.

I am perhaps overlooking where to set this, in which case - feel free to move this issue there, or ignore me altogether.

Thanks and regards - thank you for your time.

StCyr commented 3 years ago

No, there isn't a setting for that indeed.

cdbrkfxrpt commented 3 years ago

Would you agree it's worth adding, or adding auto-scaling for this? If you point me in the right direction I can try and implement this.

StCyr commented 3 years ago

I agree with you but I don't know how best to do that.

Maybe make the envelope list (we call it like this, not message list) resizable with something like https://www.vuescript.com/resize-and-drag-elements-in-vue-js-vue-drag-resize/ ?

st3iny commented 3 years ago

Some time ago the decision was made to limit the email content width to 900px. We could assign some of the resulting white space to the envelope list by increasing max-width from 300px to 500px (or even 600px).

ChristophWurst commented 3 years ago

This discussion isn't specific to Mail. We use the layout components from @nextcloud/vue. E.g. Nextcloud Contacts use the same. It's a wider discussion than just changing the values here.

But I agree that we have to improve this. Certain aspect ratios and screen sizes really make the app look weird.

@jancborchardt to the rescue :)

jancborchardt commented 3 years ago

Agree with @ChristophWurst it would be important to not only do this in Mail, but in the Vue components. (I would then transfer the issue, ok?)

Also, let's make it so it's automatic, and not manually resizable widths. It should look nice on any screen size just like we normally do with responsive design, and most people don't change defaults either. :) This would e.g. work nicely using some vw values (viewport width) for both the AppNavigation and AppContentList. (The listing of mails itself has a limited width for readability reasons and we should keep the width there limited, also making sure to set a max-width for the navigation and contentlist so they don't look strange.)

@cdbrkfxrpt what do you think? Would indeed be cool if you like to contribute! :)

cdbrkfxrpt commented 3 years ago

I'm not front end normally so I don't really have an idea how much work this is, but I'll take a look. Would be happy to contribute in the tiny way I can. I'll try to post an update after the weekend.

cdbrkfxrpt commented 3 years ago

Had a busy work weekend so I'm looking into this only now. Just for my understanding: to work on this I need a full nextcloud development setup, which in turn requires me to install a fully functioning nextcloud instance locally? That sounds like half a day of yak shaving, isn't it possible to use a docker container for that?

StCyr commented 3 years ago

probably: https://github.com/nextcloud/docker

st3iny commented 3 years ago

This might be helpful too: https://github.com/juliushaertl/nextcloud-docker-dev

ChristophWurst commented 3 years ago

More generally you'll find most links at https://nextcloud.com/developer/ :)

cdbrkfxrpt commented 3 years ago

:D ... yeah i'd found the containers on the docker hub but no good docs. i'll have a look at the developer docs for nextcloud.

i'm sorry i'm so slow though, i'm pretty much knee deep in code that needs to ship soon 24/7 right now and the few remaining hours i'm in meetings, so capacities are pretty much used up. will see what i can do, but can't really promise much..