CSS dinâmico: viva a diversidade!

Objetivos / Aims

1) Usar setProperty() e criação de variáveis para mudar a cor do background da página dinamicamente e mostrar um vídeo diferente para cada cor;

Use setProperty() to create variables to change the pages's background color and show a video:

2) Mostrar um modal com a definição de cada letra da sigla LGBTQIAP+ e, ao clicar em qualquer lugar da tela, fazer o modal desaparecer e mostrar o conteúdo desejado.

Show a modal that displays a definition for each letter of the acronym LGBTQIAP+ and, by clicking anywhere on the screen, make the modal disappear and to show the desired content.

Problemas que consegui resolver / Problems I was able to solve

• Tirar a borda default do iframe e substituí-la por uma de neon.

• Remove the default iframe border and substitute it for a neon one.

• Estilizar cores dos backgrounds adicionando "ba" aos rgba de modo que não ficassem tão vibrantes e cansassem a visão.

• Styling the background colors by adding "ba" to the rgba so that they weren't so vibrating and tiring for the eye sight.

Algumas lições que aprendi / Some lessons I learned

• Se você digitar as iniciais de uma propriedade ou método no JavaScript, um menu aparece com opções, ou ao se clicar "Enter" você muito provavelmente terá selecionado o que queria;

• If you type the initials of a property or method on JavaScript, a menu will be displayed with options, or when you click "Enter" key it is very likely you will have selected what you wanted;

• Fazer com que um vídeo do tipo "shorts" do youtube pudesse funcionar na página.

• Making a Youtube short work on a page.

Tecnologias / Technologies

• CSS
• HTML
• JavaScript

Links

• Cubos Academy
• How to make a neon border - Stack Overflow
• Tutorial para inserir vídeos do Youtube - Embeded Youtube videos tutorial
• Efeito piscar do neon do H1 - H1's flickering neon effect:
• Bandeirinha que vai na aba do navegador / Flag icon that goes in browser's tab:
• Criar e adicionar um favicon para a aba do navegador: Creating and adding a favicon to browser's tab:
• Converter um shorts do Youtube em um embeded usando aba anônima / Convert a Youtube shorts into an embeded one with incognito tab:

Autor / Author

Foto	Nome	GitHub	Likedin	E-mail
	Romulo Craveiro de Sousa Tartaruga	Romulo Craveiro	Linkedin	romulocraveiro@gmail.com