farmOS / field-kit

A modular, offline-first companion app to farmOS.
https://farmOS.org
GNU General Public License v3.0
60 stars 39 forks source link

Integrate layout components and core design tokens. #407

Closed jgaehring closed 3 years ago

jgaehring commented 3 years ago

As a first step towards removing Bootstrap entirely, I want to remove all Bootstrap layout classes (container-fluid etc) with custom layout components based on the Braid Design System.

jgaehring commented 3 years ago

Apart from replacing the Bootstrap row's and container's in the screen-level components like EditLog, I think it will be important to make sure all my content components area also using Braid-based layout components so that responsive props and design tokens can be consistently passed down to the children components seamlessly. It may be helpful to implement a FarmBox component, similar to Braid's Box, as a primitive and use it across all components, including in FarmInline and FarmStack.

jgaehring commented 3 years ago

I think the best way to start on this is to replace all the Bootstrap styles in the AllLogs component. Might want to rename that component, too, while I'm at it.

jgaehring commented 3 years ago

Layout components are all finally integrated into TasksAll (formerly AllLogs) and all the core components, such as Home, Login, etc. The design tokens have also been integrated into all those components, plus the layout components themselves. All layout components have been documented in Storybook. The only thing left is to remove Bootstrap classes from TasksEdit, which will be done when I overhaul that design in #408. So I'm closing this so I can begin that tomorrow.