1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 | /****************************** 特傳夏碎+冰炎版本 語法來源:https://www.plurk.com/p/oriltg * 無人回應的空噗:兩隻陪你聊(不同方向版本) * 註:把::after的部份刪掉後,就會變成單隻款式 ******************************/ .plurk_box > .response_box .list .empty{ visibility: hidden; } /* 頭像及對話框預設,可於此處自行調整 */ .plurk_box > .response_box .list .empty::before, .plurk_box > .response_box .list .empty::after { visibility: visible; position: relative; display: block; width: 320px; /* 對話框寬度 */ height: 50px; /* 對話框高度。如果句子太長無法顯示,可修改高度或改為「auto」 */ min-height: 50px; text-align: left; color: black; /* 對話框文字顏色 */ background-color: white; /* 對話框背景顏色 */ background-repeat: no-repeat; padding: 10px; border: 2px solid #000; /* 對話框的框線 */ border-radius: 10px; /* 對話框的圓角 */ white-space: normal; word-spacing: normal; /* 如果句子太長,需要手動斷行,請改為「100vw」 */ margin: auto; } /* 〔勿刪改〕 刪噗後無法載入回應的情況下,可以顯示系統原本的句子「唔,好像有點怪怪的」 */ .plurk_box > .response_box .list .empty[style]{ visibility: visible; } .plurk_box > .response_box .list .empty[style]::before, .plurk_box > .response_box .list .empty[style]::after { display: none; } /* 頭像及對話:一般狀態 */ .plurk_box > .response_box .list .empty::before { padding-left: 60px; content: "好像已經很久沒有這麼悠閒過了。"; background-image: url('https://emos.plurk.com/c210a24ee95ee48177de0d475d951063_w48_h48.gif'); } .plurk_box > .response_box .list .empty::after{ padding-right: 60px; content: "嗯。"; background-image: url('https://emos.plurk.com/38aeb089548bc9d600b2fec5647900ef_w48_h48.gif'); background-position-x: right; text-align: right; } /* 頭像及對話:滑至噗內時(不需要可以刪掉) */ .plurk_box:hover > .response_box .list .empty::before { content: "不過完全沒有人回應呢......"; background-image: url('https://emos.plurk.com/c210a24ee95ee48177de0d475d951063_w48_h48.gif'); } .plurk_box:hover > .response_box .list .empty::after { content: '管他的。'; background-image: url('https://emos.plurk.com/8a10d33c8faff494b25e09bc5ee40918_w48_h48.gif'); } /* 頭像及對話:滑至頭像及對話時(不需要可以刪掉) */ #form_holder.plurk_box > .response_box .list:hover .empty::before { content: "看來終於有人要回應了呢。"; background-image: url(https://emos.plurk.com/6b5fd1ed85b406183b6974de9c0ec5d2_w48_h48.gif); } #form_holder.plurk_box > .response_box .list:hover .empty::after { content: "那就走了吧。"; background-image: url('https://emos.plurk.com/c6eb8116a5b6d9b21da25d447d790d8e_w42_h48.gif'); } /* 滑至頭像及對話時的滑鼠游標,可改為圖片(不需要可以刪掉) */ #form_holder.plurk_box > .response_box .list:hover .empty{ cursor: grab; } /* 頭像及對話:點擊頭像及對話時(不需要可以刪掉) */ .plurk_box > .response_box .list:active .empty::before { content: "嗷嗷!" !important; background-image: url('https://emos.plurk.com/35d2b0a574701708b9caa183ae496fd9_w48_h48.png') !important; } .plurk_box > .response_box .list:active .empty::after { content: "嗷嗷!" !important; background-image: url('https://emos.plurk.com/dcbce04477006672e054914c03fdbe0d_w48_h48.png') !important; } /* 點擊頭像及對話時的滑鼠游標,可改為圖片(不需要可以刪掉) */ #form_holder.plurk_box > .response_box .list:active .empty{ cursor: grabbing !important; } |
Direct link: https://paste.plurk.com/show/j4449hsRv5Ry4ockxeGU