自分のアイコンに飾りをつけるUserCSS
遊び
邪魔になったら勝手に消してください
Zoom等の顔映像は、フィルタを重ねて帽子を被せたり芽を生したりして遊べる
Scrapboxでも同じ事をやってみたいという思いつき
芽を生やすCSS
>
style.css.deco-\*.deco-+.deco-\# .link.icon[href="/villagepump/blu3mo"]::before {
content: "🌱";
position: absolute;
top: -18px;
z-index: 1;
}サングラスをかけるCSS
>
//style.css .link.icon[href="/villagepump/blu3mo"]::before {
content: "🕶";
position: absolute;
top: -5px;
margin-left: 5px;
font-size: 5px;
z-index: 1;
}帽子を被るCSS
>
//style.css.link.icon[href="/villagepump/blu3mo"]::before {
content: "🎩";
position: absolute;
top: -13px;
margin-left: 1px;
z-index: 1;
transform: rotate(-10deg);
}修正
行が折り返されると位置がずれるのを修正した
//style.cssa.link.icon { text-decoration: none; }
a.link.icon[href="/villagepump/blu3mo"]::before {
content: "🎩";
position: relative;
top: -15px;
margin-right: -20px;
z-index: 1;
}アイコン自体がずれてしまっていたのでrevertしました🙇
わりと難しい問題
絵文字って環境（というかフォント）によって表示が大きく変わってしまうので…
なるほど
僕はWindows(とChrome)で検証したけれど、Mac, iOS, Androidでまた変わってくるだろうし…
もしかしたらブラウザによって変わるとかもあるかもしれない
test aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
他にできそうな事
帽子🎩⛑👒を被せる
眼鏡🥽👓🕶を着ける
服👔🎽👘を着る
この辺りはアイコンにキャラクターが写っていないと難しそう
誕生日の人に👑をかぶせる
「本日の主役」タスキもCSSで頑張れば作れそう
新しい人に🔰をつけるとか
行が折り返されると位置がずれてしまう
飛ばされる〜w
行から不意に芽が生えてきていて春を感じた