Calculadora de Gorjetetas (Tip calculator app)

Design preview for the Tip calculator app coding challenge

Este é um projeto de uma calculadora de gorjeta desenvolvida com base no design fornecido pelo Frontend Mentor. A calculadora permite que o usuário calcule a gorjeta por pessoa e o total de gastos por pessoa, com base em uma porcentagem escolhida pelo usuário.

✔️ Funcionalidades

  • Calcula a gorjeta por pessoa com base na porcentagem escolhida.
  • Calcula o total somado de gastos por pessoa com base na porcentagem escolhida.
  • Opção para selecionar a porcentagem de gorjeta através de botões pré-definidos.
  • Opção para digitar uma porcentagem personalizada através do botão "Custom".
  • Exibe alertas de erro de acordo com o design do Frontend Mentor.
  • Impede a inserção de valores zero nos campos de entrada.
  • Impede a inserção de letras nos campos de entrada.

⚠️ Melhorias Futuras

Como melhoria futura, pretendo realizar as seguintes alterações:

  • Corrigir a função de verificação de letras no botão "Custom", para que ela alcance 100% de seu escopo.
  • Adicionar um modo escuro (dark mode) ao estilo da calculadora, permitindo que o usuário escolha a paleta de cores que deseja utilizar no site.

🔨Tecnologias Utilizadas

  • HTML

  • CSS

  • JavaScript

  • JavaScript

📁 Acesso ao projeto:

O projeto pode ser acessado no link que se encontra na seção "About" ou "Sobre".

🛠️ Abrir e rodar o projeto

  • Baixe o projeto em Zip ou clone o repositório, conforme disponível na aba <> Code.
  • Após baixar o projeto, você pode abri-lo com seu editor de código preferido (por exemplo, VS Code ou Sublime Text).
  • Caso o projeto seja baixado via zip, é necessário extraí-lo antes de procurá-lo.
  • Em seu editor de código selecione "open folder" ou "abrir pasta" e busque a pasta do projeto e a selecione.
  • O editor de código abrirá ao lado a pasta com os documentos do projeto, de modo que você poderá acessá-los.
  • (⚠️Opcional⚠️) Se preferir, instale a extensão "Live Server" disponível no VSCode.

🧩 Como Contribuir

Para contribuir com este projeto, siga as etapas abaixo:

  • Clone o repositório com fork em seu github;
  • Abra o projeto com Git Bash e siga as instruções da seção anterior.
  • Faça as alterações e melhorias necessárias.
  • Confira suas alterações utilizando a extensão "Live Server" no arquivo index.html ou dê dois cliques nesse arquivo em sua origem;
  • Posteriormente, crie um pull request, descrevendo as alterações que você fez e por que elas devem ser mescladas.

➡ Créditos

Frontend Mentor - Forneceu o desafio e a inspiração de design. dictionaryapi.dev - API utilizada para buscar definições de palavras e informações relacionadas.

➡ Agradecimentos

Gostaria de expressar minha gratidão à Frontend Mentor por criar este projeto desafiador e fornecer uma plataforma para aprendizado e melhoria contínuos.

Gabriella Borges 🚀