
@font-face {
font-family: 'NeoDunggeunmo';
src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.3/NeoDunggeunmo.woff') format('woff');
font-style: normal;
font-weight: normal;
}
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 'NeoDunggeunmo', monospace;
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: #000;
box-shadow: 0 0 0 0.15em #fff, 0 0 0 0.3em #000;
margin: 0.8em 0.7em;
padding: 0.3em 0.4em;
padding-bottom: 0.3em;
line-height: 1.2em;
animation: fadeInUp .5s ease, fadeOut 1s ease $message_hide_delays forwards;
-webkit-animation: fadeInUp .5s ease, fadeOut 1s ease $message_hide_delays forwards
}
.badge {
padding: 0.05em;
}
.meta {
font-weight: 600;
margin-right: 0.3em
}
.deleted {
visibility: hidden
}
.message {
color: $text_color !important;
word-wrap: break-word;
}
.badge,
.colon,
.name {
vertical-align: middle
}
img {
width: 1em;
margin-right: 0.3em;
vertical-align: middle !important
}
/* 닉네임 가독성 해결 */
span.meta[style="color: #00FF00"] {
color: #3FD83F !important
}
span.meta[style="color: #0000FF"] {
color: #4586FF !important
}
span.meta[style="color: #5F9EA0"] {
color: #56BFA8 !important
}
span.meta[style="color: #B22222"] {
color: #FB6767 !important
}
span.meta[style="color: #2E8B57"] {
color: #1CE048 !important
}
span.meta[style="color: #191970"] {
color: #8383DE !important
}
span.meta[style="color: #008000"] {
color: #49CC49 !important
}
span.meta[style="color: #D2691E"] {
color: #DC8444 !important
}
span.meta[style="color: #FF0000"] {
color: #FF4A4A !important
}
옛날 느낌이 나는 스킨을 만들까 생각해서 만들었습니다! 아마 이런 느낌을 좋아하시는 분들이 있지 않을까 생각했기 때문에, 옛날 컴퓨터 화면을 참고해서 직접 제작했어요
레트로 스킨에서 쓰인 글꼴의 저작권은 Neo 둥근모 프로젝트에 있습니다
2022년 5월 수정판은 폰트 미적용 문제로 코드 수정 했습니다
트위치에서 방송하고있는 푸른리피아 입니다
채팅 스킨을 찾다가 너무 이뻐서 사용하려고 댓글 남깁니다
더 좋은 스킨 많이 만들어주세요 ㅎㅎ
좋아요Liked by 1명
트위치에서 방송하고있는 둥그레입니다 🙂 채팅 css를 찾던 중 정말 마음에 드는 채팅 스킨을 발견하여 사용하고싶어 댓글 납깁니다! 좋은 스킨 감사합니다💜
좋아요좋아요
트위치에서 방송하는 지오시입니다 ! 도트 애니메이션이나 작품들을 좋아하는데 챗박스가 너무 레트로 하고 마음에 들어서 댓글 남깁니다 ! 북마크 추가해놓고 다음 작품 기다리겠습니다 !
좋아요좋아요
예전글에 죄송하지만 적용하려고 했더니 폰트가 적용이 안되서요.. 혹시 어떻게 해결할 수 있을지 알 수 있을까요?
좋아요좋아요
CSS 소스 코드 수정했습니다! 해당 폰트 링크가 만료되어서 새로 수정했습니다
좋아요좋아요
이제 확인했네요 잘됩니다 너무 감사합니다!!
좋아요좋아요
좋은 챗창 너무 감사해요! 잘 사용하겠습니다!ㅎㅎ
좋아요좋아요
멋진 작품 감사합니다~! 감사히 사용하도록 할게요❤❤❤❤언젠가 배경 까만색이 살짝 투명한 버젼도 나오면 좋을 것 같아요~!~!!
좋아요좋아요
사용해 주셔서 감사합니다!
배경색이 살짝 투명하게 만드려면 다음 코드를 수정해 주시면 됩니다
#log div 안에 있는 background: #000; 가 있는데
#000를 rgba(0, 0, 0, .75)로 바꾸시면 살짝 투명하게 가능합니다!
좋아요좋아요
이번에 방송 시작하게 되었는데 레트로 느낌 너무 이뻐서 사용하고싶어요!
좋아요좋아요