diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000..930f5cb Binary files /dev/null and b/.DS_Store differ diff --git a/Books.html b/Books.html new file mode 100644 index 0000000..c31c278 --- /dev/null +++ b/Books.html @@ -0,0 +1,23 @@ + + + + + + + Books + + +
+
+ +
+ imagem gabrielle +

Gabrielle Oliveira

+

Developer

+
s + +
+ + + + \ No newline at end of file diff --git a/Books_files/img_gabi.jpeg b/Books_files/img_gabi.jpeg new file mode 100644 index 0000000..3c05e2c Binary files /dev/null and b/Books_files/img_gabi.jpeg differ diff --git a/Books_files/style.css b/Books_files/style.css new file mode 100644 index 0000000..bbb1352 --- /dev/null +++ b/Books_files/style.css @@ -0,0 +1,62 @@ +/* header */ + +.name { + position: absolute; + width: 193px; + height: 44px; + left: 464px; + top: 319px; + + font-family: Poppins; + font-style: normal; + font-weight: 500; + font-size: 25px; + line-height: 37px; +} +.profissao { + position: absolute; + width: 130px; + height: 44px; + left: 480px; + top: 355px; + + font-family: Poppins; + font-style: normal; + font-weight: normal; + font-size: 22px; + line-height: 33px; + + color: #3a517d; +} +.imgGabrielle { + position: absolute; + width: 151px; + height: 154px; + left: 462px; + top: 148px; +} +.margin { + position: relative; + width: 1920px; + height: 1080px; + + background: linear-gradient(252.95deg, #f10ff5 0.34%, #772cbd 99.61%); + border-radius: 30px; +} +.retangulo { + position: absolute; + width: 413px; + height: 930px; + left: 348px; + top: 115px; + + background: linear-gradient( + 116.79deg, + rgba(255, 255, 255, 0.48) 0%, + rgba(255, 255, 255, 0.12) 99.45% + ); + backdrop-filter: blur(100px); + /* Note: backdrop-filter has minimal browser support */ + + border-radius: 30px; +} diff --git a/Exercicios/.DS_Store b/Exercicios/.DS_Store new file mode 100644 index 0000000..b76d730 Binary files /dev/null and b/Exercicios/.DS_Store differ diff --git a/Exercicios/1/index.html b/Exercicios/1/index.html index c048397..4491390 100644 --- a/Exercicios/1/index.html +++ b/Exercicios/1/index.html @@ -1,12 +1,36 @@ + Document + + +
+
+ + + + + + + +
+
+ +
+
+ +
+
+ + \ No newline at end of file diff --git a/Exercicios/1/js/script.js b/Exercicios/1/js/script.js index e69de29..d15de02 100644 --- a/Exercicios/1/js/script.js +++ b/Exercicios/1/js/script.js @@ -0,0 +1,24 @@ +document + .querySelector("#botaodeenviar") + .addEventListener("click", function amazenarDados(event) { + event.preventDefault(); // Para que o comportamento padrão do submite não aconteca. + let nome = document.getElementById("nomeDapessoa"); + let exibeResposta = document.getElementById("resposta"); + + pegaNome.value === "" + ? (exibeResposta.innerText = "Por favor, digite o seu nome") + : (exibeResposta.innerHTML = `${pegaNome.value}, dados salvos com sucesso!`); + + /* if (nome.value === '') { //consegue identificar valor. + + console.log(nome.value + ); + exibeResposta.innerText = 'Por Favor, digite seu nome'; + } else { + exibeResposta.innerHTML = (`${nomeUsuario}, dados salvos com sucesso.`); + + } + + +*/ + }); diff --git a/Exercicios/2/index.html b/Exercicios/2/index.html index 5c3fad8..2036773 100644 --- a/Exercicios/2/index.html +++ b/Exercicios/2/index.html @@ -2,20 +2,20 @@ DOM - - + +

Venda de apartamentos

+
Apartamento de dois dormitórios, clique e veja o preço:
-
-
-
+
Apartamento de três dormitórios, clique e veja o preço:
- +
- + + - \ No newline at end of file + diff --git a/Exercicios/2/js/script.js b/Exercicios/2/js/script.js index 67c244f..b6aa476 100644 --- a/Exercicios/2/js/script.js +++ b/Exercicios/2/js/script.js @@ -1,12 +1,20 @@ function mostraPrecoAptoDoisDorm() { - //especificar o elemento do DOM que será manipulado. DICA: botão + //especificar o elemento do DOM que será manipulado. DICA: botão - //evento de exibição do valor do imóvel - }; - - function mostraPrecoAptoTresDorm() { + //evento de exibição do valor do imóvel - }; - - mostraPrecoAptoDoisDorm(); - mostraPrecoAptoTresDorm(); \ No newline at end of file + let getBotaoApDoisDorm = document.querySelector("#btnAptoDoisDorm"); + + getBotaoApDoisDorm.addEventListener("click", function mostraValor() { + document.getElementById("precoAptoDoisDorm").innerText = + "Preço do imóvel: R$ 500.000,00"; + }); +} + +function mostraPrecoAptoTresDorm() { + document.getElementById("precoAptoTresDorm").innerHTML = + " Preço do imóvel: R$ 600.000,00"; +} + +mostraPrecoAptoDoisDorm(); +mostraPrecoAptoTresDorm(); diff --git a/Exercicios/3/index.html b/Exercicios/3/index.html index 458873b..66a43fb 100644 --- a/Exercicios/3/index.html +++ b/Exercicios/3/index.html @@ -1,5 +1,6 @@ + @@ -9,28 +10,30 @@ - -
-
-

Se inscreva para receber mais informações

-

- -

+ +

Venda de apartamentos

-
-
- - -
-
- -
-
+
Apartamento de dois dormitórios, clique e veja o preço:
+ +
+
Apartamento de três dormitórios, clique e veja o preço:
+ +
+
+
+ +
+
+ +
+
+
+ \ No newline at end of file diff --git a/Exercicios/3/script/script.js b/Exercicios/3/script/script.js index 5bc108a..f5b73d5 100644 --- a/Exercicios/3/script/script.js +++ b/Exercicios/3/script/script.js @@ -1,11 +1,26 @@ -/*Sequência lógica +// /*Sequência lógica -1 - armazenar valores e-mail e botão +// 1 - armazenar valores e-mail e botão -*/ +// */ -botao.addEventListener("click", function(){ +// botao.addEventListener("click", function(){ - //evento para a exibição do texto na tela principal +// //evento para a exibição do texto na tela principal -}) +// }) +function mostraPrecoAptoDoisDorm() { + //evento de exibição do valor do imóvel + let getBotaoApDoisDorm = document.querySelector("#btnAptoDoisDorm"); + + getBotaoApDoisDorm.addEventListener("click", function mostraValor() { + document.getElementById("precoAptoDoisDorm").innerText = + "Preço do imóvel: R$ 500.000,00"; + }); +} +function mostraPrecoAptoTresDorm() { + document.getElementById("precoAptoTresDorm").innerHTML = + " Preço do imóvel: R$ 600.000,00"; +} + +mostraPrecoAptoDoisDorm(); diff --git a/Exercicios/Event-Listener/index.html b/Exercicios/Event-Listener/index.html new file mode 100644 index 0000000..e7d1152 --- /dev/null +++ b/Exercicios/Event-Listener/index.html @@ -0,0 +1,23 @@ +------------------------------- Terceiro Exemplo ----------------------------------------------- + + + + + + + + Document + + + +

Olá a todos!

+ +

Meu nome é Gabrielle.

+ + Clique para mudar o background dessa página. + + + + < src="./.js"> + + \ No newline at end of file diff --git a/Exercicios/Event-Listener/script.js b/Exercicios/Event-Listener/script.js new file mode 100644 index 0000000..ccc5b34 --- /dev/null +++ b/Exercicios/Event-Listener/script.js @@ -0,0 +1,13 @@ +/*Const textAlterar = document.getElementById ("mudanca-texto");*/ +//Quero acessar meu dom, pra isso utilizar a primeiro elemento do meu DOM document, depois chamei o getElementById. + +//Para testar se esta tudo ok: + +document.getElementById('acoesBotao').addEventListener('click', function acionarBotao() { + const mudaCorTitulo = document.querySelector('.meu-titulo').style.color = "blue"; + + const mudaTextoParagrafo = document.querySelector('#meuNome').innerHTML += " E eu tenho 21 anos." + + const mudaEstiloSpan = document.querySelector('span').style.textDecoration = "underline"; +}); + diff --git a/Exercicios/Event-Query/index.html b/Exercicios/Event-Query/index.html new file mode 100644 index 0000000..2da4c00 --- /dev/null +++ b/Exercicios/Event-Query/index.html @@ -0,0 +1,20 @@ + + + + + + + + Document + + + +

Olá a Todos

+

Meu nome é Gabrielle

+ Clique para mudar de backgroud dessa página + + + + + + \ No newline at end of file diff --git a/Exercicios/Event-Query/script.js b/Exercicios/Event-Query/script.js new file mode 100644 index 0000000..27f3b07 --- /dev/null +++ b/Exercicios/Event-Query/script.js @@ -0,0 +1,8 @@ +function mudarCor() { + const mudarCorTitle = document.querySelector( + '.meu-titulo ').style.color = "red"; + const mudarParagrafo = document.querySelector('#meuNome').innerHTML += " lalala "; + + const mudaSpan = document.querySelector('span').style.textDecoration = "underline"; + +} \ No newline at end of file diff --git a/Exercicios/Ex4/index.html b/Exercicios/Ex4/index.html new file mode 100644 index 0000000..556c653 --- /dev/null +++ b/Exercicios/Ex4/index.html @@ -0,0 +1,15 @@ + + + + + + + My page + + +

Clique nesse botão para mudar o texto desse paragrafo

+ + + + + \ No newline at end of file diff --git a/Exercicios/Ex4/script.js b/Exercicios/Ex4/script.js new file mode 100644 index 0000000..7ecafe1 --- /dev/null +++ b/Exercicios/Ex4/script.js @@ -0,0 +1,10 @@ +/*Const textAlterar = document.getElementById ("mudanca-texto");*/ +//Quero acessar meu dom, pra isso utilizar a primeiro elemento do meu DOM document, depois chamei o getElementById. + +//Para testar se esta tudo ok: + +function alterarTexto() { + const textAlterar = (document.getElementById("mudanca-texto").innerHTML = + "Hello World"); + return textAlterar; +} diff --git "a/Exerc\303\255cio de Casa/.DS_Store" "b/Exerc\303\255cio de Casa/.DS_Store" new file mode 100644 index 0000000..810fadb Binary files /dev/null and "b/Exerc\303\255cio de Casa/.DS_Store" differ diff --git "a/Exerc\303\255cio de Casa/img/discord.png" "b/Exerc\303\255cio de Casa/img/discord.png" new file mode 100644 index 0000000..9880f77 Binary files /dev/null and "b/Exerc\303\255cio de Casa/img/discord.png" differ diff --git "a/Exerc\303\255cio de Casa/img/github.png" "b/Exerc\303\255cio de Casa/img/github.png" new file mode 100644 index 0000000..9490ffc Binary files /dev/null and "b/Exerc\303\255cio de Casa/img/github.png" differ diff --git "a/Exerc\303\255cio de Casa/img/img_gabi.jpeg" "b/Exerc\303\255cio de Casa/img/img_gabi.jpeg" new file mode 100644 index 0000000..3c05e2c Binary files /dev/null and "b/Exerc\303\255cio de Casa/img/img_gabi.jpeg" differ diff --git "a/Exerc\303\255cio de Casa/img/linkedin.png" "b/Exerc\303\255cio de Casa/img/linkedin.png" new file mode 100644 index 0000000..d321404 Binary files /dev/null and "b/Exerc\303\255cio de Casa/img/linkedin.png" differ diff --git "a/Exerc\303\255cio de Casa/img/slack.png" "b/Exerc\303\255cio de Casa/img/slack.png" new file mode 100644 index 0000000..75be2cc Binary files /dev/null and "b/Exerc\303\255cio de Casa/img/slack.png" differ diff --git "a/Exerc\303\255cio de Casa/index.html" "b/Exerc\303\255cio de Casa/index.html" index e69de29..7eb1e29 100644 --- "a/Exerc\303\255cio de Casa/index.html" +++ "b/Exerc\303\255cio de Casa/index.html" @@ -0,0 +1,87 @@ + + + + + + + Books + + + +
+
+
+ imagem gabrielle +

Gabrielle Oliveira

+

Developer

+
+ + linkedin + + + discord + + + + git hub + +
+
+
+
+ +

Biblioteca

+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + + + + + + + + + + +
AutorTítuloTítuloISBNData da PublicaçãoData da InserçãoData da Publicação
+ +