From 12af25b94817c2cc1d9e899ea017c13d8582a7b3 Mon Sep 17 00:00:00 2001
From: nuttylmao <nuttylmao@gmail.com>
Date: Mon, 22 Sep 2025 09:37:21 +1000
Subject: [PATCH] Added custom styling for moderators and subscribers

---
 horizontal-chat/script.js   | 22 ++++++++++++++++++++++
 horizontal-chat/style.css   |  2 +-
 multichat-overlay/script.js | 21 +++++++++++++++++++++
 multichat-overlay/style.css |  2 +-
 4 files changed, 45 insertions(+), 2 deletions(-)

diff --git a/horizontal-chat/script.js b/horizontal-chat/script.js
index 9510918..593b1ea 100644
--- a/horizontal-chat/script.js
+++ b/horizontal-chat/script.js
@@ -591,6 +591,17 @@ async function TwitchChatMessage(data) {
 		avatarDiv.appendChild(avatar);
 	}
 
+	// Custom styling for subs
+	if (data.message.subscriber) {
+		usernameDiv.classList.add('sub-glow')
+	}
+
+	// Custom styling for mods
+	// 3 = Moderator
+	if (role == 3) {
+		usernameDiv.classList.add('moderator-glow')
+	}
+
 	// Hide the header if the same username sends a message twice in a row
 	const messageList = document.getElementById("messageList");
 	if (groupConsecutiveMessages && messageList.children.length > 0) {
@@ -939,6 +950,17 @@ function YouTubeMessage(data) {
 		avatarDiv.appendChild(avatar);
 	}
 
+	// Custom styling for subs
+	if (data.user.isSponsor) {
+		usernameDiv.classList.add('sub-glow')
+	}
+
+	// Custom styling for mods
+	// 3 = Moderator
+	if (data.user.isModerator) {
+		usernameDiv.classList.add('moderator-glow')
+	}
+
 	// Hide the header if the same username sends a message twice in a row
 	const messageList = document.getElementById("messageList");
 	if (groupConsecutiveMessages && messageList.children.length > 0) {
diff --git a/horizontal-chat/style.css b/horizontal-chat/style.css
index c6d355f..50553da 100644
--- a/horizontal-chat/style.css
+++ b/horizontal-chat/style.css
@@ -114,7 +114,7 @@ html {
 
 li {
 	list-style: none;
-	overflow: hidden;
+	/* overflow: hidden; */
 	max-width: 0px;
 	transition: all 1s ease-in-out;
 }
diff --git a/multichat-overlay/script.js b/multichat-overlay/script.js
index bb0be87..7671296 100644
--- a/multichat-overlay/script.js
+++ b/multichat-overlay/script.js
@@ -690,6 +690,17 @@ async function TwitchChatMessage(data) {
 		avatarDiv.appendChild(avatar);
 	}
 
+	// Custom styling for subs
+	if (data.message.subscriber) {
+		usernameDiv.classList.add('sub-glow')
+	}
+
+	// Custom styling for mods
+	// 3 = Moderator
+	if (role == 3) {
+		usernameDiv.classList.add('moderator-glow')
+	}
+
 	// Hide the header if the same username sends a message twice in a row
 	// EXCEPT when the scroll direction is set to reverse (scrollDirection == 2)
 	const messageList = document.getElementById("messageList");
@@ -1334,6 +1345,16 @@ async function YouTubeMessage(data) {
 		avatarDiv.appendChild(avatar);
 	}
 
+	// Custom styling for subs
+	if (data.user.isSponsor) {
+		usernameDiv.classList.add('sub-glow')
+	}
+
+	// Custom styling for mods
+	// 3 = Moderator
+	if (data.user.isModerator) {
+		usernameDiv.classList.add('moderator-glow')
+	}
 
 	// Hide the header if the same username sends a message twice in a row
 	// EXCEPT when the scroll direction is set to reverse (scrollDirection == 2)
diff --git a/multichat-overlay/style.css b/multichat-overlay/style.css
index 98a4505..6bb465e 100644
--- a/multichat-overlay/style.css
+++ b/multichat-overlay/style.css
@@ -60,7 +60,7 @@ html {
 
 li {
 	list-style: none;
-	overflow: hidden;
+	/* overflow: hidden; */
 	max-height: 0;
 	margin: 10px 0px 0px 0px;
 	transition: all 1s ease-in-out;