Post



우선 1월 7일자에 기존에 올린게 있지만 댓글을 보니 오른쪽 끝에 투명화가 살짝 안되서 다시 구했습니다.

그러니 기존에 제껄 사용하시던 분들은 아래껄 이용하시면 다시 예전처럼 깔끔하게 나옵니다.


적용방법은 전에 만든건데 똑같으니 css만 교체하시면 됩니다


css.txt


@import url("https://fonts.googleapis.com/css?family=Changa One");

@import url("https://fonts.googleapis.com/css?family=Imprima");


/* Background colors*/

body {

  background-color: rgba(0,0,0,0);

}





/* Transparent background. */

yt-live-chat-renderer {

  background-color: transparent !important;

}


/* Outlines */

yt-live-chat-renderer * {

  text-shadow: -2px -2px #000000,-2px -1px #000000,-2px 0px #000000,-2px 1px #000000,-2px 2px #000000,-1px -2px #000000,-1px -1px #000000,-1px 0px #000000,-1px 1px #000000,-1px 2px #000000,0px -2px #000000,0px -1px #000000,0px 0px #000000,0px 1px #000000,0px 2px #000000,1px -2px #000000,1px -1px #000000,1px 0px #000000,1px 1px #000000,1px 2px #000000,2px -2px #000000,2px -1px #000000,2px 0px #000000,2px 1px #000000,2px 2px #000000;

  font-family: "Imprima";

  font-size: 18px !important;

  line-height: 18px !important;

}


yt-live-chat-text-message-renderer #content,

yt-live-chat-legacy-paid-message-renderer #content {

  overflow: initial; !important

}


/* Hide scrollbar. */

yt-live-chat-item-list-renderer #items{

  overflow: hidden !important;

}


yt-live-chat-item-list-renderer #item-scroller{

  overflow: hidden !important;

}


/* Hide header and input. */

yt-live-chat-header-renderer,

yt-live-chat-message-input-renderer {

  display: none !important;

}


/* Reduce side padding. */

yt-live-chat-text-message-renderer,

yt-live-chat-legacy-paid-message-renderer {

    padding-left: 4px !important;

  padding-right: 4px !important;

}


yt-live-chat-paid-message-renderer #header {

    padding-left: 4px !important;

  padding-right: 4px !important;

}


/* Avatars. */

yt-live-chat-text-message-renderer #author-photo,

yt-live-chat-paid-message-renderer #author-photo,

yt-live-chat-legacy-paid-message-renderer #author-photo {

  

  width: 24px !important;

  height: 24px !important;

  border-radius: 24px !important;

  margin-right: 6px !important;

}


/* Hide badges. */

yt-live-chat-text-message-renderer #author-badges {

  display: none !important;

  vertical-align: text-top !important;

}


/* Timestamps. */

yt-live-chat-text-message-renderer #timestamp {

  

  color: #999999 !important;

  font-family: "Imprima";

  font-size: 16px !important;

  line-height: 16px !important;

}


/* Badges. */

yt-live-chat-text-message-renderer #author-name[type="owner"],

yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="owner"] {

  color: #ffd600 !important;

}


yt-live-chat-text-message-renderer #author-name[type="moderator"],

yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="moderator"] {

  color: #5e84f1 !important;

}


yt-live-chat-text-message-renderer #author-name[type="member"],

yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="member"] {

  color: #0f9d58 !important;

}


/* Channel names. */

yt-live-chat-text-message-renderer #author-name {

  color: #cccccc !important;

  font-family: "Changa One";

  font-size: 20px !important;

  line-height: 20px !important;

}


yt-live-chat-text-message-renderer #author-name::after {

  content: ":";

  margin-left: 2px;

}


/* Messages. */

yt-live-chat-text-message-renderer #message,

yt-live-chat-text-message-renderer #message * {

  color: #ffffff !important;

  font-family: "Imprima";

  font-size: 18px !important;

  line-height: 18px !important;

}



/* SuperChat/Fan Funding Messages. */

yt-live-chat-paid-message-renderer #author-name,

yt-live-chat-paid-message-renderer #author-name *,

yt-live-chat-legacy-paid-message-renderer #event-text,

yt-live-chat-legacy-paid-message-renderer #event-text * {

  color: #ffffff !important;

  font-family: "Changa One";

  font-size: 20px !important;

  line-height: 20px !important;

}


yt-live-chat-paid-message-renderer #purchase-amount,

yt-live-chat-paid-message-renderer #purchase-amount *,

yt-live-chat-legacy-paid-message-renderer #detail-text,

yt-live-chat-legacy-paid-message-renderer #detail-text * {

  color: #ffffff !important;

  font-family: "Imprima";

  font-size: 18px !important;

  line-height: 18px !important;

}


yt-live-chat-paid-message-renderer #content,

yt-live-chat-paid-message-renderer #content * {

  color: #ffffff !important;

  font-family: "Imprima";

  font-size: 18px !important;

  line-height: 18px !important;

}


yt-live-chat-paid-message-renderer {

  margin: 4px 0 !important;

}


yt-live-chat-legacy-paid-message-renderer {

  background-color: #0f9d58 !important;

  margin: 4px 0 !important;

}


yt-live-chat-text-message-renderer a,

yt-live-chat-legacy-paid-message-renderer a {

  text-decoration: none !important;

}


yt-live-chat-text-message-renderer[is-deleted],

yt-live-chat-legacy-paid-message-renderer[is-deleted] {

  display: none !important;

}



그리고 폰트 크기나 색깔을 좀더 변경하기 쉽게 하려면 아래 사이트에 가셔서

원하시는 항목 색 바꿔주시고 맨 아래 css 복사해서 붙여넣으시면 자신만의 스타일을 활용할수 있습니다.


https://chatv2.septapus.com/


그럼 즐거운 방송들 하시길~~


도움이 되셨다면 광고 하나 클릭해주세요 


저에게 10원? 정도의 도움이 됩니다...

  1. 스트리머1 2017.02.03 18:51 신고
    정말로 감사합니다 ㅠㅠㅠ
    자꾸 스트롤 부분이 남아서 짜증났는데... 이렇게 하니 해결이 되었네요!
  2. nw**** 스트리머 2017.02.21 22:08 신고
    정말 감사합니다!
댓글쓰기 폼

▲ top