luizfelipe9627/challenge-landing-page-luiz-felipe
1
0
Fork 0
forked from M3-Academy/challenge-landing-page
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(home): adicionado a tag semantica main.

Browse Source
This commit is contained in:
Luiz Felipe Silva 2022-10-14 13:41:58 -03:00
parent 1e3144f879
commit d13a5cec1e
1 changed files with 106 additions and 104 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

196
index.html
View File

@ -19,30 +19,82 @@
</a>
</header>
<section class="section1">
<img class="fundo-desktop" src="./src/assets/img/fundo-desktop.png" alt="Notebook na mesa">
<img class="fundo-mobile" src="./src/assets/img/fundo-mobile.png" alt="Notebook na mesa">
</section>
<main>
<section class="section1">
<img class="fundo-desktop" src="./src/assets/img/fundo-desktop.png" alt="Notebook na mesa">
<img class="fundo-mobile" src="./src/assets/img/fundo-mobile.png" alt="Notebook na mesa">
</section>
<section class="section2">
<div class="container">
<div class="container-content">
<h2 class="text-subtitle">Lorem ipsum</h2>
<h1 class="text-title">dolor sit amet</h1>
<section class="section2">
<div class="container">
<div class="container-content">
<h2 class="text-subtitle">Lorem ipsum</h2>
<h1 class="text-title">dolor sit amet</h1>
<p class="text-paragraph">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. Nulla suscipit magna dui.
</p>
<p class="text-paragraph">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. Nulla suscipit magna dui.
</p>
<figure class="img-computers">
<img src="./src/assets/svg/computadores.svg" alt="Computadores">
<figure class="img-computers">
<img src="./src/assets/svg/computadores.svg" alt="Computadores">
</figure>
</div>
<div class="container-cards">
<div class="card">
<figure>
<img src="./src/assets/svg/shopping.svg" alt="Loja">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
<div class="card">
<figure>
<img src="./src/assets/svg/bolsa.svg" alt="Bolsa">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
<div class="card">
<figure>
<img src="./src/assets/svg/moeda.svg" alt="Moeda">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
</div>
</div>
</section>
<section class="section3">
<div class="fundo">
<figure class="notebook1">
<img src="./src/assets/img/notebook1.png" alt="Notebook 1">
</figure>
<figure class="notebook2">
<img src="./src/assets/img/notebook2.png" alt="Notebook 2">
</figure>
<figure class="notebook3">
<img src="./src/assets/img/notebook3.png" alt="Notebook 3">
</figure>
</div>
</section>
<section class="section4">
<div class="container-cards">
<div class="card">
<figure>
<img src="./src/assets/svg/shopping.svg" alt="Loja">
<img src="./src/assets/svg/dinheiro.svg" alt="Dinheiro">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
@ -62,7 +114,17 @@
<div class="card">
<figure>
<img src="./src/assets/svg/moeda.svg" alt="Moeda">
<img src="./src/assets/svg/compra.svg" alt="Compras">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
<div class="card">
<figure>
<img src="./src/assets/svg/celular.svg" alt="Celular">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
@ -70,95 +132,35 @@
</figure>
</div>
</div>
</div>
</section>
<section class="section3">
<div class="fundo">
<figure class="notebook1">
<img src="./src/assets/img/notebook1.png" alt="Notebook 1">
<div class="container-content2">
<div class="text-content-desktop">
<h1 class="text-title2">Lorem ipsum dolor sit amet</h1>
<p class="text-paragraph2">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus interdum. In eget tincidunt ipsum.
Quisque a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur venenatis felis vitae sagittis venenatis.
Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.
</p>
</div>
</div>
<figure>
<img src="./src/assets/img/fundo-desktop2.png" class="fundo-desktop2" alt="Programação">
<img src="./src/assets/img/fundo-mobile2.png" class="fundo-mobile2" alt="Programação">
</figure>
<figure class="notebook2">
<img src="./src/assets/img/notebook2.png" alt="Notebook 2">
</figure>
<figure class="notebook3">
<img src="./src/assets/img/notebook3.png" alt="Notebook 3">
</figure>
</div>
</section>
<section class="section4">
<div class="container-cards">
<div class="card">
<figure>
<img src="./src/assets/svg/dinheiro.svg" alt="Dinheiro">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
<div class="card">
<figure>
<img src="./src/assets/svg/bolsa.svg" alt="Bolsa">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
<div class="card">
<figure>
<img src="./src/assets/svg/compra.svg" alt="Compras">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
<div class="card">
<figure>
<img src="./src/assets/svg/celular.svg" alt="Celular">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
</div>
<div class="container-content2">
<div class="text-content-desktop">
<div class="text-content-mobile">
<h1 class="text-title2">Lorem ipsum dolor sit amet</h1>
<p class="text-paragraph2">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus interdum. In eget tincidunt ipsum.
Quisque a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur venenatis felis vitae sagittis venenatis.
Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus interdum. In eget tincidunt ipsum.
Quisque a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur venenatis felis vitae sagittis venenatis.
Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.
</p>
</div>
</div>
<figure>
<img src="./src/assets/img/fundo-desktop2.png" class="fundo-desktop2" alt="Programação">
<img src="./src/assets/img/fundo-mobile2.png" class="fundo-mobile2" alt="Programação">
</figure>
<div class="text-content-mobile">
<h1 class="text-title2">Lorem ipsum dolor sit amet</h1>
<p class="text-paragraph2">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus interdum. In eget tincidunt ipsum.
Quisque a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur venenatis felis vitae sagittis venenatis.
Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.
</p>
</div>
</section>
</section>
</main>
<footer>
<div class="container-icons">