<style>
/*
Добавление своей иконки в кнопку в Zero Block.
Больше модификаций в Skinweb.ru
*/
.btn-icon {
background-color: #2962FF; /* Фон кнопки */
border-radius: 30px; /* Скругление кнопки */
padding: 10px 25px;
display: inline-flex;
align-items: center;
justify-content: center;
color: white;
}
</style>
<script>
// Анимация иконки при наведении
const enableHover = true; // true - включить анимацию, false - выключить
function addIconToElement(elementClass, iconUrl) {
document.querySelectorAll(`.${elementClass}`).forEach(element => {
const icon = new Image();
icon.src = iconUrl;
icon.style.width = icon.style.height = '20px';
icon.style.transition = 'transform 0.3s ease';
element.prepend(icon);
if (enableHover) {
element.onmouseenter = () => icon.style.transform = 'translateX(5px)';
element.onmouseleave = () => icon.style.transform = 'translateX(0)';
}
});
}
// Тут вставьте ссылку на иконку
addIconToElement('btn-icon', 'https://i.postimg.cc/nh7Hzzvb/icons8-60-1.png');
</script>