diff --git a/README.md b/README.md
index 58beeac..5696a72 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,9 @@
+# Desafio Dio
+## Buscar uma lista de repositórios no Github inserindo o nome do usuário
+
+## Tela exemplo:
+<img src="https://github.com/sdias-code/trilha-react-desafio2-github-wiki/blob/master/src/assets/tela_exemplo.png" alt="Tela exemplo do desafio">
+
 # Getting Started with Create React App
 
 This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
diff --git a/src/assets/tela_exemplo.png b/src/assets/tela_exemplo.png
new file mode 100644
index 0000000..7b491c7
Binary files /dev/null and b/src/assets/tela_exemplo.png differ
diff --git a/src/components/Button/styles.js b/src/components/Button/styles.js
index b6f3d74..bcba6b0 100644
--- a/src/components/Button/styles.js
+++ b/src/components/Button/styles.js
@@ -6,10 +6,11 @@ export const ButtonContainer = styled.button`
     border: 1px solid #FAFAFA;
     border-radius: 20px;
 
-    height: 62px;
-    width: 80%;
+    width: 150px;
+    padding: 20px 0;
+    margin-bottom: 30px;
 
-    margin: 20px;
+    font-size: 25px;
 
     &: hover {
         background-color: #FAFAFA40;
diff --git a/src/components/Input/index.js b/src/components/Input/index.js
index 1d2bc38..03bdfd2 100644
--- a/src/components/Input/index.js
+++ b/src/components/Input/index.js
@@ -5,7 +5,7 @@ import { InputContainer } from './styles';
 function Input({value, onChange}) {
   return (
     <InputContainer>
-        <input value={value} onChange={onChange}/>
+        <input value={value} onChange={onChange} placeholder="Digite o usuário do GitHub"/>
     </InputContainer>
   )
 }
diff --git a/src/components/Input/styles.js b/src/components/Input/styles.js
index 6e2bb16..de82203 100644
--- a/src/components/Input/styles.js
+++ b/src/components/Input/styles.js
@@ -6,15 +6,13 @@ export const InputContainer = styled.div`
     border-radius: 20px;
 
     height: 62px;
-    width: 80%;
-
-    margin: 20px;
-    
+    width: 600px;
+    margin: 10px 0;    
 
     input {
         background: transparent;
         border: 0;
-        width: 90%;
+        width: 560px;
         height: 62px;
         padding: 0 20px;
         color: #FFFFFF;
diff --git a/src/components/ItemRepo/index.js b/src/components/ItemRepo/index.js
index c878a6e..2dabe30 100644
--- a/src/components/ItemRepo/index.js
+++ b/src/components/ItemRepo/index.js
@@ -2,18 +2,14 @@ import React from 'react'
 
 import { ItemContainer } from './styles';
 
-function ItemRepo({repo, handleRemoveRepo}) {
-
-  const handleRemove = () => {
-    handleRemoveRepo(repo.id)
-  }
+function ItemRepo({repo, handleRemoveRepo}) { 
 
   return (
-    <ItemContainer onClick={handleRemove}>
+    <ItemContainer>
         <h3>{repo.name}</h3>
         <p>{repo.full_name}</p>
         <a href={repo.html_url} rel="noreferrer" target="_blank">Ver repositório</a><br />
-        <a href="#"  rel="noreferrer" className="remover">Remover</a>
+        <button href={repo.html_url}  rel="noreferrer" className="remover" onClick={() => handleRemoveRepo(repo.id)}>Remover</button>
         <hr />
     </ItemContainer>
   )
diff --git a/src/components/ItemRepo/styles.js b/src/components/ItemRepo/styles.js
index 2925c6c..a299cea 100644
--- a/src/components/ItemRepo/styles.js
+++ b/src/components/ItemRepo/styles.js
@@ -6,17 +6,28 @@ export const ItemContainer = styled.div`
     h3 {
         font-size: 32px;
         color: #FAFAFA;
+        margin-bottom: 10px;
+        font-size: 30px;
     }
 
     p {
-        font-size:16px;
         color: #FAFAFA60;
-        margin-bottom:20px;
+        margin-bottom:30px;
+        font-size: 20px;
+        
     }
 
-    a.remover {
+    a {
+        background-Color: #e3ebdd;
+        padding: 13px 19px;        
+    }        
+
+    button.remover {
         color: #FF0000;
-        margin-top:20px;
+        background-Color: #e3ebdd;
+        margin-top: 30px;
+        padding: 10px 25px;
+        font-size: 20px;
     }
 
     hr {
diff --git a/src/pages/App.js b/src/pages/App.js
index b1fec98..f4ec7fb 100644
--- a/src/pages/App.js
+++ b/src/pages/App.js
@@ -1,51 +1,45 @@
-
-import { useState } from 'react';
-import gitLogo from '../assets/github.png'
-import Input from '../components/Input';
-import Button from '../components/Button';
-import ItemRepo from '../components/ItemRepo';
-import { api } from '../services/api';
-
-import { Container } from './styles';
+import { useState } from "react";
+import gitLogo from "../assets/github.png";
+import Input from "../components/Input";
+import Button from "../components/Button";
+import ItemRepo from "../components/ItemRepo";
+import { api } from "../services/api";
+import { Container } from "./styles";
 
 function App() {
-
-  const [currentRepo, setCurrentRepo] = useState('');
+  const [currentRepo, setCurrentRepo] = useState("");
   const [repos, setRepos] = useState([]);
 
-
   const handleSearchRepo = async () => {
-
-    const {data} = await api.get(`repos/${currentRepo}`)
-
-    if(data.id){
-
-      const isExist = repos.find(repo => repo.id === data.id);
-
-      if(!isExist){
-        setRepos(prev => [...prev, data]);
-        setCurrentRepo('')
-        return
-      }
-
+    try {
+      const { data } = await api.get(`${currentRepo}/repos`);
+      console.log(data);
+      setRepos(data);
+      setCurrentRepo("");
+    } catch (error) {
+      alert("Repositório não encontrado");
     }
-    alert('Repositório não encontrado')
-
-  }
-
-  const handleRemoveRepo = (id) => {
-    console.log('Removendo registro', id);
-
-    // utilizar filter.
-  }
+  };
 
+  const handleRemoveRepo = (repoId) => {
+    setRepos(repos.filter((repo) => repo.id !== repoId));
+  };
 
   return (
     <Container>
-      <img src={gitLogo} width={72} height={72} alt="github logo"/>
-      <Input value={currentRepo} onChange={(e) => setCurrentRepo(e.target.value)} />
-      <Button onClick={handleSearchRepo}/>
-      {repos.map(repo => <ItemRepo handleRemoveRepo={handleRemoveRepo} repo={repo}/>)}
+      <img src={gitLogo} width={72} height={72} alt="github logo" />
+      <Input
+        value={currentRepo}
+        onChange={(e) => setCurrentRepo(e.target.value)}        
+      />
+      <Button onClick={handleSearchRepo} />
+      {repos.map((repo) => (
+        <ItemRepo
+          key={repo.id}
+          handleRemoveRepo={handleRemoveRepo}
+          repo={repo}
+        />
+      ))}
     </Container>
   );
 }
diff --git a/src/services/api.js b/src/services/api.js
index 722127c..01fe1ad 100644
--- a/src/services/api.js
+++ b/src/services/api.js
@@ -1,5 +1,5 @@
 import axios from 'axios';
 
 export const api = axios.create({
-    baseURL: 'https://api.github.com'
+    baseURL: 'https://api.github.com/users/'
 })
\ No newline at end of file