Misskey Liveのコメント欄をOBSに表示する

Misskey Liveのコメント欄をOBSに表示する.md

OBSでブラウザを挿入し、次のように設定します。

• URL: 'https://live.misskey.io/live_chat/${username}'
• 幅: 620 (お好きにどうぞ)
• 高さ: 1080
• カスタム CSS: 次のファイルをコピーしてください

フォントはGenEi Univer SansとNasuが指定されていますので、お好みで変えてください。

obs.browser.css

body, html {
font-family: "GenEi Univer Sans", Nasu !important; /* フォント */
text-shadow: 0.05rem 0.05rem 0.1rem rgba(0,0,0,0.9); /* 文字の影 */
color: rgba(255, 255, 255, 0.7) !important; /* 文字色 */

background-color: rgba(0, 0, 0, 0);
margin: 0px auto; overflow: hidden;
font-size: 30px;
line-height: 1.2;
}

nav.navbar.navbar-dark.bg-grad1,
input.send,
.top-overlay,
.comment-avatar {
display: none;
background: none
}

body.bg-dark {
  background-color: rgba(255, 255, 255, 0) !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

[_ngcontent-serverapp-c34] {
height: 100% !important;
bottom: 0 !important;
padding-left: 0 !important
}

.media-body > p {
  margin-bottom: 0.2rem;
}

.media-body > h6 {
  font-weight: 700
}