ibm-watson-data-lab / shopping-list-react-pouchdb

Shopping List is an Offline First demo Progressive Web App built using React and PouchDB.
https://ibm-watson-data-lab.github.io/shopping-list-react-pouchdb
Apache License 2.0
27 stars 19 forks source link

UI Layout: Does it meet the design guidelines? #58

Closed ptitzler closed 6 years ago

ptitzler commented 6 years ago

I've noticed that the button layout is different from the layout used in other implementations. For example, the Add button is on the upper right hand side, not on the lower right hand side as expected. The settings button is on the upper left hand side, whereas it is on the upper right hand side of the vanilla JS app.

From @bradley-holt: [...] we should be following the Material Design system (https://material.io/). However, if there is a particular style system that is common for a particular stack then we should defer to that style system. In my understanding, lower right is where the floating action button belongs according to Material Design. I believe that the React version is using Material Design (via the Material UI library), so the floating action button should be in the bottom right.