Eu tentei reproduzir sozinho o exercício proposto, quase acertei (fico feliz por isso kkkk), porém, eu "travei" quando o console do Chrome apresentou erro no meu CSS e também com a resposta do exercício.
"transform: translate(calc(.707 (3.5em - 100%) + 100%), calc(-.707 3.5em)) rotate(45deg);" O Chrome me alerta que isto está errado, recebo a mensagem: "Invalid Property Value".
No meu Visual Studio Code está assim:
.banner-twitter {
position: absolute;
top: 0;
right: 0;
line-height: 1;
/* largura = 14em */
/* altura = 3.5em */
/* tx = .707 * h - .707 * w + w */
/* ty = -.707 * h */
transform: translate (calc(.0.707 * (3.5em - 100%) + 100%), calc(-.707 * 3.5em)) rotate(45deg);
transform-origin: 0 0;
width: 14em;
padding: 1em 0;
box-sizing: border-box;
text-align: center;
text-decoration: none;
background-color: #3C1D3D;
color: white;
border: .25em solid black;
font-size: 1.2em;
font-family: "Open Sans Condensed", sans-serif;
}
Pode me indicar onde eu errei, por favor?
Obrigado.