무지개 3 채팅 스킨 (2022년 3월 수정)

body {
	-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 2em)
}

body,
html {
	font: $font_sizepx '$font_face', serif;
	background-color: $background_color;
	height: 100%;
	overflow: hidden
}

#log {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0 0.5em 0.1em;
	width: 100%;
	box-sizing: border-box
}

#log>div {
	background-color: white;
	padding: 0.2em 0.5em;
	margin: -0.3em 0.3em 0.7em 0.3em;
	border-radius: 0.2em;
	animation: fadeInUp .5s ease, fadeOut 1s ease $message_hide_delays forwards;
}

#log>div:nth-last-child(10n-9) {
	box-shadow: 0 0.2em 0.3em rgba(255, 168, 168, 1);
}

#log>div:nth-last-child(10n-8) {
	box-shadow: 0 0.2em 0.3em rgba(255, 192, 120, 1);
}

#log>div:nth-last-child(10n-7) {
	box-shadow: 0 0.2em 0.3em rgba(255, 224, 102, 1);
}

#log>div:nth-last-child(10n-6) {
	box-shadow: 0 0.2em 0.3em rgba(140, 233, 154, 1);
}

#log>div:nth-last-child(10n-5) {
	box-shadow: 0 0.2em 0.3em rgba(99, 230, 190, 1);
}

#log>div:nth-last-child(10n-4) {
	box-shadow: 0 0.2em 0.3em rgba(102, 217, 232, 1);
}

#log>div:nth-last-child(10n-3) {
	box-shadow: 0 0.2em 0.3em rgba(116, 143, 252, 1);
}

#log>div:nth-last-child(10n-2) {
	box-shadow: 0 0.2em 0.3em rgba(177, 151, 252, 1);
}

#log>div:nth-last-child(10n-1) {
	box-shadow: 0 0.2em 0.3em rgba(229, 153, 247, 1);
}

#log>div:nth-last-child(10n) {
	box-shadow: 0 0.2em 0.3em rgba(250, 162, 193, 1);
}

.name {
	font-weight: 900;
}

.colon {
	margin-right: 0.25em;
}

.message {
	color: $text_color !important;
	line-height: 1.5em;
	font-weight: 400
}

.deleted {
	visibility: hidden
}

.badge,
.colon,
.name,
.message {
	vertical-align: middle
}

.badge {
	margin-right: 0.3em;
	height: 1em
}

.message>img {
	height: 1em
}

.emote_wrap {
	position: relative
}

.emoticon {
	height: $font_sizepx;
	vertical-align: middle;
	margin: -0.1em 0;
	image-rendering: pixelated
}

/* 닉네임 가독성 해결 */
span.meta[style="color: #00FF00"] {
	color: #69db7c !important
}

span.meta[style="color: #0000FF"] {
	color: #339af0 !important
}

span.meta[style="color: #5F9EA0"] {
	color: #3bc9db !important
}

span.meta[style="color: #B22222"] {
	color: #e03131 !important
}

span.meta[style="color: #2E8B57"] {
	color: #38d9a9 !important
}

span.meta[style="color: #191970"] {
	color: #4c6ef5 !important
}

span.meta[style="color: #008000"] {
	color: #2f9e44 !important
}

span.meta[style="color: #D2691E"] {
	color: #f59f00 !important
}

span.meta[style="color: #FF0000"] {
	color: #ff6b6b !important
}

오랜만에 새 채팅 스킨을 배포합니다! 이번 스킨도 무지개인데 그림자만 무지개 색깔로 해서 만든 스킨입니다. 잘 쓰세요!

2022년 3월 수정판은 OBS의 투명 렌더링 버그로 인해 새로 수정했습니다. 완벽하진 않지만 위 사진처럼 표시하려면 OBS 브라우저에서 CSS 코드를 아래와 같이 수정해 주시기 바랍니다.

body { background: white; margin: 0px auto; overflow: hidden; }