TOKIMEKIのレイアウトを圧縮するUserCSS

～せっかちなわたしへ～

しかしデフォルトのレイアウトの隙間も画像も何もかもがでかすぎるのでコンパクトにするUserCSS書いた

Deck表示するのって一度にたくさんpostを見たいからなので隙間は詰めた方が良いのでは？という思想

情報量の差

https://scrapbox.io/files/676056430026e3578467aae7.png

シングルカラム表示、Deck表示、Deck表示時のフロート表示とあとなんやかんや表示スタイルがたくさんあるアプリなので全部は対応できてないと思う

chrome以外は分からない

UserStyles.worldに登録した

githubにあげた

1.0 つくった

1.0.1

プロフィール画面でリプ先が小さくなるのを解消した

1.0.2

メディア欄の表示を変更して1枚1枚見やすくした(主観)

いつの間にか1postに複数画像ある場合まとめられるようになっちゃってる…

1.0.3

通知欄の♡と☆を線だけにした

画像拡大表示時のコントロールアイコンのドロシャを濃くして画像が白っぽいときの視認性を上げた

1.0.4

verが1.0.0のままだったのを修正した

Deckモードで画像やリアクション欄が横にずれているのを修正

font指定を修正

投稿欄の隙間を狭くした

1.0.5

縦に長い画像を適当な高さで隠すように変更

Deckモードの引用やリンクカードの位置を修正

まだおかしいとこあるかも

1.0.6

プロフ表示時は長い画像を隠さないし単体画像はフル表示するようにした

1.1.0

リンクカードの表示を見直し

X埋め込み時に上下をちょっと切り取り

TLにリプ元を表示しているときケバブメニューがずれる問題を補正

1.1.1

リプツリーが省略されるとレイアウトが崩れるのを修正

投稿欄での引用postの表示を修正

フィード埋め込み時の表示を調整

通知欄でのfollowボタンの前後の隙間を調整

1.1.2

S幅以下での本文の表示位置を調整

サムネのgrid幅を枚数ごとに変化するよう調整

RTのリプ元を非表示

プロフ固定postのリプ元を非表示

bio欄を調整

リンクカード表示を調整

通知欄のユーザーアイコンを重ねる

モーダル表示を調整

各カラムの設定表示時のレイアウト調整

その他微調整

1.1.3

reply元の画像が1枚のときだけ幅50%に制限する

fed.brid.gy利用アカウントのラベルが赤くてびっくりするので強調されないように調整

1.1.4

全体的にセレクタの指定を見直して不要な!importantを削除

全体の記述位置の見直し

絵文字フォント指定を削除

モーダル・フロートの表示部分を調整

deck表示時に投稿欄を開くと左下のメニューが上に移動するのを制御

フォロー/フォロー解除ボタンの表示が場所によって変わるのを制御

フォロー中ボタンは実質フォロー解除(Negative)なので大きさをフォローボタンと揃えた

通知カラムの新着アイコンを●から三角に変更(丸いままだとどこに置いても据わりが悪かったため)

XS以下表示でtokimeki.pollが左にめりこむのを修正

他あったかも

1.1.5

モーダル表示時の高さを調整

複数サムネのgridが適用されなかったのを修正

1.1.6

プロフィール>動画欄のレイアウトを調整

横長動画が豆粒サイズになるため