From 9ff42999c241887d67ee6cdfd97e6da6657d05a8 Mon Sep 17 00:00:00 2001 From: Izabelle Souza Date: Fri, 23 Apr 2021 21:53:55 -0300 Subject: [PATCH] subindo biblioteca online em js --- Exercicios/1/index.html | 6 +- Exercicios/1/js/script.js | 3 + Exercicios/Teste-Event-Listener/index.html | 21 +++ Exercicios/Teste-Event-Listener/script.js | 7 + Exercicios/Teste-Exemplo/index.html | 15 ++ Exercicios/Teste-Exemplo/script.js | 4 + Exercicios/Teste-Query-Selector/index.html | 21 +++ Exercicios/Teste-Query-Selector/script.js | 7 + Exercicios/Teste-Query-Selector/style.css | 4 + .../img/biblioteca-online.png" | Bin 0 -> 2578 bytes "Exerc\303\255cio de Casa/index.html" | 90 ++++++++++ "Exerc\303\255cio de Casa/script/script.js" | 40 +++++ "Exerc\303\255cio de Casa/style/style.css" | 156 ++++++++++++++++++ 13 files changed, 373 insertions(+), 1 deletion(-) create mode 100644 Exercicios/Teste-Event-Listener/index.html create mode 100644 Exercicios/Teste-Event-Listener/script.js create mode 100644 Exercicios/Teste-Exemplo/index.html create mode 100644 Exercicios/Teste-Exemplo/script.js create mode 100644 Exercicios/Teste-Query-Selector/index.html create mode 100644 Exercicios/Teste-Query-Selector/script.js create mode 100644 Exercicios/Teste-Query-Selector/style.css create mode 100644 "Exerc\303\255cio de Casa/img/biblioteca-online.png" diff --git a/Exercicios/1/index.html b/Exercicios/1/index.html index c048397..ee18464 100644 --- a/Exercicios/1/index.html +++ b/Exercicios/1/index.html @@ -7,6 +7,10 @@ Document - +
+ + +
+ \ No newline at end of file diff --git a/Exercicios/1/js/script.js b/Exercicios/1/js/script.js index e69de29..f8f75a9 100644 --- a/Exercicios/1/js/script.js +++ b/Exercicios/1/js/script.js @@ -0,0 +1,3 @@ +document.querySelector('#botaoDeEnviar').adcEventListener('click', function armazenarDados() { + event.prevent +}) \ No newline at end of file diff --git a/Exercicios/Teste-Event-Listener/index.html b/Exercicios/Teste-Event-Listener/index.html new file mode 100644 index 0000000..5ac38e3 --- /dev/null +++ b/Exercicios/Teste-Event-Listener/index.html @@ -0,0 +1,21 @@ + + + + + + + Document + + + +

Olá a todos!

+ +

Meu nome é Vivian.

+ + Clique para mudar o background dessa página. + + + + + + \ No newline at end of file diff --git a/Exercicios/Teste-Event-Listener/script.js b/Exercicios/Teste-Event-Listener/script.js new file mode 100644 index 0000000..be5ad9a --- /dev/null +++ b/Exercicios/Teste-Event-Listener/script.js @@ -0,0 +1,7 @@ +document.getElementById('acoesBotao').addEventListener('click', function acionarBotao() { + const mudaCorTitulo = document.querySelector('.meu-titulo').style.color = "blue"; + + const mudaParagrafo = document.querySelector('#meuNome').innerHTML += " E eu tenho 32 anos." + + const mudaSpan = document.querySelector('span').style.textDecoration = "underline"; +}) \ No newline at end of file diff --git a/Exercicios/Teste-Exemplo/index.html b/Exercicios/Teste-Exemplo/index.html new file mode 100644 index 0000000..4bc0211 --- /dev/null +++ b/Exercicios/Teste-Exemplo/index.html @@ -0,0 +1,15 @@ + + + + + + + Minha primeira página + + +

Clique nesse botão para mudar o texto desse parágrafo!

+ + + + + diff --git a/Exercicios/Teste-Exemplo/script.js b/Exercicios/Teste-Exemplo/script.js new file mode 100644 index 0000000..7813bc4 --- /dev/null +++ b/Exercicios/Teste-Exemplo/script.js @@ -0,0 +1,4 @@ +function alterarTexto() { + const textoAAlterar = document.getElementById("mudanca-texto").innerHTML += " Hello Word"; + return textoAAlterar; +} \ No newline at end of file diff --git a/Exercicios/Teste-Query-Selector/index.html b/Exercicios/Teste-Query-Selector/index.html new file mode 100644 index 0000000..0424587 --- /dev/null +++ b/Exercicios/Teste-Query-Selector/index.html @@ -0,0 +1,21 @@ + + + + + + + Document + + + +

Olá a todos!

+ +

Meu nome é Vivian.

+ + Clique para mudar o background dessa página. + + + + + + \ No newline at end of file diff --git a/Exercicios/Teste-Query-Selector/script.js b/Exercicios/Teste-Query-Selector/script.js new file mode 100644 index 0000000..451e883 --- /dev/null +++ b/Exercicios/Teste-Query-Selector/script.js @@ -0,0 +1,7 @@ + function mudarCor() { + const mudaCorTitulo = document.querySelector('.meu-titulo').style.color = "blue"; + + const mudaParagrafo = document.querySelector('#meuNome').innerHTML += " E eu tenho 32 anos." + + const mudaSpan = document.querySelector('span').style.textDecoration = "underline"; +} \ No newline at end of file diff --git a/Exercicios/Teste-Query-Selector/style.css b/Exercicios/Teste-Query-Selector/style.css new file mode 100644 index 0000000..585efa1 --- /dev/null +++ b/Exercicios/Teste-Query-Selector/style.css @@ -0,0 +1,4 @@ +* { + background-color: lightcoral; +} + diff --git "a/Exerc\303\255cio de Casa/img/biblioteca-online.png" "b/Exerc\303\255cio de Casa/img/biblioteca-online.png" new file mode 100644 index 0000000000000000000000000000000000000000..c07e9f4896c8dc848fb2421f1f83a9d85d480aa1 GIT binary patch literal 2578 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 literal 0 HcmV?d00001 diff --git "a/Exerc\303\255cio de Casa/index.html" "b/Exerc\303\255cio de Casa/index.html" index e69de29..01acc13 100644 --- "a/Exerc\303\255cio de Casa/index.html" +++ "b/Exerc\303\255cio de Casa/index.html" @@ -0,0 +1,90 @@ + + + + + + + Biblioteca Online + + + + +
+
+ +
+ +
+
+ +
+ +
+ + +
+ + +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ +
+ + +
+
+ +
+ + + + + + + + + +
TítuloAutorISBNData de PublicaçãoPáginasData de Cadastro
+ +
+ +
+ +
+ +
+ + + \ No newline at end of file diff --git "a/Exerc\303\255cio de Casa/script/script.js" "b/Exerc\303\255cio de Casa/script/script.js" index e69de29..fc6c929 100644 --- "a/Exerc\303\255cio de Casa/script/script.js" +++ "b/Exerc\303\255cio de Casa/script/script.js" @@ -0,0 +1,40 @@ +function exibirDados (event) { + event.preventDefault(); + + let pegaAutor = document.getElementById('autor').value; + let pegaTítulo = document.querySelector('#titulo').value; + let pegaISBN = document.querySelector('#isbn').value; + let pegaPaginas = document.querySelector('#paginas').value; + let pegaDataPublicacao = document.getElementById('dataPublicacao').value; + let dataInsercao = new Date().toLocaleDateString('pt-br'); + let horarioInsercao = new Date().toLocaleTimeString('pt-br'); + + document.getElementById('resposta').innerHTML += ` + + ${pegaTítulo} + ${pegaAutor} + ${pegaISBN} + ${pegaDataPublicacao} + ${pegaPaginas} + ${dataInsercao}, ${horarioInsercao} + + ` + limpardados() +} + +function limpardados () { + document.getElementById('titulo').value=""; + document.getElementById('autor').value=""; + document.getElementById('isbn').value=""; + document.getElementById('dataPublicacao').value=""; + document.getElementById('paginas').value=""; + +} + +document.querySelector("#botaoDelete").addEventListener('click', function exluirLivro (event) { + event.preventDefault(); + + document.getElementById('tabelaDeLivro').remove(); +}) + + diff --git "a/Exerc\303\255cio de Casa/style/style.css" "b/Exerc\303\255cio de Casa/style/style.css" index e69de29..865144e 100644 --- "a/Exerc\303\255cio de Casa/style/style.css" +++ "b/Exerc\303\255cio de Casa/style/style.css" @@ -0,0 +1,156 @@ +body { + background: linear-gradient( + 116.79deg, + rgba(55, 168, 40, 0.48) 0%, + rgba(207, 206, 209, 0.12) 99.45% + ); + } + +.titulo { + text-align: center; +} + +.cabecalho { + background: url(../img/biblioteca-online.png); + height: 20vh; + background-size:contain; + background-position: center; + background-repeat: no-repeat; +} + +.biblioteca_titulo { + position: absolute; + width: 300px; + height: 100px; + left: 570px; + top: 120px; + + font-family: Poppins; + font-style: normal; + font-weight: 300; + font-size: 30px; + line-height: 100px; + + color: rgba(15, 3, 15, 0.9); + +} + +.form { + align-items: center; + margin-top: 50px; + display: flex; + flex-direction: column; +} + +.topicos_form { + padding: 12px; + display: flex; + flex-direction: column; +} + +table { + border: 2px solid rgb(99, 97, 97); + letter-spacing: 1px; + width: 100%; + border-radius: 20px; + padding: 1%; + text-align: center; + margin-top: 60px; +} + +th { + border: 1px solid rgb(0, 0, 0); + padding: 10%; + border-radius: 25px; + text-align: center; + color: white; + +} + +tr { + background-color: rgb(139, 172, 86); + text-align: center; +} + +td { + text-align: center; + height: 4vh; + padding: 1%; + color: rgb(255, 255, 255); +} + +.excluirEbook { + text-align: center; + margin-top: 20px; +} + +body { + background-color: rgb(157, 223, 151); + transition: .4s; + } + +.titulo { + text-align: center; +} + +.cabecalho { + background: url(../img/biblioteca-online.png); + height: 20vh; + background-size:contain; + background-position: center; + background-repeat: no-repeat; +} + +.form { + align-items: center; + margin-top: 50px; + display: flex; + flex-direction: column; +} + +.topicos_form { + width: 228px; + height: 40px; + font-size: 20px; + color: rgba(10, 29, 8, 0.9); +} +} + +table { + border: 2px solid rgb(88, 38, 5); + letter-spacing: 1px; + width: 100%; + border-radius: 8px; + padding: 1%; + text-align: center; + margin-top: 60px; +} + +th { + border: 1px solid rgb(0, 0, 0); + padding: 1%; + border-radius: 5px; + text-align: center; + color: white; + +} + +tr { + background-color: rgb(185, 102, 34); + text-align: center; + font-family: Poppins; + font-style: normal; +} + +td { + text-align: center; + height: 4vh; + padding: 1%; + color: rgb(255, 255, 255); +} + +.excluirEbook { + text-align: center; + margin-top: 20px; +} +