... | ... | @@ -25,5 +25,62 @@ Devemos considerar que foi decidido neste projeto que iríamos trabalhar com a d |
|
|
|
|
|
![Captura_de_Tela_2020-06-07_às_23.11.11](uploads/45c41401004999ba131857b50365ddf9/Captura_de_Tela_2020-06-07_às_23.11.11.png)
|
|
|
|
|
|
## Componentes
|
|
|
# Componentes padronizados
|
|
|
|
|
|
## Breadcrumb
|
|
|
Mostra valores escolhidos pelo usuário em telas anteriores.
|
|
|
- Props: aircraft, island, thoughts.
|
|
|
- Figma: Card / Overview.
|
|
|
|
|
|
## CardShow
|
|
|
Representa "card" que somente mostra a informação (sem inserção de usuário).
|
|
|
- Props: children (inserir elementos dentro da tag deste).
|
|
|
- Figma: Card / Show.
|
|
|
|
|
|
## CloudImageBackground
|
|
|
Plano de fundo composto por nuvens e cores temáticas do app.
|
|
|
- Props: children (inserir elementos dentro da tag deste).
|
|
|
- Figma: background / Cloud pattern.
|
|
|
|
|
|
## HistoryTripCard
|
|
|
Mostra todas informações de uma viagem realizada.
|
|
|
- Props: trip.
|
|
|
- Figma: Card / Overview (versão completa).
|
|
|
|
|
|
## Loading
|
|
|
Representa indicador de carregamento de alguma ação já estilizado.
|
|
|
- Props: loading (booleano).
|
|
|
- Figma: Não existe.
|
|
|
|
|
|
## MainLabel
|
|
|
Padroniza estilo de texto do título principal.
|
|
|
- Props: children (inserir elementos dentro da tag deste).
|
|
|
- Figma: Text label / Main.
|
|
|
|
|
|
## SubtitleLabel
|
|
|
Padroniza estilo de texto de subtítulos.
|
|
|
- Props: children (inserir elementos dentro da tag deste).
|
|
|
- Figma: Text label / Subtitle.
|
|
|
|
|
|
## PageBanner
|
|
|
Padroniza "card" que mostra informação juntamente com título e subtítulo opcional.
|
|
|
- Props: title, subtitle.
|
|
|
- Figma: Card / Show (completo).
|
|
|
|
|
|
## TutorialModal
|
|
|
Modal que representa overlay para apresentar informações durante o tutorial.
|
|
|
- Props: image, children (inserir elementos dentro da tag deste).
|
|
|
- Figma: Não existe.
|
|
|
|
|
|
---
|
|
|
|
|
|
# Constantes globais
|
|
|
|
|
|
## Colors
|
|
|
Constante composta que centraliza todos códigos de cores utilizados no app.
|
|
|
- Figma: Aba "Paleta de cores".
|
|
|
|
|
|
## shadowCode
|
|
|
Constante que engloba propriedades de "css" que compõem o código da sombra utilizada em diversos elementos da interface.
|
|
|
- Figma: Qualquer componente que tenha sombra.
|
|
|
|