単一カラム構成でのカラム幅を全体的に作り直しました。最小の場合の画面が一時的にぶっ壊れたけど、直せたと思います。特徴は…

・ 主な三段階のブレイクポイント区間で、必ず主カラムの幅が最大 800 画素となるようにした。

・ 両側に副カラムが表示される時と、片側だけに表示される時で、主カラムの見た目（余白の取り方）をほぼ統一した。

・ 両側に副カラムがある時、メニュー側よりも投稿記入欄の方を優先的に広げるようにした。主カラムは中央揃えではなくなった。

・ ページ全体に対する縦のスクロールバーが表示されても、その太さを余白に吸収して、位置がずれないようにした。

変数（カスタムプロパティー）を弄るだけで制御できる枠組みが整ったので、「ちょっと狭過ぎる」などの場合には値や計算式を調整するつもりです。

#もふけもの運営 #MofuUI #Mastodon

プロフ画像が中央からずれてる人、CSS 壊したかと心配させられちゃうぢゃないですか。

@tizerm 当サーバーにも、常に非収載で投稿してる人はいらっしゃるね。あまり頻繁ではないけど。

各カラムへの幅の配分を調整したり、細かい所を直したりしました。どんなもんでしょうかね。

よふけもの…ねるけもの。雨降ってる

雨だねえ。

CSS で不連続な条件分岐をしたかったんだけど、単純な足し算・掛け算と下限・上限を使ってほぼ実現する方法を編み出したのが面白かったです。

「カラム幅-中央」の値が 760px 以下なら「縦余白追加」を 0px とする。760px を超える場合は 8px とする :

--縦余白追加: clamp(0px, 8px, 100 * (var(--カラム幅-中央) - 760px));

厳密には 760px から 760.08px までの区間の急峻な一次関数なので、算出値が半端だと中間の値が発生する余地はある。四捨五入の機能を使えば完全だけど、新しいブラウザーにしか載っていない。

#CSS

昼なのに暗いな ! 雲が厚い。

急に明るくなって強い雨が通過してった。ダイナミックねえ。

@4bsoL_4bsoRu1n4 イラッシャイ 何か困った事などあればお知らせください。

なんかもう極限まで色を薄くしました。

#MofuUI

@cojohne 一度消したのは、一周して現れる「color13」を切り落とす必要があるのを忘れてたの。…と書いてたら返信先が消えた。

ここまで弱くすると、図で言う「color05」が「ダーク」の通常の背景色とほとんど同じになってしまった。理想的には、基準となる色（白色点と呼んでいいかな）を中心にした等距離の輪を生成しないといけないなあ。

・ 主カラムに投稿記入欄が表示される場合の、枠の横幅に上限を設定しました。あまりにも横長になるので。

・ 主カラムに投稿記入欄が表示される場合にカラムヘッダーがなくて殺風景なので、「::before」で無理やりフェイクのヘッダーを描いてみました。

・ このサーバーらしさが出た方がいいし、試しにサーバーのトップ絵を背景に貼ってみました。でもそもそもトップ絵以外の用途で使用許可取ってない。ごめんなさい…駄目でしたらおっしゃってください。

・ 表示領域が狭い場合は（どうせ幅いっぱいに内容を表示するので）背景画像を描画しないようにしました。

・ 新着を表す桃色は、ダークテーマで使うと印象が鋭過ぎるのかも知れないので、彩度を下げてみました。今までダークとライトで共通の色だったけど、これを分離。

あまり計画性のない思い付きをボコボコ反映してみた感じ…。

#MofuUI

もっと隙間を作って風通しを良くした方がいいかしら。

スタイルシートだけでは手を出せない根本的な Mastodon の画面構成が気に食わなくなってきたぞ。いや、気に食わないのは元々だけど…手を出せる範囲に手を出したら、残った部分が気になる。その辺はどうしょうもない。