Add files via upload

Aplicação completa, falta ajustes de link e pronto
felipetaua · Jun 10, 2024 · 7773475 · 7773475
1 parent 0a0c3bb
commit 7773475
Show file tree

Hide file tree

Showing 11 changed files with 9,412 additions and 39 deletions.
diff --git a/Images/ODS17.jpg b/Images/ODS17.jpg
diff --git a/Images/banner -ODS17.png b/Images/banner -ODS17.png
diff --git a/Images/banner-d3.svg b/Images/banner-d3.svg
diff --git a/Images/icone-site.jpg b/Images/icone-site.jpg
diff --git a/Images/ods17-redondo.png b/Images/ods17-redondo.png
diff --git a/Images/senac-logo-sem-fundo.png b/Images/senac-logo-sem-fundo.png
diff --git a/Outro.css b/Outro.css
@@ -13,11 +13,18 @@
 /*Bannner*/
 
 #banner2 {
+
     width: 100%;
     height: 300px;
   /*adiciona uma imagem interna ou externa*/
-    background-image: url("./Img/ods17-redondo.png");
+    background-image: url("./Images/ods17-redondo.png") ;
     background-size: contain;/*deixa a imagem preencher todo o     container sem cortá-la*/
     background-position: 50% 80%;
     background-repeat: no-repeat;
+    margin-bottom: 20px;
+}
+/*Negrito dos texto - video*/
+.negrito{
+  color: #FFC94A;
+  font-weight: bold;
 }
diff --git a/README.md b/README.md
@@ -1,3 +1,3 @@
-# Projeto-ODS-9
+# Projeto-ODS-17
 Trabalho sobre ODS
-https://projeto-ods-17.vercel.app/
+
diff --git a/Video-ods.html b/Video-ods.html
@@ -9,19 +9,21 @@
   <link rel="stylesheet" href="./Outro.css">
   <!-- font-awesome--->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
-  <title>Ods9 / video</title>
+      <!--Icone do site(minhatura)-->
+  <link rel="shortcut icon" href="./Images/ods17-redondo.png" type="image/x-icon">
+  <title>Ods17 / video</title>
 </head>
 <body>
       <span id="Home"></span>
     <header>
       <div class="aling-img">
-        <Img src="./Img/logoOds.png"id="logo" alt="logo ODS"></Img>
-        <a href="index.html" class="link-header"target="_blank"><i class="fa-solid fa-house"></i> Início</a>
-        <a href="https://www.estrategiaods.org.br/os-ods/ods9/" class="link-header"target="_blank"><i class="fa-solid fa-users-rays"></i> Ods 17</a>
+        <Img src="./Images/senac-logo-sem-fundo.png"id="logo" alt="logo ODS"></Img>
+        <a href="index.html" class="link-header"><i class="fa-solid fa-house"></i> Início</a>
+        <a href="https://brasil.un.org/pt-br/sdgs/17" class="link-header"target="_blank"><i class="fa-solid fa-fan"></i> Ods 17</a>
         <a href="https://www.canva.com/design/DAGD2U6XBk4/KT9PLAN5uwuIb4uoC2GkvA/view" class="link-header" target="_blank"><i class="fa-solid fa-file"></i> Criação</a>
 
         <button class="button-header">
-          <a href="https://youtube.com/watch?v=c8cfBU7PaWI&si=huhliImg3aIqjWt7" target="_blank"><i class="fa-brands fa-youtube"></i> Sobre</a>
+          <a href="https://youtu.be/O0MapVz0LYc?si=U0UqT4OI29XPRREM" target="_blank"><i class="fa-brands fa-youtube"></i> video</a>
           </button>
       </div>
     </header>
@@ -30,7 +32,7 @@
 
   <main>
      <div id="trailer-container">
-            <iframe width="853" height="480" src="https://www.youtube.com/embed/c8cfBU7PaWI" title="Minha experiência com os ODS9" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+      <iframe width="560" height="315" src="https://www.youtube.com/embed/O0MapVz0LYc?si=-DV6t_FPio8h-Aea" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
       </div>
   </main>
 
@@ -40,7 +42,7 @@
             <div id="resumo">
                 <h1 class="titulo-secundario">Sumário</h1>
                 <p class="description">
-                  No vídeo abordo os principais fatos da ODS17 Industria infraestutura e tecnologia, seus principais aspectos, e ambientalmente corretas para os países em desenvolvimento, em condições favoráveis, inclusive em condições concessionais e preferenciais, espero que gostem!
+                   As parcerias e os meios de <span class="negrito">implementação são cruciais para alcançar os objectivos de desenvolvimento sustentável</span>. Este vídeo discute a importância das parcerias locais e globais, do compartilhamento de recursos e do acesso à tecnologia e à inovação. Enfatiza a necessidade de coordenação e <span class="negrito">coerência nas políticas</span> para promover o desenvolvimento sustentável e reduzir as disparidades económicas entre os países.
                 </p>
             </div>
         </div>
@@ -50,7 +52,7 @@ <h1 class="titulo-secundario">Sumário</h1>
 
 <footer>
   <div class="footer-content">
-    <img id="logo" style="object-fit: contain;" src="./Img/senac-logo.jpg" alt="logo Objetivos de Desenvolvimento Sustentável - ODS">
+    <img id="logo" style="object-fit: contain;" src="./Images/senac-logo-sem-fundo.png" alt="logo Objetivos de Desenvolvimento Sustentável - ODS">
 
     <span class="footer-texto">Todos os direitos reservados © 2024</span>
     <span class="footer-texto">Desenvolvido por: Tauã Felipe Rocha Amaro</span>

diff --git a/index.html b/index.html
@@ -7,66 +7,66 @@
   <!--Links-->
   <link rel="stylesheet" href="./style.css">
   <!--Icone do site(minhatura)-->
-  <link rel="shortcut icon" href="./Img/icone-site.jpg" type="image/x-icon">
+  <link rel="shortcut icon" href="./Images/ods17-redondo.png" type="image/x-icon">
   <!--Font awasome-->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
   <!-- animate css -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
-  <title>Projeto ODS</title>
+  <title> ODS17 - Geral</title>
 </head>
 <body>
     <span id="Home"></span>
     <header>
       <div class="aling-img">
-        <Img src="./Img/senac-logo.jpg"id="logo" alt="logo do senac"></Img>
-        <div class="header-nav">
-        <a href="#Home" class="link-header"target="_blank">Início</a>
-               <a href="https://www.estrategiaods.org.br/os-ods/ods9/" class="link-header"target="_blank">ODS17</a>
-        <a href="https://www.canva.com/design/DAGD2U6XBk4/KT9PLAN5uwuIb4uoC2GkvA/view" class="link-header"target="_blank">Criação</a>
+        <Img src="./Images/senac-logo-sem-fundo.png"id="logo" alt="logo do senac / Serviço Nacional de Aprendizagem do Comércio"></Img>
+        <a href="index.html" class="link-header"><i class="fa-solid fa-house"></i> Início</a>
+        <a href="Video-ods.html" class="link-header"><i class="fa-solid fa-video"></i> Video</a>
+        <a href="https://www.canva.com/design/DAGD2U6XBk4/KT9PLAN5uwuIb4uoC2GkvA/view" class="link-header" target="_blank"><i class="fa-solid fa-file"></i> Criação</a>
 
         <button class="button-header">
-          <a href="https://youtube.com/watch?v=c8cfBU7PaWI&si=huhliImg3aIqjWt7" target="_blank">+ sobre</a>
+          <a href="https://youtu.be/O0MapVz0LYc?si=U0UqT4OI29XPRREM" target="_blank"><i class="fa-brands fa-youtube"></i> Sobre</a>
           </button>
-        </div>
       </div>
     </header>
 
-<div id="banner"></div>
+<div id="banner" alt="Banner da ods 17, saiba mais sobre abaixo:"></div>
 
     <main>
-        <img src="./Img/ico-ODS9.png" class="logo-image">
+        <img src="./Images/ODS17.jpg" class="logo-image" alt="O Objetivo de Desenvolvimento Sustentável 17 trata de parcerias para os objetivos.">
         <section>
             <h1 class="animate__animated animate__backInLeft">ODS 17 e seus aspectos</h1>
-            <h2>Em comum</h2>
+            <h2>Em geral:</h2>
             <p>
-              Visam criar um caminho universal, <br>integrado e transformador para que o mundo se torne um lugar melhor para todos.
+                Visam criar um <span class="negrito">caminho universal</span>, sendo a base para os Objetivos(ODS),<br> com esse caminho em conjunto com a integração e transformação para que o mundo se torne um lugar melhor para todos.
             </p>
             <button class="button-main"> 
-              <a href="./Video-ods.html" target="_blank">Explore <i class="fa-solid fa-plane"></i></a>
-
+              <a href="./Video-ods.html">Explore <i class="fa-solid fa-plane"></i></a>
             </button>
         </section>
     </main>
 
+
    <div id="text-container">
         <div class="content">
             <!-- Div descrição das ods -->
             <div id="resumo">
                 <h1 class="titulo-secundario"> Desfecho </h1>
                 <p class="description">
-                  Promover o desenvolvimento, a transferência, a disseminação e a difusão de tecnologias ambientalmente corretas para os países em desenvolvimento, em condições favoráveis, inclusive em condições concessionais e preferenciais, conforme mutuamente acordado.
+                    Promover o desenvolvimento, a transferência, a disseminação e a <span class="negrito"> difusão de tecnologias ambientalmente corretas para os países </span>em desenvolvimento, em condições favoráveis, inclusive em condições concessionais e preferenciais, conforme mutuamente acordado.
                 </p>
             </div>
         </div>
     </div>
-
+
+<div id="banner3" alt="Imagem de um barco navegando, significa a coperação e o esforço para conseguir mudar as coisas. "></div> 
+
 <footer>
   <div class="footer-content">
-    <img id="logo" style="object-fit: contain;" src="./Img/logoOds.png" alt="logo Objetivos de Desenvolvimento Sustentável - ODS">
+    <img id="logo" style="object-fit: contain" src="./Images/senac-logo-sem-fundo.png" alt="Logo da escola técnica">
 
     <span class="footer-texto">Todos os direitos reservados © 2024</span>
     <span class="footer-texto">Desenvolvido por: Tauã Felipe Rocha Amaro</span>
-    <span class="footer-texto">Turma Técnico de Informática para Internet</span>
+    <span class="footer-texto">Turma Técnico de Informática para Internet - SENAC PR</span>
   </div>
   <!-- Creditos link -->
   <div class="footer-credito">

diff --git a/style.css b/style.css
@@ -6,6 +6,11 @@
   padding: 0;
 }
 
+.negrito{
+  color: #FFC94A;
+  font-weight: bold;
+}
+
 a {
   text-decoration: none;
   color: inherit;
@@ -53,7 +58,7 @@ header {
 }
 
 .button-header {
-  background-color: #dd9f25;
+  background-color: #FFC94A;
   border-radius: 20.5px;
   width: 162px;
   height: 41px;
@@ -64,7 +69,7 @@ header {
 }
 
 .button-header:hover {
-  background-color: #fece43;
+  background-color: #FDDE55;
   border-radius: 3px;
   transition: 1s;
 }
@@ -73,9 +78,20 @@ header {
 #banner {
   width: 100%;
   height: 650px;
-  background-image: url("./Img/banner\ -ODS17.png");
+  background-image: url("./Images/banner -ODS17.png");
   background-size: cover;
-  background-position: 50% 80%;
+  background-position: 15% 85%;
+}
+
+#banner3{
+    width: 100%;
+    height: 300px;
+
+  /*adiciona uma imagem interna ou externa*/
+    background-image: url("./Images/banner-d3.svg");
+    background-size: contain;/*deixa a imagem preencher todo o     container sem cortá-la*/
+    background-position: 50% 80%;
+    background-repeat: no-repeat;
 }
 
 #logo {
@@ -93,7 +109,6 @@ main {
 .logo-image {
   width: 510px;
   height: 510px;
-  background-image: url(./Img/ODS17.jpg);
   margin-left: 125px;
   display: inline-block;
   border-radius: 15px;
@@ -130,7 +145,7 @@ p {
 }
 
 .button-main {
-  background-color: #febd14;
+  background-color: #FFC94A;
   border-radius: 25px;
   border: none;
   width: 250px;
@@ -145,8 +160,8 @@ p {
   text-decoration: none;
 }
 
+  background-color: #FDDE55;
 .button-main:hover {
-  background-color: #fece43;
   border-radius: 2px;
   filter: drop-shadow(0 4px 4px #636161e0);
 }
@@ -189,7 +204,8 @@ p {
 
 /* Rodapé */
 footer {
-  background-color: #144c6c;
+  background: rgba(20,76,108,1);
+  background: linear-gradient(90deg, rgba(20,76,108,1) 3%, rgba(80,133,159,1) 46%, rgba(20,76,108,1) 94%);
   height: 300px;
   bottom: 0;
   width: 100%;
@@ -223,6 +239,7 @@ footer {
 
 .footer-credito a:hover {
   scale: 1.2;
+  color: #FFC94A;
 }
 
 /* Media queries para responsividade */
@@ -377,12 +394,13 @@ footer {
   }
 
   #banner {
-    background-image: url(./Img/banner-resp.png);
+    background-image: url(./Images/ODS17.jpg);
     border: 5px solid white;
     padding: 20px;
     height: 50vh;
     width: auto;
     background-size: cover;
+    border-radius: 15px;
   }
 
   /*pagina do video*/