追記 (16:40)
右上の自分のアイコンが丸になっていると報告を受けたので修正しました。
追記 (10:48)
Chrome拡張機能のほうが便利という声があったので、拡張機能として公開しました。インストールは以下のリンクから。
Twitter Icon Come Back - Chrome ウェブストア
ただし、Chrome拡張機能ではrun-atをdocument-bodyにできないので、document-endに変更しています。この関係で、UserScript版より若干反映が遅れます。UserScriptの導入に抵抗がない方は、以下のUserScript版をおすすめします。
リポジトリはここです。UserScript版もここに置きました。
foooomio/twitter-icon-come-back: Google Chrome extension for reverting the old-style icons for Twitter Web and Tweetdeck
追記 (02:48)
反映がワンテンポ遅れるのが気になる
— ふみを (@foooomio) 2017年6月15日
run-at document-body が最速っぽい
— ふみを (@foooomio) 2017年6月15日
※ run-atの指定についてはdocument-startが最速ですが、bodyを変更するこのスクリプトにおいて、document-bodyが最速という意味です。
あーページ遷移した時もとに戻っちゃうなー
— ふみを (@foooomio) 2017年6月15日
やっぱりattribute変更する関数をMutationObserverでobserveすると無限ループにはまって死ぬ
— ふみを (@foooomio) 2017年6月15日
これでだいぶ安定して動くはず。上記問題は解決済み。しれっとタイトル変えました。ライセンス明記してなかったので書きました。MIT Licenseでお願いします。
(追記) 最新版は随時ここにアップしてます。
twitter-icon-come-back/userscript.js at master · foooomio/twitter-icon-come-back
// ==UserScript==
// @name Twitter Icon Come Back
// @namespace https://foooomio.net
// @match https://twitter.com/*
// @author foooomio
// @run-at document-body
// @grant none
// @license MIT License
// ==/UserScript==
(function() {
document.body.className = document.body.className.replace('edge-design');
new MutationObserver(function(mutations) {
if (!mutations.some(function(mutation) {
return mutation.oldValue.indexOf('edge-design') !== -1;
})) return;
document.body.className = document.body.className.replace('edge-design');
}).observe(
document.body,
{ attributes: true, attributeOldValue: true, attributeFilter: ['class'] }
);
})();
無限ループしたらごめんなさい(>_<)
ちなみにアロー関数使ってないのは、TampermonkeyのLinterが認識してくれなくてな・・・
追記 (02:13)
てかreplaceって正規表現じゃなくて文字列でもいけなかったっけ
— ふみを (@foooomio) 2017年6月15日
むしろ文字列でやった方が良いね＜replace
— ArcCosine (@ArcCosine) 2017年6月15日
// ==UserScript==
// @name Twitter Icon Come Back
// @namespace https://twitter.com
// @match https://twitter.com/*
// @grant none
// ==/UserScript==
(function() {
document.body.className = document.body.className.replace('edge-design');
})();
追記 (02:07)
なるほど、bodyについているedge-desginクラス外せばすごいスッキリするね。
— ArcCosine (@ArcCosine) 2017年6月15日
document.body.className = document.body.className.replace(/edge-design/);
— ArcCosine (@ArcCosine) 2017年6月15日
これが一番早くて確実。GreaseMonkeyやTamperMonkeyに以下のjsを打ち込みましょう。（@ArcCosine@githubさん、ありがとうございます！！）
// ==UserScript==
// @name Twitter Icon Come Back
// @namespace https://twitter.com
// @match https://twitter.com/*
// @grant none
// ==/UserScript==
(function() {
document.body.className = document.body.className.replace(/edge-design/);
})();
本文
取り急ぎ。
.edge-design .Avatar,
.edge-design .DashboardProfileCard-avatarImage,
.edge-design .DashboardProfileCard-avatarLink,
.edge-design .Gallery.is-tweetless .Gallery-content,
.edge-design .Gallery.is-tweetless .Gallery-media,
.edge-design .MomentCapsuleCover .MomentUserByline-avatar,
.edge-design .MomentCapsuleItemTweet--withText .MomentUserByline-avatar,
.edge-design .MomentCapsuleSummary .MomentUserByline-avatar,
.edge-design .MomentMakerRecommendedTweetsSearch--users .MomentMakerRecommendedTweetsSearch-userContainer .avatar,
.edge-design .ProfileAvatar,
.edge-design .ProfileAvatar-image,
.edge-design .ProfileAvatar-placeholderImage,
.edge-design .ProfileAvatarEditing,
.edge-design .ProfileAvatarEditing-button,
.edge-design .ProfileAvatarEditing-overlay,
.edge-design .ProfileCard-avatarImage,
.edge-design .ProfileCard-avatarLink,
.edge-design .ProfileCardMini-avatarImage,
.edge-design .ProfileListItem-avatar,
.edge-design .ProfileUserList .Avatar {
border-radius: 7px;
}
.edge-design .avatar {
border-radius: 7px;
}
StylishとかStylebotとかの拡張機能を使うと良いです。漏れがあったら編集リクエストください。