search

silverstripe / silverstripe-framework

Silverstripe Framework, the MVC framework that powers Silverstripe CMS
https://www.silverstripe.org
BSD 3-Clause "New" or "Revised" License
719 stars 823 forks source link

React: Convert "Metadata" CompositeField to React and Bootstrap #5649

Open chillu opened 8 years ago

chillu commented 8 years ago

Convert the "Metadata" collapsible panel to React, using Bootstrap collapse (http://v4-alpha.getbootstrap.com/components/collapse/). Note that keyboard accessibility is important, and if possible we should try to avoid recreating this UI component form scratch (even if its simple).

Might take some inspiration from react-bootstrap (https://github.com/react-bootstrap/react-bootstrap/blob/master/src/Collapse.js) - the library is not compatible with Bootstrap 4 yet, so we can't use the components outright.

Adjust the styling to a flatter look, taking inspiration from the guidelines at https://projects.invisionapp.com/boards/9GX68PTXUQFH/

This will be the first time we're using a React component in the entwine-powered CMS Pages edit form, so you'll likely need a bit of help from an Open Sourcerer to create an entwine wrapper that instanciates the React component.

We don't have good docs on React component use yet, check https://github.com/Automattic/wp-calypso/blob/master/docs/components.md and https://github.com/Automattic/wp-calypso/blob/master/docs/coding-guidelines/css.md

tractorcow commented 8 years ago

I've started work on react-formschema composite fields at https://github.com/silverstripe/silverstripe-framework/issues/5611. It won't solve this issue, but it will start standardising composite / collapsable fields.