15-11-23

penafortee · Nov 15, 2023 · 73ce6d8 · 73ce6d8
commit 73ce6d8
Show file tree

Hide file tree

Showing 10 changed files with 320 additions and 0 deletions.
diff --git a/Projeto1-Conversor-Moedas/README.md b/Projeto1-Conversor-Moedas/README.md
@@ -0,0 +1,17 @@
+# Olá pessoal! 👋
+
+Me chamo Nathália Penaforte de Freitas, atualmente estudante de desenvolvimento web focado em front-end.
+Por alguns anos trabalhei com implantação de software focado em Field Service, realizando integrações via API e ETL e entre outros pontos.
+Mas decidi ingressar na área que almejo, então atualmente não estou trabalhando e apenas estudando em busca de uma oportunidade.
+
+- 🔭 Atualmente estou trabalhando em alguns projetos pessoais para prática, poderá encontrar em meus repositórios.
+- 🌱 Atualmente estou estudando Desenvolvimento Web - Front-End.
+- 📫 Como entrar em contato comigo:
+- 📞 WhatsApp: (21) 97187-7287
+- 📧E-mail: nathipenaforte@gmail.com
+- 📌Linkedin: https://www.linkedin.com/in/nathalia-freitas-1644031b3/
+
+# Projeto Imersão Alura - Aula 1
+
+Neste projeto foi ensinado por vídeo aula com a equipe da Alura a montar um conversor de moedas.
+Então neste projeto pude aplicar a prática de JavaScript, HTML e CSS. E foi possível montar uma página para a prática do curso.
diff --git a/Projeto1-Conversor-Moedas/css/style.css b/Projeto1-Conversor-Moedas/css/style.css
@@ -0,0 +1,78 @@
+body {
+  font-family: "Volkorn", "Courier New", Courier, monospace;
+  text-align: center;
+  background-image: url("https://static.vecteezy.com/ti/fotos-gratis/p2/4523061-notas-de-dolar-com-taxas-de-cambio-no-fundo-gratis-foto.jpg");
+  background-color: #000000;
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  height: 900px;
+}
+
+h1,
+p,
+li {
+  color: white;
+  text-align: center;
+  font-family: "Nunito";
+  font-style: bold;
+}
+
+p {
+  font-size: 20px;
+}
+
+h1 {
+  font-size: 40px;
+}
+
+li {
+  font-size: 30px;
+}
+
+.container {
+  text-align: center;
+  padding: 20px;
+}
+
+.alura-logo {
+  width: 40px;
+  position: absolute;
+  top: 10px;
+  right: 10px;
+}
+
+.btnConversao {
+  height: 30px;
+  font-size: 18px;
+  font-style: bold;
+  font-family: "Nunito";
+  background: #000000;
+  color: white;
+  align-items: center;
+  border-radius: 5px;
+  box-shadow: 5px 5px 15px 0 rgba(44, 44, 44, 0.15);
+  transition: 0.1sg ease-out;
+  margin: 5px 5px 5px 5px;
+}
+
+.btnConversao:hover {
+  background-color: green;
+}
+
+.valorDolar {
+  height: 23px;
+  font-family: "Nunito";
+  border-radius: 5px;
+}
+
+.valorReal {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: red;
+  font-size: 30px;
+  font-style: bold;
+  font-family: "Nunito";
+  border-radius: 5px;
+}
diff --git a/Projeto1-Conversor-Moedas/img/background.jpg b/Projeto1-Conversor-Moedas/img/background.jpg
diff --git a/Projeto1-Conversor-Moedas/img/bitcoin.mp4 b/Projeto1-Conversor-Moedas/img/bitcoin.mp4
diff --git a/Projeto1-Conversor-Moedas/index.html b/Projeto1-Conversor-Moedas/index.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>
+      Conversor de Moedas
+    </title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no" />
+
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Alumni+Sans+Collegiate+One&family=Inconsolata:wght@200&family=Nunito:ital,wght@0,400;0,600;1,400&family=Vollkorn:ital,wght@0,400;0,700;1,400&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="css/style.css" />
+  </head>
+  <body>
+    <div class="container">
+      <h1 class="page-title">
+        Conversor de moedas<br>
+      </h1>
+      <ul>
+        <li>Dólar</li>
+      </ul>
+      <br></br>
+      <p class="page-subtitle">
+        Valor em Reais
+      </p>
+      <br></br>
+     <input type='text' id='valor' class='valorDolar' placeholder='Digite o valor US$'/>
+     <input type ='button' id='btn' class = 'btnConversao' onclick = 'conversao();' value = 'Converter'/>
+    <br></br>
+    <div class="valorReal" id="valorReal">
+    </div>
+    </div>
+      <a href="https://alura.com.br/" target="_blank">
+        <img src="https://www.alura.com.br/assets/img/home/alura-logo.svg" alt="" class="alura-logo">
+        </a>
+        <script src="js/javascript.js"></script>
+  </body>
+  <footer class="footer">
+    <p>Projeto Realizado por Nathália Freitas - Todos direitos reservados.</p>
+  </footer>
+</html>
+
+
diff --git a/Projeto1-Conversor-Moedas/js/javascript.js b/Projeto1-Conversor-Moedas/js/javascript.js
@@ -0,0 +1,12 @@
+function conversao() {
+  var real = document.getElementById("valor").value;
+  if (real == "" || real <= 0) {
+    document.getElementById("valorReal").innerHTML =
+      "Por favor, digite um valor.";
+  } else {
+    var dolar = parseFloat(real) * 4.93;
+    var valorConvertido = dolar.toFixed(2);
+
+    document.getElementById("valorReal").innerHTML = "R$ " + valorConvertido;
+  }
+}
diff --git a/Projeto2-Mentalista/README.md b/Projeto2-Mentalista/README.md
@@ -0,0 +1,17 @@
+# Olá pessoal! 👋
+
+Me chamo Nathália Penaforte de Freitas, atualmente estudante de desenvolvimento web focado em front-end.
+Por alguns anos trabalhei com implantação de software focado em Field Service, realizando integrações via API e ETL e entre outros pontos.
+Mas decidi ingressar na área que almejo, então atualmente não estou trabalhando e apenas estudando em busca de uma oportunidade.
+
+- 🔭 Atualmente estou trabalhando em alguns projetos pessoais para prática, poderá encontrar em meus repositórios.
+- 🌱 Atualmente estou estudando Desenvolvimento Web - Front-End.
+- 📫 Como entrar em contato comigo:
+- 📞 WhatsApp: (21) 97187-7287
+- 📧E-mail: nathipenaforte@gmail.com
+- 📌Linkedin: https://www.linkedin.com/in/nathalia-freitas-1644031b3/
+
+# Projeto Imersão Alura - Aula 2
+
+Neste projeto foi ensinado por vídeo aula com a equipe da Alura a montar um jogo de sorte para adivinhar o número aleatório.
+Então neste projeto pude aplicar a prática de JavaScript, HTML e CSS. E foi possível montar uma página para a prática do curso.
diff --git a/Projeto2-Mentalista/css/style.css b/Projeto2-Mentalista/css/style.css
@@ -0,0 +1,96 @@
+body {
+  display: block;
+  font-family: "Volkorn", "Courier New", Courier, monospace;
+  text-align: center;
+  background-image: url("https://caelum-online-public.s3.amazonaws.com/assets-imersaodev/background_mentalista.png");
+  background-color: #000000;
+  background-size: cover;
+  background-position: center top;
+  background-repeat: no-repeat;
+  height: 100vh;
+  max-width: 100%;
+}
+
+.container {
+  text-align: center;
+  padding: 20px;
+}
+
+.page-title {
+  color: #ffffff;
+  margin: 0 0 5px;
+}
+
+.page-subtitle {
+  color: #ffffff;
+  margin-top: 5px;
+}
+
+.page-logo {
+  display: grid;
+  align-self: flex-start;
+  width: 200px;
+}
+
+.alura-logo {
+  width: 40px;
+  position: absolute;
+  top: 10px;
+  right: 10px;
+}
+
+body > img {
+  margin: 0 10px;
+}
+
+img {
+  max-height: 350px;
+}
+
+.footer {
+  display: flex;
+  height: 200px;
+  align-items: center;
+}
+
+.footer p {
+  flex: 1;
+  text-align: center;
+  font-size: 3em;
+  color: white;
+}
+
+.chute {
+  height: 30px;
+  font-size: 18px;
+  font-style: bold;
+  font-family: "Nunito";
+  color: black;
+  border-radius: 5px;
+  box-shadow: 5px 5px 15px 0 rgba(44, 44, 44, 0.15);
+  transition: 0.1sg ease-out;
+  margin: 5px 5px 5px 5px;
+}
+
+.jogar {
+  height: 30px;
+  font-size: 18px;
+  font-style: bold;
+  font-family: "Nunito";
+  color: black;
+  align-items: center;
+  border-radius: 5px;
+  box-shadow: 5px 5px 15px 0 rgba(44, 44, 44, 0.15);
+  transition: 0.1sg ease-out;
+  margin: 5px 5px 5px 5px;
+}
+
+.jogar:hover {
+  background-color: red;
+}
+
+.footer p {
+  font-size: 20px;
+  font-style: bold;
+  font-family: "Nunito";
+}
diff --git a/Projeto2-Mentalista/index.html b/Projeto2-Mentalista/index.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Projeto Mentalista</title>
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, shirink-to-fit=no"
+    />
+    <link rel="stylesheet" href="css/style.css" />
+    <script src="js/js.js"></script>
+  </head>
+  <body>
+    <div class="container">
+      <h1 class="page-title">Mentalista</h1>
+      <input type="text" id="chute" class="chute" placeholder="Digite o valor!">
+      <input type ='button' id='jogar' class = 'jogar' onclick = 'jogar();' value = 'Jogar'/>
+      <img class="page-logo"
+        src="https://www.alura.com.br/assets/img/imersoes/dev-2021/logo-imersao-aluraflix.svg"
+        alt="logo"
+      />
+    <a href="https://alura.com.br/" target="_blank">
+      <img class="cerebro"
+        src="https://caelum-online-public.s3.amazonaws.com/assets-imersaodev/Ilustra%C3%A7%C3%A3o-c%C3%A9rebro+1.png"
+      />
+    </a>
+  </body>
+  <footer class="footer">
+    <p>Projeto Realizado por Nathália Freitas - Todos direitos reservados.</p>
+  </footer>
+</html>
diff --git a/Projeto2-Mentalista/js/js.js b/Projeto2-Mentalista/js/js.js
@@ -0,0 +1,24 @@
+function jogar() {
+  var numeroSecreto = parseInt(Math.random() * (1001 - 1) + 1);
+  var inteirar = 0;
+  console.log(numeroSecreto);
+
+  var chute;
+
+  while (chute != numeroSecreto) {
+    if (inteirar != 0) {
+      alert("Você já fez " + inteirar + " tentativas!");
+    }
+    chute = prompt("Digite um número entre 1 e 1000");
+
+    if (chute == numeroSecreto) {
+      alert("Acertou! Está com sorte!");
+    } else if (chute > numeroSecreto) {
+      alert("Errou! O número secreto é menor que " + chute);
+    } else if (chute < numeroSecreto) {
+      alert("Errou! O número secreto é maior que " + chute);
+    }
+
+    inteirar += 1;
+  }
+}