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 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 | /*對話框參考:https://www.plurk.com/p/ogg8nj*/ /********************下方不要更動*********************/ /*名字換行*/ .list .tr_cnt { display: flex; flex-direction: column; } /*右側無空白*/ .list .plurk_cnt .text_holder { display: inline-block; padding:0.5em 1em; margin: 1.5em 0 0; width:auto !important; min-width: 0; } /*對話框邊距調整*/ .list .plurk_cnt .td_cnt { padding: 0.5em 15px 0; /*位置往外調,留出頭貼位置*/ } /*對話框樣式*/ .list .plurk_cnt .text_holder { display: inline-block; padding:0.5em 1em; width:auto !important; border-radius:16px; min-width: 0; box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2); } .response .plurk_cnt {background-color: transparent;} /*對話框尾巴樣式和位置*/ .list .plurk_cnt .text_holder::after { content:""; position:absolute; border-style: solid; border-width: 7px 5px; height: 0px; width: 0px; left:3px; top:-2px; border-color: transparent; } /*噗主對話框尾巴位置*/ .list .highlight_owner .plurk_cnt .text_holder::after { left: auto; right:3px; } /*暱稱靠右*/ .list .td_qual { right: 0px; } /*留言靠右*/ .list .td_cnt { display: flex; justify-content: flex-end; } /*把噗主調回來*/ .list .highlight_owner .td_qual { right: auto; } .list .highlight_owner .td_cnt { display: block; } /********************上方不要更動*********************/ /*點開噗文寬度*/ .timeline-cnt .plurk_box { width: 445px; } /*隱藏發語詞*/ .qualifier.q_says { display: none; } /*更改回應最大寬度*/ .list .plurk_cnt .text_holder { max-width: 66%; } /***********上方更改圖片***********/ /*圖示樣式設定*/ .list .response:not(.highlight_owner) .name::after, .list .response.highlight_owner .name::before { background-size: 100%; display: inline-block; width: 48px; height: 48px; content:""; border-radius: 20%; /*頭貼圓角*/ background-repeat: no-repeat; background-position: center; } /*頭貼位置設定*/ .list .response:not(.highlight_owner) .name::after { margin: 0px -0px -0px 10px; } .list .response.highlight_owner .name::before { margin: 0px 7px -0px -5px; } |
Direct link: https://paste.plurk.com/show/2VimG3Yv8oA9liuBJ8TW