oskojess / violencias-invisiveis-app Goto Github PK

Welcome powerful developer girls.

First thing I want to congratulate all of you for another to stage to come.
You're the best!

Here we're going to create, discuss and review all codes made by all of you.

If you have any questions about GitHub, access this link: Click here

I holpe that you guys enjoy it.
❤️

Dialog Card is filled with gray

Create only the card without information inside it**

Reference material:

All cards will be made with the

• Material-ui:
  https://material-ui.com/api/dialog/
  https://material-ui.com/demos/dialogs/
  https://material-ui.com/demos/dialogs/#accessibility

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Card is filled with gray

Reference material:

All cards will be made with the

• Material-ui:
  https://material-ui.com/api/card/
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Dependent UI
Similar: https://www.change.org/ (click login)

Here we will follow the tasks step by step.

Dependent tasks

All taks will have reference materials to improve development flux. \o/

Reference material:

• Material-ui:
  https://material-ui.com/api/form-control/
  https://material-ui.com/api/form-control/

• Styled-components:
  https://www.styled-components.com/

• Flexbox:
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Here we will follow the tasks step by step.

• Insert main title #12

• Create Card #13

• Insert Card's label #14

• Insert description and observation labels #15

• Add icons #16

All taks will have reference materials to improve development flux.

Add icons is filled with gray

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/style/icons/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Label is filled with gray

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Video Card is filled with gray

Create only the card without information inside it**

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/api/card-media/
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Card is filled with gray

Create only the card without information inside it**

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Icons is filled with gray

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/style/icons/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Here we will follow the tasks step by step.

• Insert main title #31

• Create Card #32

• Insert Card's Title (Iniciar, Acompanhar and Tutorial) #33

• Add buttons (Começar and Ver) and icons #34

All taks will have reference materials to improve development flux.

Description and observation is filled with gray

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Create the main menu with only one reference card for the trainee to do the other two.
At the moment there are no integration with the backend, leaving the button directed to the destination route.

Reference material:

https://material-ui.com/demos/cards/

https://material-ui.com/api/card/

Card's description is filled with gray

Create only the card without information inside it**

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/demos/dialogs/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

• USER

• ADMIN

Reference material:

All cards will be made with the

• Material-ui:
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Here will be listed all your tasks:

• Main Menu (Dashboard) #37

• Petition Follow

• Tutorial

Reference material:
https://material-ui.com

Prototype*

bug: name is not found

Here we will follow the tasks step by step.

• Insert main title #18

• Create Card #19

• Insert Card's label #20

• Insert options select and observation labels #21

• Add icons #22

(Maybe will have more tasks 💟)

All taks will have reference materials to improve development flux. \o/

Title is filled with gray

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

• USER

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/style/icons/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Main Title is filled with gray

Reference material:

All cards will be made with the

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Here we will follow the tasks step by step.

• Create Video Card #25

• Create Dialog Card #27

• Insert Card's description #28

• Add icons #29

All taks will have reference materials to improve development flux.

Card is filled with gray

Create only the card without information inside it**

Reference material:

All cards will be made with the

• Material-ui:
  https://material-ui.com/api/cards/
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/demos/selects/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Dependent UI
Similar: https://www.change.org/ (click login)

Here we will follow the tasks step by step.

Dependent tasks

All taks will have reference materials to improve development flux. \o/

Reference material:

• Material-ui:
  https://material-ui.com/api/form-control/
  https://material-ui.com/api/form-control/

• Formik:
  https://github.com/jaredpalmer/formik

• Styled-components:
  https://www.styled-components.com/

• Flexbox:
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Add buttons and icon is filled with gray

Reference material:

All cards will be made with the

• Material-ui.
  https://material-ui.com/api/button/
  https://material-ui.com/demos/buttons/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Create only the card without information inside it**

Reference material:

All cards will be made with the

• Material-ui:
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Title is filled with gray

Reference material:

All cards will be made with the

• Material-ui:
  https://material-ui.com/demos/cards/

• Styled-components.
  https://www.styled-components.com/

• Flexbox.
  https://css-tricks.com/snippets/css/a-guide-to-flexbox/

• Nathalia #38

Prototipo - Violências Invisíveis App v2.pdf