Крутая анимация на кнопке в тильде, используя Zero-Block #shorts

В этом видео я покажу как сделать анимацию на кнопке при наведении. Для этой анимации нужно будет вставить класс arrow-btn в кнопку и добавить скрипт в блок t123

СКРИПТ В КОММЕНТАРИЯХ
_______________________________________
Автор скрипта
_______________________________________
Начать обучение
_______________________________________
_______________________________________
✅Поделись видео с друзьями
✅Подпишись на канал и поставь🔔
_______________________________________

[ДинараТАЛЖАН-рю]

Добрый день не могу сделать музуку причину не могу найти?может помочь?

[Buddilov]

ПОДАРКИ 🎁🎁🎁
Заходи в мой инстаграм, подписывайся и напиши мне слово "ФАЙЛ". После чего я вышлю тебе бесплатный пдф файл в котором собранно 15 способов по поиску заказов в веб-дизайне

Моя инста:

[Buddilov]

СКРИПТ


<!--кнопка со стрелкой-->

<style>
.arrow-btn .tn-atom:before {
content: '';
width: 60px;
height: 60px;
position: relative;
display: inline-block;
vertical-align: middle;
margin-right: 10px;
/*заменяем в url изображения иконки на свою*/
background-position: center;
background-repeat: no-repeat;
transition: all 0.3s ease-in-out;
}
.arrow-btn .tn-atom:after {
content: '';
width: 60px;
height: 60px;
/*устанавливаем цвет фона под иконкой*/
background-color: #232323;
position: absolute;
display: inline-block;
vertical-align: middle;
margin-right: 8px;
left:0;
z-index: -1;
transition: all 0.3s ease-in-out;
border-radius: 100px;
}
.arrow-btn .tn-atom {
text-align:left;
padding-right: 30px;

}
.arrow-btn:hover .tn-atom:after {
width: 100% !important;
}
.arrow-btn:hover .tn-atom:before {
padding-left: 20px;
margin-right: -10px;
}

.arrow-btn {
width: fit-content !important;
}
</style>