https://github.com/daniel-portela/responsive-navigation-bar

Barra de navegação responsiva com pesquisa e login usando HTML5, CSS3, SCSS e JavaScript.
https://github.com/daniel-portela/responsive-navigation-bar

css3 html5 javascript responsive scss

Last synced: 20 days ago
JSON representation

Barra de navegação responsiva com pesquisa e login usando HTML5, CSS3, SCSS e JavaScript.

• Host: GitHub
• URL: https://github.com/daniel-portela/responsive-navigation-bar
• Owner: daniel-portela
• License: other
• Created: 2024-01-07T13:43:04.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2024-04-13T17:30:01.000Z (10 months ago)
• Last Synced: 2024-11-22T03:15:09.113Z (3 months ago)
• Topics: css3, html5, javascript, responsive, scss
• Language: SCSS
• Homepage: https://barradenavegacaoq.netlify.app
• Size: 207 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


Projeto - Barra de navegação responsiva com pesquisa e login

Barra de navegação responsiva usando HTML, CSS e JavaScript.

Contém uma caixa de pesquisa e um formulário de login e foi 

desenvolvido primeiro com a metodologia desktop, depois para mobile.

Compatível com todos os dispositivos móveis e com uma interface de usuário bonita e agradável.



![preview-navbar](https://github.com/daniel-portela/responsive-navigation-bar/assets/110783805/618d31ba-bbe0-4789-977c-2e94bbbb9fde)

![preview-search](https://github.com/daniel-portela/responsive-navigation-bar/assets/110783805/427e6cb1-c760-4118-bbe9-05eb0fd47a89)

![preview-login](https://github.com/daniel-portela/responsive-navigation-bar/assets/110783805/8cb6521e-93bf-41c6-bce2-04d2aa4011e1)

![navegação responsiva](https://github.com/daniel-portela/responsive-navigation-bar/assets/110783805/db185689-1c7b-48f2-b3ed-e717b85d0d45)

👨🏼‍💻 Tecnologias utilizadas:

![HTML](https://img.shields.io/badge/-HTML-0D1117?style=for-the-badge&logo=html5&labelColor=0D1117) 

![CSS](https://img.shields.io/badge/-CSS-0D1117?style=for-the-badge&logo=CSS3&logoColor=blue&labelColor=0D1117) 

![JavaScript](https://img.shields.io/badge/-javascript-0D1117?style=for-the-badge&logo=javascript&logoColor=yellow&labelColor=0D1117) 

![SCSS](https://img.shields.io/badge/-SCSS-0D1117?style=for-the-badge&logo=sass&logoColor=purple&labelColor=0D1117) 


🛠️ Recursos funcionalidades:

- A barra de navegação se adapta ao tamanho da tela, fornecendo uma experiência consistente em dispositivos de diferentes tamanhos.

- Os usuários podem realizar pesquisas clicando no ícone de busca, o que revela um campo de pesquisa.

- Há a opção de fazer login, onde os usuários podem inserir seu email e senha em um formulário simples.



Como utilizar:

Pré-requisitos:

Antes de começar, certifique-se de atender aos seguintes requisitos:


[Git](https://git-scm.com/downloads "Download Git") deve ser instalado em seu sistema operacional.

Execute localmente

Para executar o projeto localmente, execute este comando em seu git bash:

Linux e macOS:

```bash

git clone https://github.com/daniel-portela/responsive-navigation-bar.git

```

Windows:

```bash

git clone https://github.com/daniel-portela/responsive-navigation-bar.git

```

Depois de clonar o repositório, acesse o projeto com o seguinte comando:

```bash

cd nome-do-repositorio

```

```bash

Você pode abri-lo no VS Code digitando "code ."

```

Explore as diferentes funcionalidades da barra de navegação, incluindo navegação responsiva, pesquisa e login.

Contribuições são bem-vindas! Se você deseja melhorar este projeto de alguma forma, sinta-se à vontade para abrir uma issue ou enviar um pull request.

Autor:

Este projeto foi desenvolvido por Daniel Portela e é distribuído sob a [licença MIT]. Para mais informações, consulte o arquivo [LICENSE](LICENSE).

Contato:

Se você tiver alguma dúvida, sugestão ou interesse em colaborar, não hesite em me contatar.

Email:  [email protected]