From 3fa89b09e29810100763568f3823d373bf2005d2 Mon Sep 17 00:00:00 2001 From: Andresa Vieira Date: Mon, 12 Feb 2024 20:23:31 -0300 Subject: [PATCH] finalizando forms --- public/imagens/GitHub.png | Bin 0 -> 2386 bytes public/imagens/email.png | Bin 0 -> 2136 bytes public/imagens/linkedin.png | Bin 0 -> 2031 bytes public/imagens/logo.png | Bin 0 -> 4503 bytes src/App.js | 4 +- src/componentes/Banner/banner.js | 1 + src/componentes/Colaborador/colaborador.js | 4 +- .../ListaSuspensa/ListaSuspensa.js | 10 +++-- src/componentes/Time/time.js | 5 ++- src/componentes/form/form.js | 6 ++- src/componentes/rodape/rodape.css | 17 +++++++++ src/componentes/rodape/rodape.js | 35 ++++++++++++++++++ 12 files changed, 74 insertions(+), 8 deletions(-) create mode 100644 public/imagens/GitHub.png create mode 100644 public/imagens/email.png create mode 100644 public/imagens/linkedin.png create mode 100644 public/imagens/logo.png create mode 100644 src/componentes/rodape/rodape.css create mode 100644 src/componentes/rodape/rodape.js diff --git a/public/imagens/GitHub.png b/public/imagens/GitHub.png new file mode 100644 index 0000000000000000000000000000000000000000..c096ebd72e16ee0ba787f279d84fb503c1c3fdc0 GIT binary patch literal 2386 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 literal 0 HcmV?d00001 diff --git a/public/imagens/linkedin.png b/public/imagens/linkedin.png new file mode 100644 index 0000000000000000000000000000000000000000..16dca6bbcd20163b9eb183cf3b2a5adc57969bd8 GIT binary patch literal 2031 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 WVgnSR&s_Y=BYevaO!?-xPyPmt`*OAb literal 0 HcmV?d00001 diff --git a/src/App.js b/src/App.js index 5a282fb..7ec1148 100644 --- a/src/App.js +++ b/src/App.js @@ -2,13 +2,13 @@ import { useState } from 'react'; import Banner from './componentes/Banner/banner'; import Form from './componentes/form/form' import Time from './componentes/Time/time'; +import Rodape from './componentes/rodape/rodape'; function App() { const [colaboradores, setColaboradores] = useState([]); const aoNovoColaboradorAdd = (colaborador) => { - console.log(colaborador); setColaboradores ([...colaboradores,colaborador]) } @@ -69,6 +69,8 @@ function App() { corSecundaria={time.corSecundaria} colaboradores={colaboradores.filter(colaborador => colaborador.time === time.nome)} />)} + + ); } diff --git a/src/componentes/Banner/banner.js b/src/componentes/Banner/banner.js index 0c2fc06..a0b8c14 100644 --- a/src/componentes/Banner/banner.js +++ b/src/componentes/Banner/banner.js @@ -1,6 +1,7 @@ import './banner.css' function Banner () { + //JSX return (
banner principal diff --git a/src/componentes/Colaborador/colaborador.js b/src/componentes/Colaborador/colaborador.js index 3a6d124..1e36fdd 100644 --- a/src/componentes/Colaborador/colaborador.js +++ b/src/componentes/Colaborador/colaborador.js @@ -1,9 +1,9 @@ import './colaborador.css' -const Colaborador = ({nome, imagem, cargo}) => { +const Colaborador = ({nome, imagem, cargo, corDeFundo}) => { return(
-
+
{nome}
diff --git a/src/componentes/ListaSuspensa/ListaSuspensa.js b/src/componentes/ListaSuspensa/ListaSuspensa.js index dfc11a3..fbfdf39 100644 --- a/src/componentes/ListaSuspensa/ListaSuspensa.js +++ b/src/componentes/ListaSuspensa/ListaSuspensa.js @@ -2,12 +2,16 @@ import "./ListaSuspensa.css" const ListaSuspensa = (props) => { - console.log(props.itens) - return (
- + props.aoAlterado(e.target.value)} + required={props.required} + value={props.valor}> + + + {props.itens.map((item) => { return ; })} diff --git a/src/componentes/Time/time.js b/src/componentes/Time/time.js index a2bb56b..f961943 100644 --- a/src/componentes/Time/time.js +++ b/src/componentes/Time/time.js @@ -5,11 +5,13 @@ const Time = (props) => { const css = { backgroundColor: props.corSecundaria }; return ( -
+ (props.colaboradores.length > 0) ?

{props.nome}

{props.colaboradores.map((colaborador) => ( { ))}
+ : '' ); }; diff --git a/src/componentes/form/form.js b/src/componentes/form/form.js index 0773caa..283ef25 100644 --- a/src/componentes/form/form.js +++ b/src/componentes/form/form.js @@ -19,6 +19,10 @@ const Formulario = (props) => { imagem, time }) + setNome('') + setCargo('') + setImagem('') + setTime('') } return ( @@ -41,7 +45,7 @@ const Formulario = (props) => { setImagem(valor)} /> diff --git a/src/componentes/rodape/rodape.css b/src/componentes/rodape/rodape.css new file mode 100644 index 0000000..07136b4 --- /dev/null +++ b/src/componentes/rodape/rodape.css @@ -0,0 +1,17 @@ +.footer { + background: #6278F7; + color: #FFF; + padding: 15px; + display: flex; + justify-content: space-between; + align-items: center; +} + +.footer ul li { + display: flex; + margin-right: 20px; +} + +.footer ul li:last-child { + margin-right: 0; +} diff --git a/src/componentes/rodape/rodape.js b/src/componentes/rodape/rodape.js new file mode 100644 index 0000000..b17c266 --- /dev/null +++ b/src/componentes/rodape/rodape.js @@ -0,0 +1,35 @@ +import './rodape.css' + +const Rodape = () => { + return () +} + +export default Rodape