Ola, seria possível disponibilizar um link direto do projeto do curso? porque eu estudo pelo o PC da empresa e eles bloqueiam certos sites como o GitHub, mas precisava muito fazer esse curso. seria possível?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Ola, seria possível disponibilizar um link direto do projeto do curso? porque eu estudo pelo o PC da empresa e eles bloqueiam certos sites como o GitHub, mas precisava muito fazer esse curso. seria possível?
Oi Danilo,
Eu não sei se ajudaria, mas vou colocar aqui os dois arquivos que estavam no .zip:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./assets/css/style.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=BioRhyme&family=Space+Mono&display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<title>Ceep</title>
</head>
<body>
<div class="app">
<div class="todo-list">
<h1 class="title">
Ceep
</h1>
<form class="form" action="">
<input class="form-input" type="text">
<button class="form-button"> Novo Item </button>
</form>
<ul class="list">
</ul>
</div>
</body>
</html>/assets/css/style.css
body {
margin: 0;
}
.app {
display: flex;
align-items: center;
justify-content: center;
width: 100vw;
min-height: 100vh;
}
.todo-list {
background-color: #0B2027;
font-family: "Space Mono", monospace;
padding: 1rem;
min-width: 400px;
min-height: 300px;
}
.title {
border-bottom: 1px solid rgba(246, 241, 209, 0.5);
font-size: 1.5rem;
font-family: "BioRhyme", serif;
color: #F6F1D1;
}
.form {
display: flex;
justify-content: center;
}
.form-input,
.form-button {
border-radius: 0;
padding: 0.75rem;
font-size: 0.75rem;
}
.form-input {
outline: none;
background-color: #F6F1D1;
border-color: rgba(255, 255, 255, 0.1);
}
.form-button {
border: 1px;
background: #F6F1D1;
text-transform: uppercase;
cursor: pointer;
margin-left: 0.25rem;
}
.form-button:hover {
color: #F6F1D1;
background: rgba(246, 241, 209, 0.1);
}
body {
margin: 0;
}
.app {
display: flex;
align-items: center;
justify-content: center;
width: 100vw;
min-height: 100vh;
}
.todo-list {
background-color: #0B2027;
font-family: "Space Mono", monospace;
padding: 1rem;
min-width: 400px;
min-height: 300px;
}
.title {
border-bottom: 1px solid rgba(246, 241, 209, 0.5);
font-size: 1.5rem;
font-family: "BioRhyme", serif;
color: #F6F1D1;
}
.form {
display: flex;
justify-content: center;
}
.form-input, .form-button {
border-radius: 0;
padding: 0.75rem;
font-size: 0.75rem;
}
.form-input {
outline: none;
background-color: #F6F1D1;
border-color: rgba(255, 255, 255, 0.1);
}
.form-button {
border: 1px;
background: #F6F1D1;
text-transform: uppercase;
cursor: pointer;
margin-left: 0.25rem;
}
.form-button:hover {
color: #F6F1D1;
background: rgba(246, 241, 209, 0.1);
}
.list {
padding: 0;
list-style: none;
width: 100%;
}
.task {
background-color: rgba(255, 255, 255, 0.1);
color: #F6F1D1;
display: flex;
justify-content: space-between;
margin-bottom: 0.5rem;
padding: 1rem 3rem;
}
.check-button, .delete-button {
background-color: #F6F1D1;
border: none;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
outline: none;
border-radius: 2px;
cursor: pointer;
}
.task.done .check-button {
background-color: #46494C;
color: #F6F1D1;
}
.check-icon {
display: block;
padding: 1px;
width: 10px;
height: 10px;
background-color: transparent;
border-radius: 50%;
}
.task.done .check-icon {
background-color: #0B2027;
}
.content {
margin: 0;
}
.task.done .content {
text-decoration: line-through;
}
/*# sourceMappingURL=style.css.map */
Opa Marcos, muito obrigado. Ja serve pra mim!!
Opa Marcos, muito obrigado. Ja serve pra mim!!