井戸端クリスマスモード
blu3mo.icon
井戸端の色が変わっていてびっくりした
（もしかして自分だけ?）
https://gyazo.com/541462b0f298c21359b8399c9d753e3c
me toosta.iconmaichan.icon
テーマが変更された？
（あまり好きなカラーリングではないかもしれない）blu3mo.icon
takker.iconも正直微妙に感じる箇所があるのですが、カラーデザインとかできないのでそのまま放置しています……takker.icon
いい感じの配色を思いついた方がいらっしゃいましたら是非設定をお願いします
ヘッダーで十分クリスマス感あるから背景はデフォルト井戸端にしてもよさそうteyoda7.icon
雪景色も白いし
箇条書きのブレットを★に変える
変えてみました（去年もやったやつ）suto3.icon
背景画像をそれっぽいものに変える
調べた限りでは、雪っぽい挙動をするには、乱数等が必要なので、CSSだけでは無理みたいですsuto3.icon
unsplash.com の画像貼り付けるようにしてみましたsuto3.icon
しょぼいネットワークで使っているので若干つらい(完全にこっちが悪い)kuuote.icon
背景が描画されないのでバグったかと思った
background: coverはStreamでバグるのでやめておいた方がいいと思う
SVGで雪が降るアニメーションを作って背景画像にしようとしてみたが、描画が重いのかscrapboxがガクガクになるので止めたtakker.icon
作ってみました suto3.icon
https://svg-hosting.vercel.app/api/svg?url=https://scrapbox.io/api/code/villagepump/井戸端クリスマスモード/s02.svg
code:s02.svg
<style type="text/css">
animation: fallAnime 1s linear infinite;
}
animation: fallAnime 0.5s linear infinite;
}
@keyframes fallAnime{
0% { transform: translateY(-100%)}
100% { transform: translateY(0%)}
}
</style>
<g id="snowflakes1" fill="snow">
<circle cx="1" cy="1" r="1" />
<circle cx="5" cy="25" r="1" />
<circle cx="11" cy="8" r="1" />
<circle cx="12" cy="25" r="1" />
<circle cx="17" cy="20" r="1" />
<circle cx="28" cy="45" r="1" />
<circle cx="33" cy="15" r="1" />
<circle cx="46" cy="11" r="1" />
<circle cx="58" cy="55" r="1" />
<circle cx="1" cy="61" r="1" />
<circle cx="5" cy="85" r="1" />
<circle cx="11" cy="68" r="1" />
<circle cx="12" cy="85" r="1" />
<circle cx="17" cy="80" r="1" />
<circle cx="28" cy="105" r="1" />
<circle cx="33" cy="75" r="1" />
<circle cx="46" cy="71" r="1" />
<circle cx="58" cy="115" r="1" />
</g>
<g id="snowflakes2" fill="snow">
<circle cx="3" cy="1" r="2" />
<circle cx="35" cy="25" r="2" />
<circle cx="11" cy="8" r="2" />
<circle cx="3" cy="61" r="2" />
<circle cx="35" cy="85" r="2" />
<circle cx="11" cy="68" r="2" />
</g>
</svg>
代わりに静止画で作った
https://svg-hosting.vercel.app/api/svg?url=https://scrapbox.io/api/code/villagepump/井戸端クリスマスモード/snow.svg
code:snow.svg
<g fill="snow">
<circle cx="100" cy="100" r="15" />
<circle cx="200" cy="500" r="15" />
<circle cx="300" cy="300" r="15" />
<circle cx="400" cy="1000" r="15" />
<circle cx="500" cy="800" r="15" />
<circle cx="600" cy="400" r="15" />
<circle cx="700" cy="100" r="15" />
<circle cx="800" cy="500" r="15" />
<circle cx="900" cy="300" r="15" />
<circle cx="1000" cy="220" r="15" />
<circle cx="1100" cy="800" r="15" />
</g>
</svg>
/icons/いいね！.iconblu3mo.icon
新規作成ボタンをクリスマスリースに変えてみました suto3.icon
見た目は変わっても、機能は新規作成ボタンである点をご注意願います
クリスマスのページのページトップ画像を変えると画像の変更ができます など
おお、時期設定したcss設定できるのかblu3mo.icon
面白い
versionがassets-202112...のscrapbox限定で発動するCSSですtakker.icon
少し前に仕込んでおきました
ちゃんと切り替わって何より
このユーモア好きyuki_minoh.icon
すばらしい
offline modeの配色がよくないtakker.icon
直したい
https://gyazo.com/f04bc47eaa8b67518867fc18cc673212
yuki_minoh.icon
個人的にこの緑地に金文字の明朝体が最高にオシャレ
https://gyazo.com/c8a37fe81597e0a1c3caaa7ac5f7a91b/raw#.png
年中これがいい！！
これすき