Скрипт для замены иконки лайка (сердечка) на стрелку
目前為
// ==UserScript==
// @name DTF return like
// @version 0.2
// @description Скрипт для замены иконки лайка (сердечка) на стрелку
// @author geuarg1y
// @match *://dtf.ru/*
// @grant none
// @license MIT
// @namespace https://greasyfork.org/users/998190
// ==/UserScript==
(function () {
injectStyles();
void swapIcons();
})();
async function swapIcons() {
const like = await getDomElementAsync('#v_like'); // Ждем, когда появится спрайт с svg иконками на странице и получаем икоку лайка
const likeCopy = createIconCopy('v_dislike', 'v_like'); // Делаем копию дизлайка, но с id лайка
like.replaceWith(likeCopy); // Заменяем сердечко на иконку дизлайка (стрелку)
const likeActive = document.querySelector('#v_like_active');
const likeActiveCopy = createIconCopy('v_dislike_active', 'v_like_active');
likeActive.replaceWith(likeActiveCopy);
}
function getDomElementAsync(selector, timerLimit = 10000) {
return new Promise((resolve, reject) => {
try {
setTimeout(
() => reject(`Время ожидания DOM элемента истекло (${timerLimit / 1000}s)`),
timerLimit
);
let timerId;
const tick = () => {
const element = document.querySelector(selector);
if (element) {
clearTimeout(timerId);
resolve(element);
} else {
timerId = setTimeout(tick, 100);
}
};
tick();
} catch (e) {
reject(e);
}
});
}
function createIconCopy(fromIconId, toIconId) {
const source = document.querySelector(`#${fromIconId}`);
const copy = source.cloneNode(true);
copy.setAttribute('id', toIconId);
return copy;
}
function injectStyles() {
const styles = `
/* Лайки у постов */
.content-footer__item:first-child {
order: 1;
margin-left: auto;
margin-right: 7px !important;
}
.content-footer__item:last-child {
order: 2;
margin-left: 9px;
}
/* Лайки у комментов */
.comment .like-button.like-button--action-like {
order: -2;
margin-left: auto;
margin-right: 9px;
z-index: 1;
}
.comment .like-button.like-button--action-dislike {
order: -1;
margin-left: 0;
}
/* Кнопка раскрытия комментов */
.comment__inline-action {
order: 1;
width: 100%;
}
/* Цвета иконок лайка/дизлайка */
.like-button.like-button--action-like {
--like-color-text-hover: #2ea83a;
--like-color-background-hover: #2ea83a;
--like-color-active: #2ea83a;
}
.like-button.like-button--action-dislike {
--like-color-text-hover: #cf4c59;
--like-color-background-hover: #cf4c59;
--like-color-active: #cf4c59;
}
#v_dislike_active path {
fill: #cf4c59;
}
#v_like_active path {
fill: #2ea83a;
}
/* Отключаем анимацию */
.like-button--action-like .like-button__icon,
.like-button--action-dislike .like-button__icon {
visibility: visible !important;
}
.like-button__lottie {
display: none;
}
/* Переворачиваем иконку лайка */
.like-button--action-like .like-button__icon {
transform: rotate(180deg);
}
`;
document.head.insertAdjacentHTML("beforeend", `<style type="text/css" id="dtfChangeIconStyles">${styles}</style>`)
}