コードブロックにペーストボタンを表示するUserScriptを作る

仕様

コードブロックのコピーボタンの隣にペーストボタンも表示する

code:code

tekito-na-ko-do

code   みたいな感じで

アイコンはどれにしようか？

コピーと見分けがつきにくい

場所で慣れるしか無いといえばそうなのだが…

$ fa-regular fa-paste

コピーなのか貼り付けなのかがいまいちわからない

これなら上書き（アップロード）するというのがわかりやすい

でもクリップボードだから「ファイル」ではないんだよな…

どうせ上書き時にダイアログを表示するから、その際に「クリップボード」ボタンでも表示すればいいかな？

仮にファイルからアップロードできるとしても、アップロードボタンを更に増やす気はない

ペースト後はページ遷移時まで元のコードブロックの中身を保持し、コードブロックのタイトル行に元に戻すボタンを表示して巻き戻せるようにする

アイコン

$ fa-solid fa-arrow-rotate-left

つまり、こうなる

code   

https://gyazo.com/56a49cc8bd49ed12f23b7b4854c49413

押しにくそう…

このぐらい間隔を空ければ良いかも

https://gyazo.com/b3665bfe6bdcc16c89a1cb21ade047ee

code:button-style.css

.line span.code-block .tool-buttons>.button {

display: inline-block;

width: 2em;

text-align: center;

}

コピーボタンしかない時の主張がでかい

https://gyazo.com/ae5547b13be5e551f41849b2b0e6152f

あくまでペーストボタンを表示している時限定のスタイルにしよう

と思ったけれど、これはこれで当たり判定広くて押しやすそうな気もする