Шкала CSS не применяется в React.js (Next.js) ⇐ CSS

[Anonymous]

Среда разработки

・ next.js

・ reacｔ

・ typescript < /p>
https: //www.youtube.com/watch?v=ujlpztyjp-m

Я создал инструментальную оболочку, используя видео выше как areference.

Но-Scale: 1; IS не применяется. < /p>
import React, { FunctionComponent } from 'react';

const Index: FunctionComponent = () => {
return (



);
};

export default Index;
< /code>

style.scss
< /blockquote>
div {
&.avatar {
width: 100px;
height: 100px;
border-radius: 50%;
background-size: cover;
background-color: blue;
background-position: center;
position: relative;
}
&.avatar::before,
&.avatar::after {
position: absolute;
content: '';
top: -0.25rem;
left: 50%;
height: 25px;
width: 25px;
background: black;
transform: translateX(-50%) translateY(-100%) scale(var(--scale));
}
&.avatar::before {
content: attr(data-tooltip);
color: white;
text-align: center;
width: max-content;
max-width: 100%;
background: #333;
}
&.avatar:hover {
scale: 1;
}
}


Подробнее здесь: https://stackoverflow.com/questions/647 ... -jsnext-js