버블 소스

[현갱이]

<!--기본 버블 틀-->
<style>
#mArticle li p span:first-child {display:none;}
</style>

<style>
/*프로필*/
#mArticle li div>span>span[class*="name"]{
color:black;
margin-left: 0px;
}
/*말풍선*/
.comment_section .comment_info .desc_info,
#mArticle li div p{
background-color: #FFFFFF;
border-radius: 0px 17px 17px 17px;
border: 5px solid #f8f7f6;
color:#000000;
padding: 9px 10px;
margin-left: 0px;
display: table;
}

/*답장*/
/*정렬*/
.list_comment li.reply_section,
#mArticle li.reply_on{
text-align:right;
justify-content: flex-end;
}
/*말풍선*/
.reply_section .comment_section .comment_info .desc_info,
#mArticle li.reply_on div p{
background-color: #a289f1;
border-radius: 17px 17px 0px 17px;
border: 5px solid #f8f7f6;
color:#000000;
padding: 9px 10px;
margin-left: auto;
display: table;
}
</style>

<style>
/* 기타 설정*/
#mArticle .ico_reply, #mArticle div[class*="ad"],
.list_comment>li:after,
.tag_comment, #mArticle li div span[class*="writer"],
.reply_section .ico_new, #mArticle li div span[class*="new"],
.reply_section .profile_thumb, #mArticle li.reply_on a,
.reply_section .opt_more_g, #mArticle li.reply_on div>span>span[class*="name"]{
display : none !important;
}
/*모바일 날짜 여백*/
#mArticle li:not(.reply_on) span[class*="date"]{
margin-left: 0px;
}
#mArticle li.reply_on span[class*="date"]{
margin-right: 5px;
}
</style>

<style>
li[id*="commentLi"] {border: 0px solid #BE81F7;}
</style>

<style>
/* 광고영역 제거 */
#mArticle > div:nth-child(7) {display: none;}
</style>


<style>
/*뒤로가기*/
#mArticle > div >.tit_cmt span {background: url('https://cdn-icons-png.flaticon.com/512/3877/3877262.png')no-repeat center/ contain;}
</style>

<style>
/*돋보기*/
#mArticle > div > span:nth-of-type(1) {background: url('https://cdn-icons-png.flaticon.com/512/93/93642.png')no-repeat center/ contain; margin-right: 3px;}
</style>

<style>
/*댓글오른쪽점세개없애기*/
#comment_section .cmt_info span:last-child {display:none;}
</style>

<style>
/*폰트 크기*/
#mArticle li p {font-size: 9.5pt!important;}
</style>

<style>
/*사진 둥글게*/
#mArticle li img:not(.kakao_emoticon img,#mArticle li div>a){border-radius:20px;}
.cmt_img_wrapper{border:none !important;}
</style>

<style>
/*미방에만 이미지 보이게*/
.figure-img {display: none !important;}
#mArticle div:nth-child(2) div:last-child > span:last-child {display: none !important;}
</style>

<div data-ke-class="article"><style>
#mArticle li span:first-child{ visibility:hidden; }
#mArticle li span:first-child:before{ visibility:visible; }
#mArticle li span:first-child:after{ visibility:visible; }
</style></div>

<style>
#mArticle li span:last-child{display:none;}
li span{display:none;}
</style>



<!---여기서부터 알아서 꾸며요--->

<style>
/*배경색*/
body {background: #f8f7f6;}
div,li {background: transparent !important;}
ins div, #mArticle > div:nth-child(1) {display: none;}
#mArticle > div:nth-child(7) {position: absolute; top: 0px; left: 0; width: 100%;}
#mArticle > div:nth-child(2) {position: absolute; padding-top: 720px;}
#mArticle > div:last-child {display: none;}

/*버블 방 이름*/
.tit_cmt { font-size:0 !important; background-color:#ffffff;}
.tit_cmt:before {content:'⠀⠀⠀⠀⠀⠀ ⠀⠀⠀ ⠀⠀⠀ 백현이 ⠀';font-size:11pt;color:#000000;font-weight:500;}

/*버블 날짜*/
#btn_allcmt { font-size:0; background: #ffffff; border: 0px solid #ffffff;}
#btn_allcmt:before {text-align:center; border-radius: 0 0 15px 15px; padding:13px; background: #ffffff; content:'⠀⠀ ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀𝑏𝑢𝑏𝑏𝑙𝑒⠀❤︎⠀+𝟱𝟬𝟬𝟲 ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀'; font-size:8pt; color:#000000;}
#btn_allcmt span {display:none;}
</style>

<style>
/*아티스트 프사 띠*/
.profile_thumb .img_thumb,
#mArticle li a {border: 1.4px solid #895bf2!important; padding:2px; fliter: blur(6px);
border-left: 1.4px solid #cf6def!important;padding:2px; fliter: blur(6px);
border-top: 1.4px solid #bd5bf2 !important;padding:2px; fliter: blur(6px);
border-right: 1.4px solid #a05bf4 !important;padding:2px; fliter: blur(6px);
border-bottom: 1.4px solid #915bf4!important;padding:2px; fliter: blur(6px);}
#mArticle li div span[class*="백현이"]
{font-size:8pt; font-weight: bold; color: #ffffff; margin-left: 0px;}
#mArticle li div span[class*="date"] {display:none!important;}
</style>




<!---닉 길이에 따라 이름 위치 조정 필요--->


<div data-ke-class="article"><style>
/*아티스트 배지 및 이름*/
#mArticle li span:first-child:before{ content: " ARTIST"; color:#ffffff; margin-left:2px; border-radius:13px; border:0px solid #895bf2; background: linear-gradient(to right,#895bf2,#cf6def); padding: 2px 4px; font-size:6px}
#mArticle li span:first-child:after{ content: "😘"; color:#000000; font-size:8pt; margin-left:-28px;}
</style></div>


<!---폰 기종에 따라 위치 조정 필요--->

<style>
/*전송 버튼*/
#writeAComment {background: #ffffff; font-size:15pt; color: #ffffff; !important; border: 2px solid #ffffff; width:365px; position:absolute;top:20%;left:46%;transform:translate(-50%,-10%); border-radius:0px;}
#writeAComment:after {background: url('https://lh3.googleusercontent.com/fife/APg5EOYHQVzPgWqKrDDaW9wHn5tVNCo6b8H78OLREWhwk-jIQJFz9W8WO3tLvC5tKgsaiLRmsQ_51BNxA1svfhfCPXNL4oGV3Y4rGLlkjNw2_KCwnAQmQodFyL3RJPQdFELFtvV1ocT7QgkvBj1ZBXPB43eewXkApa1SJDiE0sbtBuRaujkfAZaKsY7BEyFIlldt4iEWcPX7kK7IswOI2xI9Ja-2mzrPaxv_WPZN6ElZgVK4nnWsg0j_uPouw-BSbn7HoEEIpGvI9EZDaGFaGYaRlsTfgjhCGsOa2t4yS7rUinKMHpGuF9MFH2VU1JdaxpwLtomBToEgIoIJx7Lco-u39v199Kb9CY4IqFUQO9lglCjyHDO4vQp6yxb2mRnRhssg69SZQpEtr1eOmbK280ZLKWZxiSb3W8uf1a_Hex2ZybaV-smx91bFOOLWhJ7uyb7RmmcNhZeFXzuEWVgmAtsf59QPA5MbKzASZubbXlAbVsBR--_IBepz1sLMxRnDGWNpQ41BlesiwlmbOXg8crKLOkTBxk0xv1TydBMD5R3X4mMWuDeTL2P6YkSEWnnQ5HbuoBUDPHCL4gOoYVADabZ0KfwXoYDhIfQQApATVvS7R_Za0nt8RK0f53AVFazdkH5PiGOcwcn6oc2uWyTZCdjKuc6eKWUJqlUGNqw-rnn3ilFof9mLh4UY1Tc1Ne3hEp-jYWa9mfJeafbRfApz_VOckKTzDSMZGz0jLxLdIXyubJ-Ibv7XvTV_Q8fgLxN8Z3_y6QmtjBmFnVnYbpeuOqPMC7FMIRgie_wViO2lQQbyQ319zDn8Yy5BMiFdgy3xyeQiaZwpb0GDycoPZBTkQYfJsVpBc7sMmi-sFy3q7mGyHK18GmqT0qvczf2cGuNNyZdPuWjnXliv1v2BDX3AZ7eA-pNAXhTIj2YY-oNLVxwBesSAyMQlPK4AWkOEwbb8tQy1tvkz_NSKIxum-H4VhmainDEVvUATSz5wLDCKM2z9mGzaGFGkHhdR6ITTuWD83c_dQyN4haRKnBBwxxJ99XWvvIVJ6lK5DDHp7bRzsc7_xiWDQtMJ_BIBW6yOOsSkEDXzCRzKxD9xhLOllaf49-wuu9zzlJ1RrlPwxCutdOjm6nbThKh-n6uXI5X7I1OlZxYZ4HHlOo0wWmgcuKJrfuPCgZAOnEb-4T4txlTaOUXlArOeN0WgNPW8sZmADDzYVkib47D7EYcEfbIosglNVFI_ho3wdch6nVn3Yt2oRYESNJrcNWRDxOetO_jt6-mgiB_E6xgldkE6YZyzKmn6k_jCT5ivlM3X8726CvZoa3IPenD_3gffEZrFAmIbkQIkchwcPlDedIC0CeKHxty3cknrAVH4P1KN1Gb_nVxO9CeENn58aYDS8VE2y8ToZxOzXClWK7htQxueJ5_PeZmagYsT0OnvaoqR3OfAQCzlHBMNUyslFavozy6DrJR6Sxc15Z61a5_920l7Yb-CpanmN1V8r7tScobn=w1027-h1246') no-repeat center/contain;
content: '⠀'; font-size:40pt; color: #ffffff; position:absolute;top:-60%;left:83%;transform:translate(80%,60%); white-space: pre;}
#writeAComment span {display: none;}
</style>

[현갱이]

1. 아이폰 12 기준으로 맞춰짐, 컴 적용x

2. 두번째 사진에서 별표친거는 개개인마다 차이가 있으니 꼭 바꾸기❗️

3. 버블 날짜는 댓글 11개 쓰고나서부터 보여요

4. 베리들은 모두 환영!

5. 프사 바꾸는 코드는 안 먹히는 관계로 다음카페에서 직접 바꾸셔야 합니다•••

[현갱이]

적용시켰는데 위치 이상하면 별표친거 꼬옥 바꾸기

[현갱이]

폰 기종 다르면 이렇게 보여요 (아직 안 보이지만 버블 날짜창 크기도 내가 첫댓에 올린거랑 다를거임