はじめに
2017/6/16 0時頃、突如として Web 版 Twitter があちこち丸くなる現象が発生しました。同様の変更がモバイルアプリや TweetDeck にも適用されています。
思えば数日前からボタンの角が丸くなっていたので、UI 変更の予兆だったのかもしれませんね。
CSS を覗いてみると .edge-design
というクラスが出現していて、ここにある border-radius:50%
が各所に適用されているようです。 (L_tan さんありがとうございます)
Twitter を眺めてると(少なくとも自分の観測範囲では)阿鼻叫喚なので、どうせだったら徹底的に対抗してやる!と思い、全部 border-radius:0px
にしてやりました。
やり方
- Stylish というアドオンをインストールします。
- URL に
twitter.com
を指定して、以下の CSS を入力します。
tofu.css
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("twitter.com") {
* {
border-radius: 0px !important;
}
.global-nav .search-input
{
padding: 8px 32px 8px 8px;
}
.RichEditor div[contenteditable],
.RichEditor div[contenteditable]:focus,
.RichEditor div.fake-focus[contenteditable]
{
padding: 8px 8px;
}
}
ユニバーサルセレクタが効かなくてクラスちまちま追加してたんですが !important
の存在を忘れていました……
こんな感じになります。エッジが効いてますね。
おわりに
サッポロビールも「丸くなるな、星になれ。」と言っているので、あとはいいねをふぁぼに戻したら完璧だと思います(適当)。
適当に作ったので、ご指摘ありましたらよろしくお願いします。