Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Mastodon で表示されるボタンを misskey っぽいところからの投稿のみ🍮にします。
// ==UserScript==
// @name [Mastodon] This is not ⭐, but 🍮!
// @namespace hen.acho.co
// @include https://*/web/*
// @version 1.180415
// @description replace misskey's star button with pudding
// @downloadURL https://gist.github.com/pacochi/7a529cc0a344ba90e7b764f944e037e0/raw/mastodon_misskey_pudding.user.js
// @run-at document-idle
// @grant none
// ==/UserScript==
(() => {
'use strict';
const body = document.querySelector('body.app-body #mastodon');
if (!body) return;
const putPudding = node => {
if (!node.querySelector('a[class$="status__display-name"][href^="https://misskey."]'))
return;
if (node.parentNode.classList.contains('detailed-status__wrapper'))
return node.childNodes.forEach(putPudding);
if (node.className == 'column')
return node.querySelector('.item-list, .detailed-status__wrapper > div').childNodes.forEach(putPudding);
const star = node.querySelector('.icon-button .fa-star');
if (!star) return;
star.classList.remove('fa-star');
star.classList.add('fa-pudding');
};
document.head.appendChild(Object.assign(document.createElement('style'), {
textContent: `
.fa-pudding::before {
background: url('https://twemoji.maxcdn.com/72x72/1f36e.png');
background-repeat: no-repeat;
background-size: 100%;
filter: grayscale(100%) brightness(200%) opacity(50%);
content: "\\2003";
}
.star-icon.active > .fa-pudding::before, .icon-button.active > .fa-pudding::before {
filter: grayscale(0%) brightness(100%) opacity(100%);
}
`
}));
document.querySelectorAll('article').forEach(putPudding);
new MutationObserver((mutations, observer) => {
mutations.reduce(
(nodes, mutation) => nodes.concat(Array.from(mutation.addedNodes)), []
).filter(
node => ['ARTICLE', 'DIV'].includes(node.tagName)
).forEach(putPudding);
}).observe(body, { childList: true, subtree: true });
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment