Написанная ниже функция @mixin для кнопки отношения с изображением, но она не работает в блоке @media для отзывчивости в Angular компоненте:
@mixin imgRadioEle($imgRad,$imgWd){
.radioImgBlock{
flex-direction: row;
.imgRadio{
display: none;
&:checked{
&+.imgRadioImage{
opacity: 1;
animation: 0.3s aniImg forwards;
}
}
}
.imgRadioImage{
display: flex;
@include setBorderRadius($imgRad);
width: $imgWd;
border: 1px solid rgba($color: $themeFontColor, $alpha: 0.1);
padding: 5px;
opacity: 0.5;
transition: all .15s ease-in-out 0s;
&:hover{
cursor: pointer;
}
}
}
}
Обычный вызов:
@ include imgRadioEle (50%, 40%);
В браузере:
![enter image description here](https://i.stack.imgur.com/x6dRY.png)
Отзывчивый вызов:
@media (max-width: 768px){
@include imgRadioEle(50%,60%);
}
В браузере:
![enter image description here](https://i.stack.imgur.com/hGFlU.png)
Адаптивный код считается. Где проблема?