diff --git a/NandaAndrade/src/css/style.css b/NandaAndrade/src/css/style.css deleted file mode 100644 index 1ab1b9e..0000000 --- a/NandaAndrade/src/css/style.css +++ /dev/null @@ -1,215 +0,0 @@ -* { - box-sizing: border-box; - font-family: 'Manjari', sans-serif; - font-size: 16px; -} - -body { - margin: 0; - background-color: #9182A6; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: white; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 0px 24px 80px rgba(0, 45, 37, 0.24); -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: #7E77A0; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake .1s linear; - animation-iteration-count: 3; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: #7e77a01a; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.60; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #E6EEC6; - border-radius: 24px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 3px #B0CF30; -} - -.todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: rgb(73, 73, 73); -} - -.checked { - text-decoration: line-through wavy #7E77A0; -} - -.todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -.todo__remover-todos { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: #B0CF30; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: #494949; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 90%; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} \ No newline at end of file diff --git a/NandaAndrade/src/index.html b/NandaAndrade/src/index.html deleted file mode 100644 index a62b22b..0000000 --- a/NandaAndrade/src/index.html +++ /dev/null @@ -1,51 +0,0 @@ - - - - - - - - - - ToDo List - - - - -
-
-

Lista de Tarefas

-
- - -
-
-
    - -
-
- - - - -
- - -
-
-
- - - - - \ No newline at end of file diff --git a/NandaAndrade/src/script.js b/NandaAndrade/src/script.js deleted file mode 100644 index b6cb9ef..0000000 --- a/NandaAndrade/src/script.js +++ /dev/null @@ -1,93 +0,0 @@ -//variável do input (caixinha) -const inputado = document.querySelector('#todoInput'); - -//variável para o botão+ -const botao = document.getElementById('todoSubmit'); - -//variavél para a lista -const listaTarefas = document.getElementById('todoLista'); - -//variável para o formulário -const formulario = document.getElementById('todoForm'); - -//variável para o botao "MArcar todos" -const botaoMarcarTodos = document.querySelector('#todoMarcarTodos'); - -const botaoLimpar = document.getElementById('todoRemoverTodos'); - -//função do botão + (ação do botão de acrescentar as tarefas) -botao.addEventListener('click', (event) => { - - event.preventDefault(); - -// criando elementos no JS dentro da função - const elementoLista = document.createElement('li'); - const textoElemento = document.createElement('p'); - const elementoRemove = document.createElement('span'); - - textoElemento.innerText = inputado.value; - elementoRemove.innerText = '🗑'; - - if(textoElemento.innerText.trim() === ''){ - alert("Insira uma tarefa"); - }else{ - listaTarefas.appendChild(elementoLista); - elementoLista.appendChild(textoElemento); - elementoLista.appendChild(elementoRemove); - - //ação de limpar o histórico do formulario - formulario.reset(); - } - - //função checar (risca o item da lista) - - textoElemento.addEventListener('click' , () => { - textoElemento.classList.add('checked'); - }); - - //função para o botão de remover a lista - - elementoRemove.addEventListener('click' , () => { - elementoLista.remove(); - - }); - - //função para marcar todos através do botão na tela "marcar todos" - botaoMarcarTodos.addEventListener('click' , () => { - - if (botaoMarcarTodos.innerText ==='Marcar todos') { - // o querryselectorall acessa todos os "p" - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(paragrafo => { - paragrafo.classList.add('checked') - }); - botaoMarcarTodos.innerText = 'Desmarcar todos'; - - }else{ - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(paragrafo => { - paragrafo.classList.remove('checked') - }); - botaoMarcarTodos.innerText = 'Marcar todos'; - } - - }); - - // função limpar tudo da lista - botaoLimpar.addEventListener('click', () => { - listaTarefas.remove(); - - - //outra forma de fazer - //botaoLimpar.addEventListener('click', () => { - // listaTarefas.innerHTML = ''; - - }); - - - - -}); - diff --git a/aline-prado/src/css/style.css b/aline-prado/src/css/style.css deleted file mode 100644 index a95c82d..0000000 --- a/aline-prado/src/css/style.css +++ /dev/null @@ -1,216 +0,0 @@ -* { - box-sizing: border-box; - font-family: 'Manjari', sans-serif; - font-size: 16px; -} - -body { - margin: 0; - background-color: #9182A6; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: white; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 0px 24px 80px rgba(0, 45, 37, 0.24); -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: #7E77A0; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake .1s linear; - animation-iteration-count: 3; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: #7e77a01a; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.60; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #E6EEC6; - border-radius: 24px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 3px #B0CF30; -} - -.todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: rgb(73, 73, 73); -} - -.checked { - background-color: #B0CF30; - text-decoration: line-through wavy #7E77A0; -} - -.todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -.todo__remover-todos { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: #B0CF30; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: #494949; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 90%; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} \ No newline at end of file diff --git a/aline-prado/src/index.html b/aline-prado/src/index.html deleted file mode 100644 index 32a3f42..0000000 --- a/aline-prado/src/index.html +++ /dev/null @@ -1,59 +0,0 @@ - - - - - - - - - - ToDo List - - - - -
-
-

Lista de Tarefas

-
- - -
- - -
-
    -
  • -

    -
    • - - - - -
-
- - - - -
- - -
-
-
- - - - - \ No newline at end of file diff --git a/aline-prado/src/script.js b/aline-prado/src/script.js deleted file mode 100644 index 155bf89..0000000 --- a/aline-prado/src/script.js +++ /dev/null @@ -1,75 +0,0 @@ -//variáveis -const inputado = document.querySelector('#todoInput'); -const botao = document.getElementById ('todoSubmit'); -const listaTarefas = document.getElementById ('todoLista'); -const formulario = document.getElementById('todoForm'); -const botaoMarcarTodos = document.getElementById('todoMarcarTodos'); -const botaoLimpar = document.getElementById('todoRemoverTodos'); - -//criando evento -botao.addEventListener('click', (event) => { - event.preventDefault(); - - const elementoLista = document.createElement('li'); - const textoElemento = document.createElement('p'); - const deletaElemento = document.createElement('span'); - -//atribuindo valor - textoElemento.innerText = inputado.value; - deletaElemento.innerText = '🗑'; - - //Fase 2 do projeto - if(textoElemento.innerText.trim ()=== '') { - alert ("Insira uma Tarefa") - } else{ -// acrescentando o elemento filho com o append - listaTarefas.appendChild(elementoLista); - elementoLista.appendChild(textoElemento); - elementoLista.appendChild(deletaElemento); - - } - - formulario.reset(); -//função checar - textoElemento.addEventListener('click', ()=> { - textoElemento.classList.add('checked'); - - }); -//função deletar - deletaElemento.addEventListener("click", () => { - listaTarefas.removeChild(elementoLista); - - - }); - - botaoMarcarTodos.addEventListener('click', ()=> { - - if (botaoMarcarTodos.innerText ==='Marcar todos') { - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(paragrafo => { - paragrafo.classList.add ("checked"); - - - }); - botaoMarcarTodos.innerText = 'Desmarcar todos'; - - }else{ - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(item => { - item.classList.remove("checked"); - }); - - botaoMarcarTodos.innerText = 'Marcar todos'; - -} -// função limpar - botaoLimpar.addEventListener("click", () => { - listaTarefas.innerText = ''; -}); - - -}); - -}); diff --git a/allana-evellyn/src/css/style.css b/allana-evellyn/src/css/style.css deleted file mode 100644 index b210a8b..0000000 --- a/allana-evellyn/src/css/style.css +++ /dev/null @@ -1,215 +0,0 @@ -* { - box-sizing: border-box; - font-family: 'Manjari', sans-serif; - font-size: 16px; -} - -body { - margin: 0; - background-color: #96A0FF; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: #F8F2EC; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 0px 24px 80px rgba(0, 45, 37, 0.24); -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: #3C4499; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake .1s linear; - animation-iteration-count: 3; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: #7e77a01a; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.60; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #E7DCD2; - border-radius: 24px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 3px #EBB6C6; -} - -.todo-form__btn { - background-color: #EBB6C6; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 4px solid #C4D8D8; - box-sizing: border-box; - border-radius: 24px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: rgb(73, 73, 73); -} - -.checked { - text-decoration: line-through dotted #3C4499; -} - -.todo__tudo-feito:hover { - background-color: #C4D8D8; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -.todo__remover-todos { - border: 4px solid #C4D8D8; - box-sizing: border-box; - border-radius: 24px; - background-color: #C4D8D8; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: #494949; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: #EBB6C6; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 90%; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: #C4D8D8; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} \ No newline at end of file diff --git a/allana-evellyn/src/img/icone-todolist.png b/allana-evellyn/src/img/icone-todolist.png deleted file mode 100644 index 114ae0e..0000000 Binary files a/allana-evellyn/src/img/icone-todolist.png and /dev/null differ diff --git a/allana-evellyn/src/index.html b/allana-evellyn/src/index.html deleted file mode 100644 index fa22011..0000000 --- a/allana-evellyn/src/index.html +++ /dev/null @@ -1,56 +0,0 @@ - - - - - - - - - - - To-do List - - - - -
-
-

Lista de Tarefas

-
- - -
- - -
-
    - - - -
-
- - - - -
- - -
-
-
- - - - - \ No newline at end of file diff --git a/allana-evellyn/src/script.js b/allana-evellyn/src/script.js deleted file mode 100644 index 4b00467..0000000 --- a/allana-evellyn/src/script.js +++ /dev/null @@ -1,93 +0,0 @@ -// precisa: -// variável do input -// variável do botão de adicionar -// variável da ul - -const inputTarefas = document.querySelector('#todoInput'); -const botao = document.querySelector('#todoSubmit'); -const listaTarefas = document.querySelector('#todoLista'); -const formulario = document.querySelector('#todoForm'); -const botaoLimpar = document.querySelector('#todoRemoverTodos'); -const botaoMarcarTodos = document.querySelector('#todoMarcarTodos'); - - - - -// criar evento do botão -botao.addEventListener('click', (event) => { - event.preventDefault(); - - //adiciona os elementos na lista - const elementoLista = document.createElement('li'); - //cria parágrafo pra onde vai o texto inserido no input - const textoElemento = document.createElement('p'); - //cria span para excluir linhas individualmente - const deletaTarefa = document.createElement('span'); - - - //inclui o valor do input no

quando clicado - textoElemento.innerText = inputTarefas.value; - deletaTarefa.innerText = '❌'; - - if(textoElemento.innerText.trim() === ''){ - alert('Insira uma tarefa'); - - } else { - //elemento filho é acrescentado no nó mãe com o append - listaTarefas.appendChild(elementoLista); - elementoLista.appendChild(textoElemento); - elementoLista.appendChild(deletaTarefa); - - //apaga infos que estavam no input - formulario.reset() ; - -} - //tarefa cumprida cheeeeck - textoElemento.addEventListener('click', () => { - textoElemento.classList.add('checked'); - }); - - //função de deletar (removeChild) - deletaTarefa.addEventListener('click', () => { - listaTarefas.removeChild(elementoLista); - // também se resolve com elementoLista.remove(); - - }); - - - //botão que faz todas as marcações - botaoMarcarTodos.addEventListener('click', () => { - - if (botaoMarcarTodos.innerText === 'Marcar todos'){ - - //pega todas as tags p, pra que quando clicar, marcar tudo - const todosParagrafos = document.querySelectorAll('p'); - - //percorre cada um dos itens dos arrays, vai fazer a ação - todosParagrafos.forEach(item => { - item.classList.add("checked"); - }); - botaoMarcarTodos.innerText = 'Desmarcar todos'; - - } else { - - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(item => { - item.classList.remove('checked'); - }); - - botaoMarcarTodos.innerText = 'Marcar todos'; - - }; - - - }); - - botaoLimpar.addEventListener('click', () => { - listaTarefas.innerHTML = ''; - }); - - -}); - diff --git a/andreza-santana/src/css/style.css b/andreza-santana/src/css/style.css deleted file mode 100644 index 4078e18..0000000 --- a/andreza-santana/src/css/style.css +++ /dev/null @@ -1,223 +0,0 @@ -* { - box-sizing: border-box; - font-family: 'Manjari', sans-serif; - font-size: 16px; -} - -body { - margin: 0; - background-color: #9182A6; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: white; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 0px 24px 80px rgba(0, 45, 37, 0.24); -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: #7E77A0; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake .1s linear; - animation-iteration-count: 3; -} -.deletar { - display: flex; - flex-direction: column; - justify-content: center; -} -.checkbox { - margin-right: 30px; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: #7e77a01a; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.60; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #E6EEC6; - border-radius: 24px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 3px #B0CF30; -} - -.todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: rgb(73, 73, 73); -} - -.checked { - text-decoration: line-through wavy #7E77A0; -} - -.todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -.todo__remover-todos { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: #B0CF30; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: #494949; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 90%; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} \ No newline at end of file diff --git a/andreza-santana/src/index.html b/andreza-santana/src/index.html deleted file mode 100644 index 25e83e3..0000000 --- a/andreza-santana/src/index.html +++ /dev/null @@ -1,51 +0,0 @@ - - - - - - - - - - - ToDo List - - - - -

-
-

Lista de Tarefas

-
- - -
-
-
    -
-
- - - - -
- - -
-
-
- - - - - \ No newline at end of file diff --git a/andreza-santana/src/script.js b/andreza-santana/src/script.js deleted file mode 100644 index 610cc23..0000000 --- a/andreza-santana/src/script.js +++ /dev/null @@ -1,50 +0,0 @@ -// Função que recebe o input do formulário e insere na lista -document.querySelector('#todoSubmit').addEventListener('click', function (event) { - event.preventDefault(); - const tarefa = document.querySelector('#todoInput').value; - if (tarefa === '' || tarefa === ' ' || tarefa === ' ') { - alert('Por favor, inserir uma tarefa!') - } else { - document.querySelector('#todoLista').innerHTML += (`
  • -

    ${tarefa}

    - -
    • `); - } - limparCampos(); -}) -// Função que limpa os campos inputs do formulário. -function limparCampos() { - document.querySelector('#todoInput').value = ''; -} -// Função que elimina apenas uma tarefa. -function deletarPublicacao(event) { - event.target.parentElement.parentElement.remove(); -} -// Função que marca apenas uma tarefa -function marcarTarefa(event) { - event.target.parentElement.classList.toggle("checked"); -} -// Função que marca todas as tarefas e desmarcar todas as tarefas -document.querySelector('#todoMarcarTodos').addEventListener('click', function (event) { - event.preventDefault(); - let paragrafos = document.querySelectorAll('p'); - if (paragrafos.length == 0) { - return; - } - let botaoMarcarTodos = document.querySelector('#todoMarcarTodos'); - if (botaoMarcarTodos.innerText === 'Marcar todos') { - paragrafos.forEach((paragrafo) => paragrafo.classList.add("checked")); - document.querySelectorAll('.checkbox').forEach((checkbox) => checkbox.checked = true); - botaoMarcarTodos.innerText = 'Desmarcar todos'; - } else { - paragrafos.forEach((paragrafo) => paragrafo.classList.remove("checked")); - document.querySelectorAll(".checkbox").forEach((checkbox) => checkbox.checked = false); - botaoMarcarTodos.innerText = 'Marcar todos'; - } -}) -// Função que elimina todas as tarefas -document.querySelector('#todoRemoverTodos').addEventListener('click', function (event) { - event.preventDefault(); - const todasTarefas = document.querySelectorAll('li'); - todasTarefas.forEach((tarefa) => tarefa.remove()); -}) \ No newline at end of file diff --git a/bruna-souza/src/css/style.css b/bruna-souza/src/css/style.css deleted file mode 100644 index 1ab1b9e..0000000 --- a/bruna-souza/src/css/style.css +++ /dev/null @@ -1,215 +0,0 @@ -* { - box-sizing: border-box; - font-family: 'Manjari', sans-serif; - font-size: 16px; -} - -body { - margin: 0; - background-color: #9182A6; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: white; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 0px 24px 80px rgba(0, 45, 37, 0.24); -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: #7E77A0; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake .1s linear; - animation-iteration-count: 3; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: #7e77a01a; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.60; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #E6EEC6; - border-radius: 24px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 3px #B0CF30; -} - -.todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: rgb(73, 73, 73); -} - -.checked { - text-decoration: line-through wavy #7E77A0; -} - -.todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -.todo__remover-todos { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: #B0CF30; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: #494949; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 90%; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} \ No newline at end of file diff --git a/bruna-souza/src/index.html b/bruna-souza/src/index.html deleted file mode 100644 index 322aad5..0000000 --- a/bruna-souza/src/index.html +++ /dev/null @@ -1,53 +0,0 @@ - - - - - - - - - - ToDo List - - - - -
    -
    -

    Lista de Tarefas

    -
    - - -
    - - -
    -
      - -
    -
    - - - - -
    - - -
    -
    -
    - - - - - \ No newline at end of file diff --git a/bruna-souza/src/script.js b/bruna-souza/src/script.js deleted file mode 100644 index a3c20fa..0000000 --- a/bruna-souza/src/script.js +++ /dev/null @@ -1,92 +0,0 @@ -//nó do input -const inputado = document.querySelector('#todoInput'); - -//nó do botão -const botao = document.getElementById('todoSubmit'); - -//nó da ul -const listaTarefas = document.getElementById('todoLista'); - -//nó do formulario -const formulario = document.getElementById('todoForm'); - -//nó do botão limpar -const botaoLimpar = document.getElementById('todoRemoverTodos'); - -//nó do botão marcar todos -const botaoMarcarTodos = document.querySelector('#todoMarcarTodos'); - -/* ! será apagado - const todosOsSpans = document.querySelectorAll('span'); - console.log(todosOsSpans, "todos os spans"); */ - -//criar evento botão -botao.addEventListener('click', (event) => { - //previne que o formulário seja enviado ao clicar, espera processar o que precisa da função - event.preventDefault(); - - const elementoLista = document.createElement('li'); //cria a lista - const textoElemento = document.createElement('p'); //cria o texto da lista - const deletaElemento = document.createElement('span'); - - //atribuimos o valor do input ao

    criando a partir do clique no botão - textoElemento.innerText = inputado.value; //innerText: valor do texto da tag - deletaElemento.innerText = '🗑'; - - /*FASE 02 - 1º: o código abaixo só deve ocorrer se o input não estiver vazio, caso esteja vazio, precisamos mostrar o alert para o usiário - 2º: para excluir itens da lista, precisamos criar um elemento que represente isso, e colocar evento para remover o nó do dom*/ - - // criação de novo item - if(textoElemento.innerText.trim() === '') { - alert("Insira uma tarefa"); //aqui se o usuário inserir uma tarefa vazia, irá emitir um alerta - } else { - //pegamos o nó mãe e acrescentamos o elemento filho com o append - listaTarefas.appendChild(elementoLista); - elementoLista.appendChild(textoElemento); - elementoLista.appendChild(deletaElemento); - - //pegamos o nó do formulário e utilizamos um método para limpar o input - formulario.reset(); - } - - //função de marcar - textoElemento.addEventListener('click', () => { - textoElemento.classList.add('checked'); - }) - - //função de deletar um item da lista - deletaElemento.addEventListener('click', () => { - listaTarefas.removeChild(elementoLista) - //para exlucir todos os elementos de uma vez: listaTarefas.remove(); - }) - - //função de marcar todos - botaoMarcarTodos.addEventListener('click', () => { - //o querySelectorALl retorna um array com itens de acordo com o que foi passado como parâmetro - - if (botaoMarcarTodos.innerText === 'Marcar Todos') { - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(paragrafo => { - paragrafo.classList.add('checked'); - }); - botaoMarcarTodos.innerText = 'Desmarcar Todos'; - } else { - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(paragrafo => { - paragrafo.classList.remove('checked') - }); - botaoMarcarTodos.innerText = 'Marcar Todos'; - } - - }) - - //função de deletar todas as tarefas - botaoLimpar.addEventListener('click', () => { - listaTarefas.innerHTML = ''; - //outra alternativa: listaTarefas.remove(); - }); - -}); \ No newline at end of file diff --git a/dandara-sousa/src/css/style.css b/dandara-sousa/src/css/style.css deleted file mode 100644 index 5e67082..0000000 --- a/dandara-sousa/src/css/style.css +++ /dev/null @@ -1,220 +0,0 @@ -* { - box-sizing: border-box; - font-family: 'Manjari', sans-serif; - font-size: 16px; -} - -.vermelho { - background-color: red; - height:200px; -} - -body { - margin: 0; - background-color: #9182A6; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: white; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 0px 24px 80px rgba(0, 45, 37, 0.24); -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: #7E77A0; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake .1s linear; - animation-iteration-count: 3; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: #7e77a01a; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.60; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #E6EEC6; - border-radius: 24px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 3px #B0CF30; -} - -.todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: rgb(73, 73, 73); -} - -.checked { - text-decoration: line-through wavy #7E77A0; -} - -.todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -.todo__remover-todos { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: #B0CF30; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: #494949; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 90%; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} \ No newline at end of file diff --git a/dandara-sousa/src/index.html b/dandara-sousa/src/index.html deleted file mode 100644 index cd5717f..0000000 --- a/dandara-sousa/src/index.html +++ /dev/null @@ -1,61 +0,0 @@ - - - - - - - - - - ToDo List - - - - -

    -
    -

    Lista de Tarefas

    - -
    - - -
    - - - - - -
    -
      - - -
    -
    - - - - -
    - - -
    -
    -
    - - - - - \ No newline at end of file diff --git a/dandara-sousa/src/script.js b/dandara-sousa/src/script.js deleted file mode 100644 index e38e859..0000000 --- a/dandara-sousa/src/script.js +++ /dev/null @@ -1,128 +0,0 @@ - -/////TENTATIVA DE FAZER SOZINHA -/*const container = document.getElementById('container'); - -console.log(container, "paragrafo"); - - -const texto = document.createElement('p'); - -texto.innerText = "criando para estudo"; - -container.appendChild(texto) - -const todoLista = document.getElementById('todoLista'); - -const itensLista = document.createElement('li'); - -itensLista.innerHTML = ; - -todoLista.appendChild(itensLista);*/ - - -///// FAZENDO COM A PROFESSORA - -//chamar todas as variáveis antes deexecutar suas ações - - -const inputado = document.querySelector('#todoInput'); -const botao = document.getElementById('todoSubmit'); - -//variável da ul -const listaTarefas = document.getElementById('todoLista'); - -//criando variável do formulário - -const formulario = document.getElementById('todoForm'); - -//variavél (nó) do botão limpar -const botaoLimpar = document.getElementById('todoRemoverTodos'); - -//variavél (nó) do botão marcar todos -const botaoMarcarTodos = document.querySelector('#todoMarcarTodos'); /*se habituar a usar o querySelector também*/ - -//criando o evento botão (todos as ações funcionam após o clique do botão por isso são inseridas dentro do evento botão) - -botao.addEventListener('click', (event) => { - //evita que o formulario seja enviado ao clicar (que é nativo do javascript) - event.preventDefault(); - - const elementoLista = document.createElement('li'); - const textoElemento = document.createElement('p'); - const deletaElemento = document.createElement('span'); /*excluir itens da lista individualmente (colocar um evento para remover esse nó do DOM)*/ - - textoElemento.innerText = inputado.value; - deletaElemento.innerText = '🧨'; - - -// Função apra evitar que o input seja feito com espaços em branco -//Trim remove os espaços em branco -if(textoElemento.innerText.trim() === '') { - alert("Insira uma tarefa") -} else{ - - //pega o nó mãe e acrescenta nele um elemento filho através do append - listaTarefas.appendChild(elementoLista); - elementoLista.appendChild(textoElemento); - elementoLista.appendChild(deletaElemento); - - //limpa o campo de escrita após o clique - formulario.reset(); -} - - - //função para dar check no item da lista(para isso é preciso adicionar um evento de clique quando o item for "selecionado") - textoElemento.addEventListener('click', () =>{ - textoElemento.classList.add('checked'); - }); - - - //função para deletar o item da lista ao clicar (ao cilcar no elemento 🧨 a ação vai até a lista de tarefas e remove o elesmento da lista correspondente ) - deletaElemento.addEventListener('click', () =>{ - listaTarefas.removeChild(elementoLista); - }); - - - //função para marcar todos - botaoMarcarTodos.addEventListener('click', () => { - - if (botaoMarcarTodos.innerText=== 'Marcar Todos') { - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(paragrafo => { - paragrafo.classList.add("checked"); - - }); - - botaoMarcarTodos.innerText = 'Desmarcar Todos'; - } else { - - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(paragrafo => { - paragrafo.classList.remove("checked"); - - }); - - botaoMarcarTodos.innerText = 'Marcar Todos'; - - - } - - - - - }); - - - //função para limpar - botaoLimpar.addEventListener('click', () => { - listaTarefas.innerHTML = ''; - console.log("deletar tudo") - }); - -}); - - diff --git a/diana-martine/src/assets/checked-off.svg b/diana-martine/src/assets/checked-off.svg deleted file mode 100644 index d8c0f44..0000000 --- a/diana-martine/src/assets/checked-off.svg +++ /dev/null @@ -1,48 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/diana-martine/src/assets/checked-on.svg b/diana-martine/src/assets/checked-on.svg deleted file mode 100644 index 9934a39..0000000 --- a/diana-martine/src/assets/checked-on.svg +++ /dev/null @@ -1,41 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/diana-martine/src/assets/minus.svg b/diana-martine/src/assets/minus.svg deleted file mode 100644 index ea5464e..0000000 --- a/diana-martine/src/assets/minus.svg +++ /dev/null @@ -1,37 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/diana-martine/src/css/style.css b/diana-martine/src/css/style.css deleted file mode 100644 index 7d2a71b..0000000 --- a/diana-martine/src/css/style.css +++ /dev/null @@ -1,248 +0,0 @@ -* { - box-sizing: border-box; - font-family: "Manjari", sans-serif; - font-size: 16px; -} - -body { - margin: 0; - background-color: antiquewhite; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: pink; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 2px 2px 4px black; -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: purple; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake 0.1s linear; - animation-iteration-count: 3; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: purple; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.6; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #e6eec6; - border-radius: 8px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 1px purple; -} - -.todo-form__btn { - background-color: purple; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 2px 2px 4px black; - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 1px solid purple; - box-sizing: border-box; - border-radius: 8px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: purple; -} - -.checked { - text-decoration: line-through; - opacity: 75%; -} - -.todo__tudo-feito:hover { - background-color: purple; - color: antiquewhite; - box-shadow: 0px 16px 24px purple; - transition: 0.3s; -} - -.todo__remover-todos { - border: 1px solid purple; - box-sizing: border-box; - border-radius: 8px; - background-color: purple; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: antiquewhite; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px purple; - transition: 0.3s; - color: purple; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: purple; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px purple; - width: 56px; - height: 56px; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: purple; - color: antiquewhite; - box-shadow: 0px 16px 24px purple; - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} - -/* alterando css dos elementos adicionados pelo JS */ -#todoTarefas { - background-color: antiquewhite; - margin: auto; - width: 26rem; - border-radius: 8px; - opacity: 80%; -} - -#todoTarefas:hover { - opacity: 1; - transition: .5; -} - -.container-icons { - width: 4rem; - display: flex; - justify-content: space-between; -} - -.check { - width: 1.5rem; -} - -.remove { - width: 1.5rem; -} diff --git a/diana-martine/src/index.html b/diana-martine/src/index.html deleted file mode 100644 index e49d74a..0000000 --- a/diana-martine/src/index.html +++ /dev/null @@ -1,66 +0,0 @@ - - - - - - - - - ToDo List - - - -
    -
    -

    Lista de Tarefas

    -
    - - -
    - -
    -

    -
    - -
    -
      -
      - - - - -
      - - -
      -
      -
      - - - - diff --git a/diana-martine/src/script.js b/diana-martine/src/script.js deleted file mode 100644 index ca7bdea..0000000 --- a/diana-martine/src/script.js +++ /dev/null @@ -1,90 +0,0 @@ -// variáveis globais -const form = document.querySelector("#todoForm"); -const toDo = document.querySelector("#todoInput"); -const submit = document.querySelector("#todoSubmit"); -const toDoList = document.querySelector("#todoLista"); -const selectAll = document.querySelector("#todoMarcarTodos"); -const clearAll = document.querySelector("#todoRemoverTodos"); - -// prevenção do botão submit -submit.addEventListener("click", (e) => { - e.preventDefault(); -}); - -// função de adicionar nova tarefa -function addToDo() { - // criando elementos de modo dinâmico - const newToDo = document.createElement("li"); - const newToDoText = document.createElement("p"); - const containerIcons = document.createElement("div"); - const check = document.createElement("img"); - const remove = document.createElement("img"); - - // alterando atributos dos ícones - newToDoText.classList.add("newToDoText"); - containerIcons.classList.add("container-icons"); - check.src = "./assets/checked-off.svg"; - check.classList.add("check"); - remove.src = "./assets/minus.svg"; - remove.classList.add("remove"); - - // adicionando texto de entrada na tarefa adicionada - newToDoText.innerText = toDo.value; - - // tratando erro de entrada - if (newToDoText.innerText.trim() === "") { - document.querySelector("#message").innerHTML = - "Por favor, preencha os campos!"; - } else { - // adicionando tarefa - toDoList.appendChild(newToDo); - newToDo.appendChild(newToDoText); - newToDo.appendChild(containerIcons); - containerIcons.appendChild(check); - containerIcons.appendChild(remove); - document.querySelector("#message").innerHTML = ""; - - // limpando formulário - form.reset(); - - // função de checado - check.addEventListener("click", () => { - if (check.getAttribute("src") == "./assets/checked-off.svg") { - check.src = "./assets/checked-on.svg"; - newToDoText.classList.add("checked"); - } else { - check.src = "./assets/checked-off.svg"; - newToDoText.classList.remove("checked"); - } - }); - - // função de remover - remove.addEventListener("click", () => { - toDoList.removeChild(newToDo); - }); - - // função limpar lista - clearAll.addEventListener("click", () => { - newToDo.remove(); - }); - } -} - -// função marcar todos -selectAll.addEventListener("click", () => { - let getAllToDo = document.querySelectorAll(".newToDoText"); - let getAllCheckIcon = document.querySelectorAll(".check"); - - if ( - selectAll.innerText === "Marcar todos" || - getAllCheckIcon.src == "./assets/checked-off.svg" - ) { - getAllToDo.forEach((p) => p.classList.add("checked")); - getAllCheckIcon.forEach((img) => (img.src = "./assets/checked-on.svg")); - selectAll.innerText = "Desmarcar todos"; - } else if (selectAll.innerText === "Desmarcar todos") { - getAllToDo.forEach((p) => p.classList.remove("checked")); - getAllCheckIcon.forEach((img) => (img.src = "./assets/checked-off.svg")); - selectAll.innerText = "Marcar todos"; - } -}); diff --git a/ester-louenco/projeto/src/css/style.css b/ester-louenco/projeto/src/css/style.css deleted file mode 100644 index 1ab1b9e..0000000 --- a/ester-louenco/projeto/src/css/style.css +++ /dev/null @@ -1,215 +0,0 @@ -* { - box-sizing: border-box; - font-family: 'Manjari', sans-serif; - font-size: 16px; -} - -body { - margin: 0; - background-color: #9182A6; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: white; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 0px 24px 80px rgba(0, 45, 37, 0.24); -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: #7E77A0; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake .1s linear; - animation-iteration-count: 3; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: #7e77a01a; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.60; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #E6EEC6; - border-radius: 24px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 3px #B0CF30; -} - -.todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: rgb(73, 73, 73); -} - -.checked { - text-decoration: line-through wavy #7E77A0; -} - -.todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -.todo__remover-todos { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: #B0CF30; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: #494949; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 90%; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} \ No newline at end of file diff --git a/ester-louenco/projeto/src/index.html b/ester-louenco/projeto/src/index.html deleted file mode 100644 index 3d5d24e..0000000 --- a/ester-louenco/projeto/src/index.html +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - - - - ToDo List - - - - -
      -
      -

      Lista de Tarefas

      -
      - - -
      -
      -
        -
      -
      - - - - -
      - - -
      -
      -
      - - - - - \ No newline at end of file diff --git a/ester-louenco/projeto/src/script.js b/ester-louenco/projeto/src/script.js deleted file mode 100644 index 26a20a2..0000000 --- a/ester-louenco/projeto/src/script.js +++ /dev/null @@ -1,65 +0,0 @@ -const inputado = document.querySelector('#todoInput'); -const botao = document.getElementById('todoSubmit'); -const listaTarefas = document.getElementById('todoLista'); -const formulario = document.getElementById('todoForm'); -const botaoLimpar = document.getElementById('todoRemoverTodos'); -const botaoMarcarTodas = document.querySelector('#todoMarcarTodos'); - -botao.addEventListener('click', (event) => { - - event.preventDefault(); - - const elementoLista = document.createElement('li'); - const textoElemento = document.createElement('p'); - const deletaElemento = document.createElement('span'); - - - textoElemento.innerText = inputado.value; - deletaElemento.innerText = '🗑️'; - - if (textoElemento.innerText.trim() === '') { - alert("Insira uma tarefa"); - } else { - - listaTarefas.appendChild(elementoLista); - elementoLista.appendChild(textoElemento); - elementoLista.appendChild(deletaElemento); - - formulario.reset(); - } - textoElemento.addEventListener("click", () => { - textoElemento.classList.add("checked"); - }); - - //função de delete - deletaElemento.addEventListener("click", () => { - listaTarefas.removeChild(elementoLista); - - }); - - botaoMarcarTodas.addEventListener('click', () => { - if (botaoMarcarTodas.innerText === 'Marcar todos') { - const todosParagrafos = document.querySelectorAll('p'); - console.log(todosParagrafos, "vai retornar todos os

      encontrados"); - - todosParagrafos.forEach(item => { - item.classList.add("checked"); - }); - botaoMarcarTodas.innerText = 'Desmarcar todos'; - } else { - const todosParagrafos = document.querySelectorAll('p'); - todosParagrafos.forEach(item => { - item.classList.remove("checked"); - }); - botaoMarcarTodas.innerText = 'Marcar todos'; - } - - }); - - // Função de limpar - botaoLimpar.addEventListener('click', () => { - - listaTarefas.innerHTML = ''; - }); - -}); \ No newline at end of file diff --git a/gabriela-coutinho/src/css/style.css b/gabriela-coutinho/src/css/style.css deleted file mode 100644 index 1ab1b9e..0000000 --- a/gabriela-coutinho/src/css/style.css +++ /dev/null @@ -1,215 +0,0 @@ -* { - box-sizing: border-box; - font-family: 'Manjari', sans-serif; - font-size: 16px; -} - -body { - margin: 0; - background-color: #9182A6; - box-sizing: border-box; -} - -li { - display: flex; - max-width: 90%; - justify-content: space-between; - cursor: pointer; -} - -button { - cursor: pointer; -} - -.flex { - min-height: 100%; - display: flex; - align-items: center; - justify-content: center; - padding: 2rem; - flex-direction: column; -} - -.todo__container { - background-color: white; - text-align: center; - margin: 100px auto 0; - width: 100%; - max-width: 30rem; - padding: 0px 0px 32px 0px; - border-radius: 14px; - box-shadow: 0px 24px 80px rgba(0, 45, 37, 0.24); -} - -.todo__title { - text-align: center; - margin: 40px auto 32px auto; - display: inline-block; - font-size: 24px; - color: #7E77A0; -} - -.todo-form { - justify-content: center; - display: flex; -} - -.empty { - position: relative; - animation: shake .1s linear; - animation-iteration-count: 3; -} - -@keyframes shake { - 0% { - left: -5px; - } - 100% { - right: -5px; - } -} - -.todo__tarefas__sample { - max-width: 90%; - background: #7e77a01a; - margin: 0 auto; - height: 60px; - border-radius: 24px; - align-items: center; - padding: 20px; - margin: 16px auto; -} - -.todo__tarefas__sample-content { - background: #8f88b325; - max-width: 50%; - height: 20px; - border-radius: 14px; -} - -.todo__tarefas__sample:last-child { - opacity: 0.60; -} - -.todo-form__input { - width: 75%; - padding: 24px; - height: 60px; - background-color: #E6EEC6; - border-radius: 24px; - border: 0px; - outline: none; - margin-right: 3%; -} - -.todo-form__input:focus { - outline: none; - border: solid 3px #B0CF30; -} - -.todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 55px; - height: 55px; - display: inline-block; - border-radius: 50%; - font-size: 24px; - cursor: pointer; - border: 0px; -} - -.todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 56px; - height: 56px; - transition: 0.3s; -} - -.todo__btn-container { - display: flex; - align-items: center; - justify-content: center; -} - -.todo__tudo-feito { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: transparent; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: rgb(73, 73, 73); -} - -.checked { - text-decoration: line-through wavy #7E77A0; -} - -.todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -.todo__remover-todos { - border: 4px solid #B0CF30; - box-sizing: border-box; - border-radius: 24px; - background-color: #B0CF30; - padding: 16px 20px 16px 20px; - margin: 16px 20px 0px 20px; - color: #494949; -} - -.todo__remover-todos:hover { - background-color: transparent; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; -} - -@media only screen and (max-width: 460px) { - .todo-form { - flex-direction: column; - } - .todo-form__input { - width: 90%; - align-self: center; - margin: 0 auto; - } - .todo-form__btn { - background-color: #7E77A0; - text-transform: uppercase; - color: white; - width: 90%; - height: 55px; - border-radius: 24px; - align-self: center; - margin-top: 8px; - } - .todo-form__btn:hover { - box-shadow: 0px 16px 24px rgba(126, 119, 160, 0.267); - width: 90%; - transition: 0.3s; - } - .todo__btn-container { - flex-direction: column; - } - .todo__tudo-feito { - width: 90%; - } - .todo__tudo-feito:hover { - background-color: #B0CF30; - box-shadow: 0px 16px 24px rgba(175, 207, 48, 0.205); - transition: 0.3s; - } - .todo__remover-todos { - background-color: transparent; - width: 90%; - margin-top: 8px; - } - .todo__tarefas { - margin: 32px auto 24px auto; - } -} \ No newline at end of file diff --git a/gabriela-coutinho/src/index.html b/gabriela-coutinho/src/index.html deleted file mode 100644 index 3d5d24e..0000000 --- a/gabriela-coutinho/src/index.html +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - - - - ToDo List - - - - -

      -
      -

      Lista de Tarefas

      -
      - - -
      -
      -
        -
      -
      - - - - -
      - - -
      -
      -
      - - - - - \ No newline at end of file diff --git a/gabriela-coutinho/src/script.js b/gabriela-coutinho/src/script.js deleted file mode 100644 index 36bfed6..0000000 --- a/gabriela-coutinho/src/script.js +++ /dev/null @@ -1,108 +0,0 @@ -// nó do input -const inputado = document.querySelector('#todoInput'); - -//nó da botao -const botao = document.getElementById('todoSubmit'); - -//nó da ul -const listaTarefas = document.getElementById('todoLista'); - -//nó do formulário -const formulario = document.getElementById('todoForm'); - -//nó do botão limpar -const botaoLimpar = document.getElementById('todoRemoverTodos'); - -// nó do botão marcar todos -const botaoMarcarTodas = document.querySelector('#todoMarcarTodos'); - - -// ! será apagado -const todosOsSpans = document.querySelectorAll('span'); -console.log(todosOsSpans, "todos os spans"); - -// criar evento botão -botao.addEventListener('click', (event) => { - //previne que o formulário seja enviado ao clicar, espera processar o que precisa da função - event.preventDefault(); - - const elementoLista = document.createElement('li'); - const textoElemento = document.createElement('p'); - const deletaElemento = document.createElement('span'); - - // atribuímos o valor do input ao

      criado a partir do clique no botão - textoElemento.innerText = inputado.value; - deletaElemento.innerText = '🧨'; - // para excluir itens da lista, precisamos criar um elemento que represente isso, e colocar evento para remover o nó do dom - - - if (textoElemento.innerText.trim() === '') { - alert("Insira uma tarefa"); - } else { - //pegamos o nó mãe , e acrescentamos o elemento filho com o append - listaTarefas.appendChild(elementoLista); - elementoLista.appendChild(textoElemento); - elementoLista.appendChild(deletaElemento); - - // pegamos o nó do formulário e utilizamos um método para limpar o input - formulario.reset(); - - } - - //função de checar = DÁ O CHECK NO ITEM - textoElemento.addEventListener("click", () => { - textoElemento.classList.add("checked"); - }); - - //função de deletar = REMOVE O ITEM DA LISTA - deletaElemento.addEventListener("click", () => { - listaTarefas.removeChild(elementoLista); - // outra de forma de resolver >>> elementoLista.remove(); - }); - - - //TODO função de marcar todos - botaoMarcarTodas.addEventListener('click', () => { - // o querySelectorALl retorna um array com itens de acordo o passado como parâmetro - - if(botaoMarcarTodas.innerText === 'Marcar todos'){ - const todosParagrafos = document.querySelectorAll('p'); - - console.log(todosParagrafos, "vai retornar todos os

      encontrados"); - - todosParagrafos.forEach(item => { - item.classList.add("checked"); - }); - - botaoMarcarTodas.innerText = 'Desmarcar todos'; - } else { - - const todosParagrafos = document.querySelectorAll('p'); - - todosParagrafos.forEach(item => { - item.classList.remove("checked"); - }); - botaoMarcarTodas.innerText = 'Marcar todos'; - } - - }); - - - // CRIA BOTÃO E FUNÇÃO DE LIMPAR - botaoLimpar.addEventListener('click', () => { - //listaTarefas é