[WIP] Feature - Welcome Screen #138
Conversation
…ng "Go to app" button
The |
package.json
Outdated
| @@ -18,6 +18,7 @@ | |||
| "private": false, | |||
| "dependencies": { | |||
| "browser-image-resizer": "^1.1.3", | |||
| "formik": "^0.10.5", | |||
src/components/App/App.constants.js
Outdated
| @@ -1,3 +1,7 @@ | |||
| // action types constants | |||
| export const FINISH_FIRST_VISIT = 'cboard/Speech/FINISH_FIRST_VISIT'; | |||
There was a problem hiding this comment.
Should be'cboard/App/FINISH_FIRST_VISIT'
There was a problem hiding this comment.
Oops, copy and paste 😅
| import { FormControl, FormHelperText } from 'material-ui/Form'; | ||
|
|
||
| const TextField = ({ error, ...props }) => ( | ||
| <FormControl className="SignUp__field" error={!!error}> |
There was a problem hiding this comment.
classname SignUp__field suggests a SignUp component, yet the filename/path suggest generic TextField. If you intend to keep the FormItems generic, you should change the classname and have the CSS files inside each FormItems component.
| import Typography from 'material-ui/Typography'; | ||
|
|
||
| const Information = () => ( | ||
| <Fragment> |
There was a problem hiding this comment.
Way to go for using Fragment!
| @@ -0,0 +1,20 @@ | |||
| .Login__field:not(:first-child) { | |||
| margin-top: 0.75em !important; | |||
There was a problem hiding this comment.
We should avoid !important, they're contagious, if this is because you need to run over MUI styles, I'd rather you'd override at the JS level, inside the component (only for MUI related)
| } | ||
|
|
||
| .Login__field_gender { | ||
| margin-top: 1em !important; |
| @@ -1,8 +1,20 @@ | |||
| .SignUp { | |||
| .SignUp__field:not(:first-child) { | |||
| margin-top: 0.75em !important; | |||
| } | ||
|
|
||
| .SignUp__heading { | ||
| .SignUp__field_gender { | ||
| margin-top: 1em !important; |
| /> | ||
| </div> | ||
| <div className="WelcomeScreen__footer"> |
There was a problem hiding this comment.
Should use semantic <footer> element,
|
@shayc, I've updated the branch with what you reviewed. |
| } | ||
|
|
||
| .WelcomeScreen__heading { | ||
| color: #eceff1 !important; |
There was a problem hiding this comment.
To use this color, we can't avoid this !important. 😕
…denner/cboard into arthurdenner-feature/welcome-screen-v2
…ng "Go to app" button
…ub.com/shayc/cboard into arthurdenner-feature/welcome-screen-v2
Adding translations and tweaking styles
A constants file was created to determine the API URL in development and production axios was installed to handle the API calls nicely It was created a LoadingIcon component based on the MUI CircularProgress Login and Signup were moved to .component files Some fields in the Signup form were removed because they're not in the user model at the moment Were created containers and actions for the Login and Signup The App reducer was modified to contain loading status for Login and Signup
|
looking good! |
Hello, everybody.
This PR is not finished, as the title says, but I wanted to share what I've built so far to get feedback and to ask a question regarding #22.
So, I started working on this feature with the components that already existed, but after a while, I started to not like the result, so I decided to start almost from the scratch.
So far, I've added a simple page with some information about the project (pure copy & paste from GitHub and the website) and the forms for sign in and sign up. The following things are missing:
My question is:
That's it for now. Please feel free to comment and leave your opinion about the UI or anything else.