ユーザーフラッグ記法
yuki_minoh.icon
偽物のフラグだと思ったら、本物も重なってたwtakker.icon
めっちゃわかるw
ほぼ見分けつかないですw
これはすごいwsta.iconyosider.icon
見分けつかなくて笑ってしまう
sta
元祖に褒められた!これはうれしいyuki_minoh.icon
ん?てことは公式も旗の棒を疑似要素|で実装していたということ?takker.icon
それとも単に<div></div>のかわりに|を使っているだけかな
公式は疑似要素使ってないっすねyuki_minoh.icon
公式の実装はコンテナで棒を書いて中身で旗
装飾記法はそれができないから旗を作ってから棒を付け足している
先駆者に敬意を表してyuki_minoh.icon
yuki_minoh.icon
code:style.css
/* display: block; */
margin-top: -2px;
width: 50px;
height: 14px;
font-size: 10px;
line-height: 14px;
padding: 0 2px;
color: var(--user-flag-name-color, #fff); & a:is(.page-link, .page-link.empty-page-link) {
color: var(--user-flag-name-color, #fff); &:hover { color: var(--page-link-color, skyblue); }
}
background-color: var(--user-flag-bg, green);
white-space: nowrap;
text-overflow: ellipsis;
overflow-x: clip;
position: absolute;
z-index: 101;
↑z-indexの指定は必要なのでしょうか?takker.icon
消すと何かと被ってしまう?
これはもともと公式のCSSからコピペして作ったのですが、そのときに考慮に入らずに残された部分ですね美濃佑輝
に軽く検索をかけたところ、z-indexはざっくり$ 10^nぐらいの粗さでまずグループ化され、さらにグループ内で序列をつけるという具合で管理されているようです 具体的にはドラッグ選択の網掛けのCSSがz-index: 100;となっており、「選択表示よりも前面にくる」ぐらいの認識でよさそう
code:diff
- :not(.cursor-line) > .text .deco-\>" {
code:style.css
opacity: .7;
}
content: "|";
width: 2px;
color: var(--user-flag-bg, green);
background-color: var(--user-flag-bg, green);
position: absolute;
top: 7px;
left: 0;
height: 18px;
}
code:diff
- :not(.cursor-line) > .text .deco-\>::after {
属性参照セレクターのみの暗黙的*にはパフォーマンスの問題があるため
2026-03-13 名前欄の文字色を内部リンク記法にも適用されるように変更
「自分のページ」等にリンクさせることができる
この部分の配色は明るい色のほうが望ましいため、:hover時の配色に(-hover-colorではない)通常リンク色の変数を指定した
code:diff
color: var(--user-flag-name-color, #fff); + & a:is(.page-link, .page-link.empty-page-link) {
+ color: var(--user-flag-name-color, #fff); + &:hover { color: var(--page-link-color, #fff); } + }
background-color: var(--user-flag-bg, green);
2026-03-03 配色指定に変数を導入したwho.icon
変数未定義の場合には従来通りのカラーリングになる
var(--user-flag-name-color, #fff)
var(--user-flag-bg, green)
https://gyazo.com/99f711f1e92d8a19f8a66bb6087a4da4
緑組
はー-、おもしろいw
$ \footnotesize\overset{\tinyよい}{宵}\overset{\tinyやみ}{闇}の中、$ \footnotesize\overset{\tinyち}{魑}\overset{\tinyみ}{魅}\overset{\tinyもう}{魍}\overset{\tinyりょう}{魎}が$ \footnotesize\overset{\tinyばっ}{跋}\overset{\tinyこ}{扈}する
旗じゃないよ
Settings.icon
UserCSS.icon