YouTubeの動画タイトルを全文表示

Pixivの作品タイトルと同様、全文読めないのでStylusで解決。
タイトル部分の幅を広く、フォントを少し拡大し、太字解除。
アイコンは無駄に空いているチャンネル名の横に移動。

適用前・適用後
続きを読む YouTubeの動画タイトルを全文表示

メイリオをやめろ

特にMac使い、Win用にfont-family: Meiryo, "メイリオ"を指定するな。今は游ゴシックがあるのだから余計な事をしないでくれ。游ゴシックも”Medium”無しでは細すぎるのでとにかく気安く指定するんじゃない。

と唸りながらStylusでメイリオサイトにfont-family: "Hiragino Kaku Gothic Pro" !important;を設定する事に疲れ、@font-faceで全てのメイリオをヒラギノ角ゴにしてやろうと思った。

CSS適用

@font-face {
	font-family: "メイリオ";
	src: local("Hiragino Kaku Gothic Pro W3");
	src: local("Yu Gothic Medium");
	src: local("Noto Sans JP");
}

@font-face {
	font-family: "Meiryo";
	src: local("Hiragino Kaku Gothic Pro W3");
	src: local("Yu Gothic Medium");
	src: local("Noto Sans JP");
}

@font-face {
	font-family: "MS Pゴシック";
	src: local("Hiragino Kaku Gothic Pro W3");
	src: local("Yu Gothic Medium");
	src: local("Noto Sans JP");
}

@font-face {
	font-family: "MS P Gothic";
	src: local("Hiragino Kaku Gothic Pro W3");
	src: local("Yu Gothic Medium");
	src: local("Noto Sans JP");
}

それぞれsrcは任意の一行に絞る。
ついでにMS Pゴシックも入れた(価格.com等で指定されている)。

続きを読む メイリオをやめろ

TwitterをStylusで整形

Stylus(Chrome拡張)でWeb版TwitterにCSSを適用。

適用前
適用後

右下辺りにカーソルを置くので落ち着けるスペースと、よく使う検索・アカウント切替・メニューを近くに。

公式の仕様変更で使えなくなるのと、難読化されたクラス名に対処する為コードが見苦しいのでCSSは省略。

Pinterestの背景リンクを無効化

Pinterestのピンの周囲全面には何故かリンク(クリックイベント)が貼られている。
押すと前ページに戻るが、見ていた位置に戻る訳でもないし、何となくマウスカーソルを置いておく場所なので落ち着かない。

これをChrome拡張のStylusで消す。

適用前
適用後

CSS適用

[data-test-id="closeup-data-loaded"] {
	width: 70% !important;
	margin: auto !important;
}