diff --git a/seed/challenges/01-front-end-development-certification/html5-and-css.json b/seed/challenges/01-front-end-development-certification/html5-and-css.json
index d05abe5b2fd..0ce9216e7a9 100644
--- a/seed/challenges/01-front-end-development-certification/html5-and-css.json
+++ b/seed/challenges/01-front-end-development-certification/html5-and-css.json
@@ -56,7 +56,7 @@
"Note que a única diferença entre as tags de abertura e fechamento é que as de fechamento possuem uma barra (/) depois do sinal de abertura (<).",
"Cada desafio possui testes que você pode executar a qualquer momento ao clicar no botão \"Executar testes\". Quando você conseguir passar em todos os testes, poderá avançar para o próximo desafio.",
"Para passar nos testes deste desafio, mude o texto do elemento h1
para que diga \"Hello World\" no lugar de \"Hello\". Depois, clique no botão \"Executar testes\"."
- ]
+ ],
"type": "waypoint"
},
{
@@ -104,7 +104,7 @@
"Este elemento indica ao navegador a forma de mostrar o texto que contém.",
"Os elementos h2
são ligeiramente menores que os elementos h1
. Há também os elementos h3
, h4
, h5
e h6
.",
"Adicione uma tag h2
que diga \"CatPhotoApp\" para criar um segundo elemento
HTML abaixo de seu elemento h1
chamado \"Hello World\"."
- ]
+ ],
"type": "waypoint"
},
{
@@ -144,7 +144,7 @@
"Você pode criar um elemento p
assim:",
"<p>Sou uma tag p!</p>
",
"Crie um elemento p
abaixo de seu elemento h2
, e dê a ele o texto \"Hello Paragraph\"."
- ]
+ ],
"type": "waypoint"
},
{
@@ -192,7 +192,7 @@
"Comentar também é um jeito conveniente de deixar seu código inativo sem precisar apagá-lo por completo.",
"Você pode iniciar um comentário com <!--
e terminar seu comentário com -->
.",
"Remova o comentário dos elementos h1
, h2
e p
."
- ]
+ ],
"type": "waypoint"
},
{
@@ -236,7 +236,7 @@
"Lembre-se que para iniciar um comentário você precisa utilizar <!--
, e para terminar um comentário é necessário usar -->
.",
"Aqui, você deverá terminar o comentário antes que seu elemento h2
inicie.",
"Comente o elemento h1
e o elemento p
, e deixe o elemento h2
sem nenhum comentário."
- ]
+ ],
"type": "waypoint"
},
{
@@ -280,7 +280,7 @@
"O texto Lorem Ipsum tem sido utilizado como texto de espaço reservado por compositores desde o século 16, e esta tradição continua na web.",
"Bem, 5 séculos é um tempo longo o bastante. Já que estamos desenvolvendo um aplicativo sobre fotos de gatos (CatPhotoApp), vamos usar algo chamado Kitty Ipsum
.",
"Substitua o texto dentro do seu elemento p
pelas primeiras palavras deste texto Kitty Ipsum: Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
"
- ]
+ ],
"type": "waypoint"
},
{
@@ -321,7 +321,7 @@
"Nosso celular não possui muito espaço vertical.",
"Vamos eliminar os elementos desnecessários para começar a construir nosso CatPhotoApp.",
"Apague o elemento h1
para simplificar o nosso espaço."
- ]
+ ],
"type": "waypoint"
},
{
@@ -367,7 +367,7 @@
"Você pode mudar a cor do texto de seu elemento h2
para azul assim:",
"<h2 style=\"color: blue\">CatPhotoApp</h2>
",
"Mude o estilo do elemento h2
para que seu texto fique com a cor vermelha."
- ]
+ ],
"type": "waypoint"
},
{
@@ -432,7 +432,7 @@
"</style>
",
"Observe que é importante utilizar as chaves de abertura e de fechamento ({
e }
) ao redor do estilo de cada elemento. Também é necessário que o estilo de seu elemento esteja entre as tags de abertura e fechamento. Por fim, não se esqueça de adicionar o ponto-e-vírgula no final de cada um dos estilos de seu elemento.",
"Apague o atributo style
de seu elemento h2
e então crie um elemento style
CSS. Adicione o CSS necessário para fazer com que todos os elementos h2
tenham a cor azul."
- ]
+ ],
"type": "waypoint"
},
{
@@ -509,7 +509,7 @@
"Note que em seu elemento style
CSS, as classes devem começar com um ponto. Já nos elementos HTML, as declarações de classes não devem começar com o ponto.",
"Ao invés de criar um novo elemento style
, tente eliminar a declaração de estilo de h2
dos elementos de estilo existentes, e troque ela pela declaração de classe .red-text
.",
"Crie uma classe CSS chamada red-text
e então a aplique em seu elemento h2
."
- ]
+ ],
"type": "waypoint"
},
{
@@ -568,7 +568,7 @@
"Contudo, não se esqueça que as declarações de classes em elementos não utilizam ponto, assim:",
"<h2 class=\"blue-text\">CatPhotoApp<h2>
",
"Adicione a classe red-text
aos seus elementos h2
e p
."
- ]
+ ],
"type": "waypoint"
},
{
@@ -579,7 +579,8 @@
"
h1 {", "Create a second
font-size: 30px;
}
p
element with the following kitty ipsum text: Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
",
"Inside the same <style>
tag that contains your red-text
class, create an entry for p
elements and set the font-size
to 16 pixels (16px
).",
- "Notep
element."
],
"challengeSeed": [
"