From a300a451c85b664a9a5c9c813f1d516d1cd6ecba Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Wed, 10 Oct 2018 22:50:20 +0200 Subject: Explains tools we want them to use --- packages/dev-tools-pages/README.md | 14 ++++++++++++++ 1 file changed, 14 insertions(+) (limited to 'packages/dev-tools-pages') diff --git a/packages/dev-tools-pages/README.md b/packages/dev-tools-pages/README.md index b7bdf3bc3..39fe70a25 100644 --- a/packages/dev-tools-pages/README.md +++ b/packages/dev-tools-pages/README.md @@ -35,6 +35,20 @@ Visit [http://localhost:3572/](http://localhost:3572/) in your browser. The webpage will refresh when source code is changed. +### 4. Code! + +There are some basic primitives we'd like you to use: + +1. `Stuff`: Use containers instead of divs,spans,etc... and use it's props instead of inline styles (e.g `style={{margin: 3}}` should be `margin="3px"` + +2. `Look ma, text!`: Use text components whenever rendering text. It has props for manipulating texts, so again no in-line styles. Use `fontColor="red"`, not `style={{color: 'red'}}`. + +3. Styled-components: See the `ui/button.tsx` file for an example of how to use these. + +4. BassCss: This library gives you access to a bunch of [classes](http://basscss.com/) that apply styles in a browser-compatible way, has affordances for responsiveness and alleviates the need for inline styles or LESS/CSS files. + +With the above 4 tools and following the React paradigm, you shouldn't need CSS/LESS files. IF there are special occasions where you do, these is a `all.less` file, but this is a solution of last resort. Use it sparingly. + ### Clean ```bash -- cgit v1.2.3