Transcrição: raio-grande

Fala ai Anderson, tudo bem? Obrigado pelo feedback, acho que faz sentido.

Posso te pedir um favor? Você mesmo pode estar sugerindo uma melhoria na transcrição. Dai no caso de aprovação, a mesma é atualizada para todos.

Espero ter ajudado.

Eu sugiro a seguinte correção destacada entre >>> <<<:

... A variável $raio é a que está sendo usada no outro mixin e que precisa voltar para 0.3em. Então criaremos outra variável para esse novo mixin, que se chamará $raio-grande. As duas variáveis ficarão assim:

$raio: 0.3em; $raio-grande: 50px;

Agora que temos a variável e o mixin, precisamos associá-las ao destaque button com o comando @include:

.destaque button { \... font-size: 1.2em; @include borda-mais-arredondada; @include sombra-padrão; font-weight: bold; }

Voltando ao arquivo .scss, vemos que o código dos mixins está repetitivo.

@mixin borda-arredondada { -webkit-border-radius: $raio; border-radius: $raio; }

@mixin borda-mais-arredondada { -webkit-border-radius: $raio; border-radius: $raio; }

Precisamos alterar a variável $raio para $raio-grande no maxin borda-mais-arredondada:

@mixin borda-arredondada { -webkit-border-radius: $raio; border-radius: $raio; }

@mixin borda-mais-arredondada { -webkit-border-radius: $raio-grande; border-radius: $raio-grande; } Ao conferir o arquivo .css, constatamos que os valores foram atribuídos corretamente: o raio do destaque button está com 50px e o dos demais continua 0.3em. No browser também está tudo com a aparência esperada.

<<<

Se precisarmos fazer botões com um terceiro tipo de borda e criarmos outro mixin para isso ....

Você pode fazer direto na transcrição da aula Anderson.

Clico nos três pontos abaixo o botão "Próxima atividade" e seleciona "Sugerir alteração".

Ai a alteração cai numa fila para a gente dar uma olhada.

Abraços e bons estudos.

Fala Matheus! Fiz conforme sua orientação. Tá lá na fila. Abraços.

Show de bola Anderson, muito obrigado.

Abraços e bons estudos.