halisterfernando / product-landing-page Goto Github PK

Página Inicial de um Produto – freeCodeCamp – Product Landing Page

Este projeto requer conhecimento em CSS para ser concluído, JavaScript e demais tecnologias não são obrigatórias. (This project requires CSS to be completed, JavaScript and other tecnologies are not necessary.)

Requisitos: (Requirements)

-1: A página deve conter uma elemento header com a id=”header”. (The product landing page should have a header element with a corresponding id="header".)

-2: Uma imagem dentro do elemento header com a id=”header-image” como uma logo empresarial por exemplo. (An see an image within the header element with a corresponding id="header-img". A company logo would make a good image here.)

-3: Dentro do elemento header, um elemento nav com a id=”nav-bar”. Within the header element I can see a nav element with a corresponding id="nav-bar".

-4: Pelo menos três elementos “clicáveis” dentro do elemento nav, cada um com a class=”nav-link”. (At least three clickable elements inside the nav element, each with the class nav-link.)

-5: Quando clicar em um botão do nav-link no elemento nav, irá mudar para a seção correspondente da página. (When I click a .nav-link button in the nav element, I am taken to the corresponding section of the landing page.)

-6: Um vídeo relacionado ao produto com a id=”video”. (An embedded product video with id="video".)

-7: A página contem um elemento form com a id=”form”. (My landing page has a form element with a corresponding id="form".)

-8: Dentro do elemento form deverá ter um campo input com a id=”email”. (Within the form, there is an input field with id="email" where I can enter an email address.)

-9: O campo do e-mail deve ter um texto em placeholder para deixar claro ao usuário para que serve o campo (The #email input field should have placeholder text to let the user know what the field is for.)

-10: O campo do e-mail usa a validação do HTML5 para confirmar se o texto inserido é um e-mail. (The #email input field uses HTML5 validation to confirm that the entered text is an email address.)

-11: Dentro do elemento form, deverá ter um input do tipo submit com a id=”submit”. (Within the form, there is a submit input with a corresponding id="submit".)

-12: Quando clicar no elemento submit, o e-mail deve ser enviado a página teste: URL: https://www.freecodecamp.com/email-submit (When I click the #submit element, the email is submitted to a static page (use this mock URL: https://www.freecodecamp.com/email-submit).)

-13: A navbar deeve sempre estar no topo da viewport. (The navbar should always be at the top of the viewport.)

-14: A página precisa de pelo menos um media query. (My product landing page should have at least one media query.) #15: A página precisa utilizar ao menos uma vez o CSS flexbox. My product landing page should utilize CSS flexbox at least once.