From bb4763e50993baeb73be1c0229bb8dbeb4ef2820 Mon Sep 17 00:00:00 2001
From: sup39 <dev@sup39.dev>
Date: Thu, 18 Jan 2024 05:46:04 +0900
Subject: [PATCH] feat: configure user color with CSS

---
 src/util/colorMXID.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/util/colorMXID.js b/src/util/colorMXID.js
index 4d303aa..412af47 100644
--- a/src/util/colorMXID.js
+++ b/src/util/colorMXID.js
@@ -19,7 +19,9 @@ export function hashCode(str) {
 
 export function cssColorMXID(userId) {
   const colorNumber = hashCode(userId) % 8;
-  return `--mx-uc-${colorNumber + 1}`;
+  // @user:a.b.c => -user-a_b_c
+  const escapedUserId = userId.replace(/[@:]/g, '-').replace(/[^\w-]/g, '_');
+  return `--mx-uc-${escapedUserId}, var(--mx-uc-${colorNumber + 1})`;
 }
 
 export default function colorMXID(userId) {