Skip to content

Avaliação Estágio Ímpar - Bruno Gomes Nogueira #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Avaliação Estágio Ímpar - Bruno Gomes Nogueira #10

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6fd5685
finalizando projeto
BNog Nov 14, 2021
b3ec0f1
Merge branch 'main' of https://github.com/pedroparadella/frontendjr
BNog Nov 14, 2021
67308f0
Olá
BNog Nov 14, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 3 additions & 23 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,24 +1,4 @@
# Avaliação Junior
Olá desenvolvedor!\
Tudo bem?! 😊\
\
Seja bem-vindo, o intuito do teste não é reprovar e sim conhecer seu melhor estilo de programar e resolver problemas.

## O que fazer
1. Fazer um fork desse repositório e trabalhar no seu ambiente.
2. Replicar o layout do link abaixo, pode usar dados de um JSON local:\
[Link para o layout](https://xd.adobe.com/view/c715f110-fbd4-4323-be0c-0e453c1450db-9246)
2. Fazer a funcionalidade de busca funcionar.
3. Os cliques nos botões de editar/excluir/criar card podem exibir um alerta de que a funcionalidade não foi implementada.
4. Ao finalizar a avaliação modifique esse README com as instruções de como podemos fazer o seu código rodar na nossa máquina. Ou seja, passo a passo do que instalar e de quais comandos rodar para podermos visualizar o seu trabalho!
5. Realizar um Pull Request para o nosso repositório e mandar um e-mail para [email protected] com o assunto "Avaliação Junior", informando que finalizou a avaliação e colocando o link do Pull Request.

## Dicas
* Não foi definido limite de linhas e colunas, portanto fique à vontade para tal escolha.
* Gostamos de interfaces limpas e elegantes.

## Quais tecnologias usar
* Deixaremos a seu critério qual tecnologia utilizar no entanto você terá mais pontos conosco se utilizar React para criação da interface e também o uso de pré-processadores/styled-components para o CSS.

## Desafios se você se sentir confiante
* Usar alguma API na internet, tipo https://pokeapi.co/, para trazer os dados que vão aparecer nos cards da tela.
Olá me chamo Bruno, venho apresentar meu projeto para a vaga de estágio!
Para visualizar o meu projeto basta executar o arquivo index.html que irá abrir no seu servidor
Por lá irá conseguir ver toda a maneira de como foi construido o site.
215 changes: 215 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,215 @@
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Teste - Ímpar</title>
<link rel="stylesheet" href="src/css/style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mulish:wght@300&display=swap" rel="stylesheet">
</head>
<body>
<header>
<img src="src/img/logo-teste.png" alt="Logo Ímpar" />
</header>
<section class="search">
<input onchange="searchCards(event)" type="text" class="search-txt" placeholder="Digite aqui sua busca..." />
</section>
<section class="resultado">
<div class="resultado-heading">
<h2>Resultado de Busca</h2>
<button onclick="alert('Esta função não foi implementada ainda.')" class="btncard">
Novo Card
</button>
</div>
<div class="resultado-cards">
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 1</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 2</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 3</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 123</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 4</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 5</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 6</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 7</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="icon-hand-background"><i class="hand"></i></div>
<div class="card-body-text">
<hr />
<span>Teste 8</span>
</div>
</div>
<div class="card-footer">
<div class="js-card-footer-button-delete card-footer-button">
<img src="src/img/Icon-trash.svg" alt="Excluir card" />
<span>Excluir</span>
</div>
<hr class="vr" />
<div class="js-card-footer-button-edit card-footer-button">
<img src="src/img/Icon-edit.svg" alt="Editar card" />
<span>Editar</span>
</div>
</div>
</div>
</div>
</section>
<footer>
<p>&copy; Bruno Nogueira</p>
</footer>
<script type="text/javascript" src="src/index.js"></script>
</body>
</html>
Loading