challenge-landing-page/index.html

<!DOCTYPE html>
<html lang="pt-br">

<head>
    <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=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">

    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style/style.css">
    <title>Challenge M3Academy</title>
</head>

<body>
    <header class="header-landingpage">
        <figure class="header-logo-father">
            <img class="header-logo" src="assets/svg/Logo-M3Academy 1.svg" alt="logo da M3 Academy">
        </figure>
    </header>
    <main class="main-landingpage">
        <!-- AREA DO BANNER PRINCIPAL -->
        <div class="container-banner-main">
            <figure class="container-banner-desktop">
                <img class="banner-img banner-img-desktop" src="assets/banner/banner-header.png" alt="Notebook aberto com codigos HTML e CSS. Ao lado contem um celular, uma xicara branca, um fone e uma planta dentro de uma vaso. ">
            </figure>
            <figure class="container-banner-mobile">
                <img class="banner-img banner-img-mobile" src="assets/banner/banner-header-mobile.png" alt="Notebook aberto com codigos HTML e CSS.">
            </figure>
        </div>
        <!-- CONTAINER ABAIX DO BANNER -->
        <div class="container-midle">
            <section class="container-midle-flex">
                <h2 class="container-midle-subtitle">Lorem ipsum</h2>
                <h1 class="container-midle-title">Dolor sit amet</h1>
                <p class="container-midle-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>
                
                    <img src="assets/img/midle-computer.png" alt="Computadores alinhados. Um em cuma e dois embaixo, ligados por setas." class="container-midle-img" />
                <!-- <div class="container-midle-card">

                </div> -->
            </section>
        </div>
    </main>
</body>

</html>
feat: cria estrutura de diretorios e arquivos 2022-10-11 19:48:02 +00:00			`<!DOCTYPE html>`
style: configura banner versao movel e desktop 2022-10-11 20:43:34 +00:00			`<html lang="pt-br">`
feat: cria estrutura de diretorios e arquivos 2022-10-11 19:48:02 +00:00
			`<head>`
			`<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=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">`

			`<meta charset="UTF-8">`
			`<meta http-equiv="X-UA-Compatible" content="IE=edge">`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0">`
style: configura banner versao movel e desktop 2022-10-11 20:43:34 +00:00			`<link rel="stylesheet" href="style/style.css">`
feat: cria estrutura de diretorios e arquivos 2022-10-11 19:48:02 +00:00			`<title>Challenge M3Academy</title>`
			`</head>`

			`<body>`
style: configura banner versao movel e desktop 2022-10-11 20:43:34 +00:00			`<header class="header-landingpage">`
			`<figure class="header-logo-father">`
			`<img class="header-logo" src="assets/svg/Logo-M3Academy 1.svg" alt="logo da M3 Academy">`
			`</figure>`
			`</header>`
			`<main class="main-landingpage">`
			`<!-- AREA DO BANNER PRINCIPAL -->`
			`<div class="container-banner-main">`
			`<figure class="container-banner-desktop">`
			`<img class="banner-img banner-img-desktop" src="assets/banner/banner-header.png" alt="Notebook aberto com codigos HTML e CSS. Ao lado contem um celular, uma xicara branca, um fone e uma planta dentro de uma vaso. ">`
			`</figure>`
			`<figure class="container-banner-mobile">`
			`<img class="banner-img banner-img-mobile" src="assets/banner/banner-header-mobile.png" alt="Notebook aberto com codigos HTML e CSS.">`
			`</figure>`
			`</div>`
feat: Cria regiao da pagina com paragrafo e imagem de tres computadores 2022-10-11 23:48:52 +00:00			`<!-- CONTAINER ABAIX DO BANNER -->`
			`<div class="container-midle">`
			`<section class="container-midle-flex">`
			`<h2 class="container-midle-subtitle">Lorem ipsum</h2>`
			`<h1 class="container-midle-title">Dolor sit amet</h1>`
			`<p class="container-midle-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>`
feat: corrige alinhamento e tamanho de imagem dos do meio na versao movel imagem dos tres computadores juntos na versão movel estava quebrando 2022-10-12 17:39:49 +00:00
			`<img src="assets/img/midle-computer.png" alt="Computadores alinhados. Um em cuma e dois embaixo, ligados por setas." class="container-midle-img" />`
feat: Cria regiao da pagina com paragrafo e imagem de tres computadores 2022-10-11 23:48:52 +00:00			`<!-- <div class="container-midle-card">`

			`</div> -->`
			`</section>`
			`</div>`
style: configura banner versao movel e desktop 2022-10-11 20:43:34 +00:00			`</main>`
feat: cria estrutura de diretorios e arquivos 2022-10-11 19:48:02 +00:00			`</body>`

			`</html>`