[Design] Collapsible Sections

Experimenting with collapsible sections, please share your thoughts:

https://blog.frappe.io/blog/development/fixing-long-forms

It’s a good idea! Yes scrolling down a long form looks complex for end-users.

Is this collapsible section only applied in the main form? How about e,g, invoice item? ’

Also, It’s better I think if user can decide/configure what fields to be collapsed by default and not (e.g. most used fields are set collapsed by default)…also user can define section name and customize the group of fields for each section, considering each user/business may have different preference.

This way we can keep the screen-view to be as minimal/simple as possible where only most used/important info appear in single view without scrolling down.

I do like the idea of collapsable sections like how it was implemented in v4 and I do prefer it over the fold that is used in v5 for reasons that, from a users perspective, it is not easily noticeable that the fold is (1) clickable and (2) will reveal a separate section – perhaps from a color / styling standpoint if the fold was more noticeable it would be better?

Just one comment, I personally am not a fan of the “Web Link” style as it really isn’t noticeable immediately to a user that it represents another section and can show/hide it when clicked.

+1 for a more prominent looking fold

Thanks for your feedbacks!

The collapsible were implemented and will be released soon. It looks quite neat. You can checkout the develop branch.

Hi Rushabh,

Im assuming checking out develop branch means ‘bench switch-to0-develop’, correct?

if so I have done that but still don’t see the collapsible sections as shown in your blog.

I thinks its definitely a good idea, but like Jonathan and bohlian recommend having some user preference would also be nice in the future.

regards

@hpema108 you need to do bench update too.

Btw, this might get released today.

I can see Collapsible section in frappe cloud. It looks good and clean.

Can we customize Is Collapsible using Customize Form?
It will be very helpful if we customize and decide which section need to Collapsible.

Thanks,

1 Like
1 Like