0

Atualização do Github Colors

#HTML #JavaScript #CSS
Josélio Júnior
Josélio Júnior

Olá pessoal! Espero que estejam bem!


Meu projeto do Github Colors sofreu alterações na questão organizacional, onde fui quebrando melhor o código e colocando cada um com uma responsabilidade melhor definida.


Link do repositório:

github.com/joseliojunior/github-colors/

Link da postagem:

joseliojunior.github.io/github-colors/


Apesar de ser JavaScript sabor baunilha 😅 (puro), ainda sim tentei lembrar do conceito de componentização do React e aplicá-lo da melhor forma possível.


Esteticamente não foi modificado, mas por ser um projeto que depende dos dados do arquivo "languages.yml" do Github ele ganhou mais de uma centena de novas cores. No momento com 474 cores de linguagens de programação, marcação, dados, entre outras.


Ah sim, clicando em cada linguagem você consegue ver o nome da linguagem sua cor em hexadecimal e em rgb e hsl graças ao meu outro projeto (Kolorz.js) que converte a cor hexadecimal para esses outros dois sistemas.


Espero que gostem desse projeto caixa de lápis de cor. 🌟

Qualquer sugestão podem me mandar por qualquer rede social lá no readme do Github. 💬


Bons estudos e vamos decolar!!! 🚀

0
40

Comentários (5)

1
Wellington Santos

Wellington Santos

12/08/2021 10:11

Entendo, como eu disse são apenas sugestões, nada muito impactante. O projeto está legal continue assim.

0
Josélio Júnior

Josélio Júnior

05/08/2021 14:20

Muito obrigado Wellington!!! 🤩

Sim, sim! Assim que entender melhor como criar uma API direitinho já vou querer fazer. 🤩


No momento você pode fazer um "fork" do meu projeto e usar o "GithubColors.js" que está sobre a licença MIT.

github.com/joseliojunior/github-colors

A constante exportada por esse arquivo é uma matriz com o nome da linguagem e a cor em hexadecimal, caso não haja conexão retorna "falso".


A cor do foreground é um cálculo da cor original aumentando ou abaixando a luminosidade. É possível vê-la (código hexadecimal) utilizando o inspetor de elementos em "Styles".


Vou trabalhar sim no botão de copiar, também estou querendo ele, pois vez ou outra uso este projeto, mas ele é mais desafiador de colocar do que parece. 😅

0
Josélio Júnior

Josélio Júnior

05/08/2021 13:52

Valeu Leonardo!!! 🤩

1
Wellington Santos

Wellington Santos

05/08/2021 12:51

Legal, pena não ser uma api, se fosse eu iria usar no meu app do projeto do bootcamp do inter.

Vou dar umas sugestões, não é nada importante, seu projeto já está bom,

  • Podia mostrar a cor de foreground também, a cor sendo usada no texto.
  • Quando você vai selecionar o texto, ao soltar o mouse, a área onde mostra os valores da cor, se "fecha", podia talvez ter um botão de copiar a cor para área de transferência.
1
Leonardo Sousa

Leonardo Sousa

05/08/2021 11:17

Que projeto maneiro parbéns!!!

Sou um estudante de Nutrição que mergulhou no mundo da programação em março de 2020.               https://github.com/joseliojunior

Brasil