README.md

CSS pt-BR Escreva CSS em português brasileiro

Uma extensão para Visual Studio Code que permite escrever propriedades e valores CSS em português Brasileiro.

Motivação

Sou voluntário em um projeto onde tentamos dar as crianças possibilidade de terem um primeiro contato com programação, elas começam com o Scratch em português, depois vão para HTML & CSS e no final para Python. Muitas dessas crianças não tem nem computador em casa. Nos encontramos 1x por semana e percebemos que o inglês é uma das barreiras que pode fazer a criança querer desistir. O objetivo da extensão é diminuir essa barreira, principalmente no começo.

Em nenhum momento defendo que isso deve substituir o aprendizado de inglês, o que desejo é que isso facilite, ao invés de a criança ir no Google Translator digitar “largura” e clicar em traduzir ela pode fazer isso diretamente no editor.

Instalação

Para instalar clique aqui.

Contribuindo

Veja aqui como contribuir

Licença

MIT

Qual a diferença entre o código gerado pela extensão e o código escrito manualmente?

Nenhuma :), a extensão é apenas um autocompletar, por exemplo, você digita largura e ao pressionar enter o que você digitou é alterado para width:, simples assim!

Opções Disponíveis

1. Aligns
2. Animações
3. Backgrounds
4. Bordas
5. Cores
6. Snippets

Aligns

Propriedade	Prefix
align-content	alinhar conteúdo / alinhar-conteúdo
align-items	alinhar itens / alinhar-itens
align-self	alinhar-se

Animações

Propriedade	Prefix
animation-delay	animação atraso / atraso-da-animação
animation-direction	animação direção / direção-da-animação
animation-duration	animação duração / duração-da-animação
animation-fill-mode	animação modo aplicação estilo / modo-de-preenchimento-da-animação
animation-iteration-count	animação contador iterações / contador-de-iteração-da-animação
animation-name	animação nome / nome-da-animação
animation-play-state	animação status / status-da-animação

Backgrounds

Propriedade	Prefix
background-attachment	fundo anexo / fixação-do-fundo
background-blend-mode	fundo modo mistura / modo-de-mistura-do-fundo
background-clip	fundo extender na borda / extensão-do-fundo
background-color	fundo cor / cor-de-fundo
background-image	fundo imagem / imagem-de-fundo
background-origin	fundo origem / ponto-de-origem-do-fundo
background-position	fundo posição / posição-do-fundo
background-repeat	fundo repetir / repetição-do-fundo
background-size	fundo tamanho / tamanho-do-fundo

Bordas

Propriedade	Prefix
border	borda
border-bottom	borda inferior / borda-inferior
border-bottom-color	borda inferior cor / cor-da-borda-inferior
border-bottom-left-radius	borda raio canto inferior esquerdo / raio-do-canto-inferior-esquerdo-da-borda
border-bottom-right-radius	borda raio canto inferior direito / raio-do-canto-inferior-direito-da-borda
border-bottom-style	borda inferior estilo / estilo-da-borda-inferior
border-bottom-width	borda inferior comprimento / comprimento-da-borda-inferior
border-color	borda cor / cor-da-borda
border-left	borda esquerda / borda-esquerda
border-left-color	borda esquerda cor / cor-da-borda-esquerda
border-left-style	borda esquerda estilo / estilo-da-borda-esquerda
border-left-width	borda esquerda comprimento / comprimento-da-borda-esquerda
border-radius	borda raio / raio-da-borda
border-right	borda direita / borda-direita
border-right-color	borda direita cor / cor-da-borda-direita
border-right-style	borda direita estilo / estilo-da-borda-direita
border-right-width	borda direita comprimento / comprimento-da-borda-direita
border-style	borda estilo / estilo-da-borda
border-top	borda superior / borda-superior
border-top-color	borda superior cor / cor-da-borda-superior
border-top-left-radius	borda raio canto superior esquerdo / raio-do-canto-superior-esquerdo-da-borda
border-top-right-radius	borda raio canto superior direito / raio-do-canto-superior-direito-da-borda
border-top-style	borda superior estilo / estilo-da-borda-superior
border-top-width	borda superior comprimento / comprimento-da-borda-superior
border-width	borda comprimento / comprimento-da-borda

Cores

Propriedade	Prefix
aqua	azul-piscina
aquamarine	verde-mar
azure	azul-celeste
biege	bege
black	preto
blue	azul
brown	marrom
chartreuse	verde-limão
chocolate	chocolate
coral	coral
crimson	carmim
cyan	ciano
darkblue	azul-escuro
darkgreen	verde-escuro
darkgrey	cinza-escuro
darkorange	laranja-escuro
fuchsia	fúcsia
gold	ouro
gray	cinza
green	verde
lime	limão
lightgray	cinza-claro
lightblue	azul-claro
lightgreen	verde-claro
maroon	bordô
navy	azul-marinho
olive	verde-oliva
orange	laranja
pink	rosa
purple	roxo
red	vermelho
royalblue	azul-royal
salmon	salmão
silver	prata
snow	neve
teal	azul-petróleo
white	branco
yellow	amarelo

Snippets

Propriedade	Prefix
center	meio
color	cor
display	exibição
font-family	fonte família / família-de-fonte
font-size	fonte tamanho / tamanho-da-fonte
height	altura
letter-spacing	espaço letras / espaçamento-entre-letras
line-height	linha altura / altura-da-linha
margin	margem
padding	espaço interno / espaço-interno
position	posição
text-align	texto alinhar / alinhar-texto
text-shadow	texto sombra / sombreamento-do-texto
transition	transição
width	largura