From cdabdedfbf55ca336c1ecb5ee0f5211ee20efb44 Mon Sep 17 00:00:00 2001
From: simoleo89 <simoleo89@gmail.com>
Date: Sun, 31 May 2026 22:19:54 +0200
Subject: [PATCH] feat(mentions): dedicated toolbar icon sprite

---
 src/assets/images/toolbar/icons/mentions.png | Bin 0 -> 2252 bytes
 src/components/toolbar/ToolbarView.tsx       |   4 ++--
 src/css/icons/icons.css                      |   7 +++++++
 3 files changed, 9 insertions(+), 2 deletions(-)
 create mode 100644 src/assets/images/toolbar/icons/mentions.png

diff --git a/src/assets/images/toolbar/icons/mentions.png b/src/assets/images/toolbar/icons/mentions.png
new file mode 100644
index 0000000000000000000000000000000000000000..ca7d31dfcab33b0ca34b92d23f9f0931f60e0005
GIT binary patch
literal 2252
zcmV;-2s8JIP)<h;3K|Lk000e1NJLTq002k;002M;1^@s6xxO(f00001b5ch_0Itp)
z=>Px#1ZP1_K>z@;j|==^1poj532;bRa{vGi!vFvd!vV){sAK>D2w_P?K~#8N?VD{-
zRM#2D^D!U$vEOd*U8A5@RM1^yfn`Bhc7f$xR8Yu>HIrzQRwUEfs$fPN6VX^-0>Y|M
zUPV+?Y)n)PhNwhiCfZtKX{^(XVnl<HXq<UE&+YEr^Rf%ez1Ix8_{{tU_POUg&pH1+
z=iIlmFTC*Fp4)R9jV1`fiw1)sQxwJRk|dpyB&l1HBp5|tdrpa>=#nI<SP+C?uzh$Y
zCJ4f>L{V&zBx%q`qeeBND0UbO1`FFKT}%*!U%I~yE^)9Siej4}2w`j=Rhu9PQzc32
zWfLI_bEBZ@4_4T_!3Nz8*`tQT+tTEAEnR4W@UU@QyKx5K62bO$#AYxUY?37PlfjLV
zVbENa3im!Of~S{Df`UU^)4-89g%t^TlkIcB<{mlJTJx9X@$kd>1@QEX;-Cb-SRW&*
zfbILRhHDNvt->dagXWDkczS7J(9_eD1;*)Nq(Fm$AedMUhBRErNR<z6vBOUn7lsVi
z+VkWuo#^8wRs+B0o?1%f^}maQpFUskOnGp&5WZ;1R=D1t$Cc5WjvZ;#R10{~CPz=K
zX(9}C&xa>HMY_|q#|bMIMN^GrSzIs!j_+{5{jO)zhSE7vBO66{#YryA2REm}lM6+<
z(zV+O39}}0Vhjh?V`FLMa!VGKW7rExye#(=#yL80b{;%AU#J^z{Wg~CxQE4aq7?iI
zi1pc+T5(u^t;82aaUH7(W#rXzX?_$u{;W_p)-I#PK_NP}+Tm75K35j$@0<r+t_-;x
zS<h9G$d%Q?yJhiY{Gq2AdDB_5$_kIW=j(!NO(NCFuDW#U__YJsaIroU`cKbQeE8Wz
z%Z6mC{;gwqTn@EhTZq_$tR|F^*FML#q{8D*=V|6zYc|z6{OmdAT4SY-A@7yP`>b<u
zpHum~cBz@mqn5w#r`Mq&@BGPvm+GDH<JozdS)A{kBL8U3R{YpWG9O7<iHZ8`tIoZX
z1zavQJUCrI<-#WxtS*X?1#h%v!;f8aHSwP#IZC{`)mFui|C70p#d(pC5X~>n==T-x
z^Sv2dKDChf0v71&wk#O@q(Bp!SHvmtzWXR&_T6l!r%&Z;G0HKdti(ti#~5TxkBGIa
z61aS7Q76!WOc*>fM-#cW|KCBE6&n>_<*PAD4(#lAC-SH|HxJWm!kKD2b-Xk$(k+mM
z%cmA~0<~tsVCNi7cw!yhl+5{%=5<M29k$HPLs`@@Wd!}%!qroYDuJ%IIN{N$eARr@
z<{b$=yV7JI{v~r@8MfZl#tf>AznGmnQn|WnQ72Gy20S{Mr<xv@!z+->!TIFQ`>5CS
zmUjU!&6!Ret6k~6sJq*d!_`%bI)R$f;nByrs_Ch-dj+bqb3R!hAN3MU;mUCo#N)qO
z?;U-WuS9e8w4h3$e>SGW4<F^KrthftY;~d5F8lB=nZx7v(6p95{daD&$^I+*(jYh4
z`^fa)txhhV7Ss!LB1aRRSWRma<j;La=ra_Kmd>pyaG^F8Dwgn%K6d^wPKNY(V(AGP
zKVX5bHKf7A53@C~yl93T%VG*wd{u9FPxB+CVu^{%p$BA+zy+#zz{9^~X`=mY@07v+
z(bsp_38mT7xXvSu6&B7%9%JL{1(_#sf%ZAz;qfd@^d0ivU?Nxc*p*`_*z&?CD9xG%
z6~8e-Z&RA=KfNVc_IdnR4&!+0VT|+DHW|{d1$6>_V26QYnVM->O+9acuXd$!Wdfyr
zy>~=fjNx#nErTng22}!Gct05ijyiQ=QRY;t5jEvz_*cE1E9Z}|TsAJoxgGkoZzKXK
zZ&8nLu)@HR3|+W$APsVoCQ}VT&{wrA8X8u`!MW|TDQZ^4Kt<_Huo$U#STgPFEL;w?
z^w!gt9{5g>)kQIU<mf3_`=%MbZ_m(`jZ67c`A9&q&TX5`#nnRBmLw_%s|jVeMZ{CE
zyeJaBKb)>RH}=|K&7zrH=Z6A?sV<9w+xs0{JgwB0QxEQXSxqRzm-(K;GpCM+2Zz$0
zDW7dkg6gtau<<n$EOJIrps)T<vGC>2WUii`6xyk`8ZK57%5Z@qzqwB~S>eG!N62zx
zPYQ%jFpwi?_>BzYI`ncz1l(_Pge)tIsaHz4iQz?756<u%H93kt-e7_It@e=PYRzm2
zAMYJKq9|6eTKF|`6h%yW39eKpLI3{Lkl}Wt4N}e23xaP08a*Dvchux4vYNu+>$)W9
zZ?OeEw;NL6<#cYh*%DTRVNH^x*U2C=BF4j+cjBSH*%q{1c|VaIIXJZ%*uDpB?tRcy
zz_Pj1;QG!)xYv|IabT4h%#jlyV$wLsPnt}zvS>Q2FO5?8>oOypSRY66&92#8OufL^
zm>1i|^ykuurj{=wuZ>9Nr%Z;LH;iy%T`b&dOqNF&TShHm;|)+z5-G=3OXu5huzN)`
zEXkZA$76Hg$k8m0$K1PJzh#pIDR{s6I@?FhhHAUlrC=3m5KrYpZcfm{h~H`8ULtA_
z^(X{I!Jkh2e81Q5Ww^DUY*<5iG<;ZT9+u_#^fMj=JA{`RS{U)R-k-zBPJa1bJlx%r
zI3#NpOy|VWwDWzm8zs=@c(}Ve(I@|{wL*!Vdw8bLZzo2xQ37p>gT7r>4)oh*aZd<)
zac?#oFXW68s45ovTnQ8>D`&xsDKD|&bPxH6Gn9-HXrmeW>MRQNzn{rntm%5877Rvq
z{_?wKxKnG9SzXAVsX}@&_Ggqp@5I2Z?Qu|So5Tte`irqYBZWA=(g?QbF}fK0Gg6F*
ziQHZD*jbGI86$|om|Kkf87qvNv9}oeGv@cLV|Ow3XYRXZ6lZKN#{SIx7zFR6pRYG#
a#r_AH;i9XxVk=w#0000<MNUMnLSTYNh+75#

literal 0
HcmV?d00001

diff --git a/src/components/toolbar/ToolbarView.tsx b/src/components/toolbar/ToolbarView.tsx
index cc7d7c6..e8ad69a 100644
--- a/src/components/toolbar/ToolbarView.tsx
+++ b/src/components/toolbar/ToolbarView.tsx
@@ -336,7 +336,7 @@ export const ToolbarView: FC<{ isInRoom: boolean }> = props =>
                     </motion.div>
                     { mentionsEnabled &&
                         <motion.div variants={ itemVariants } className="relative">
-                            <ToolbarItemView icon="message" onClick={ () => CreateLinkEvent('mentions/toggle') } className="tb-icon" />
+                            <ToolbarItemView icon="mentions" onClick={ () => CreateLinkEvent('mentions/toggle') } className="tb-icon" />
                             { (mentionsUnread > 0) &&
                                 <LayoutItemCountView count={ mentionsUnread } className="absolute -right-2 -top-1" /> }
                         </motion.div> }
@@ -432,7 +432,7 @@ export const ToolbarView: FC<{ isInRoom: boolean }> = props =>
                     </motion.div>
                     { mentionsEnabled &&
                         <motion.div variants={ itemVariants } className="relative">
-                            <ToolbarItemView icon="message" onClick={ () => CreateLinkEvent('mentions/toggle') } className="tb-icon" />
+                            <ToolbarItemView icon="mentions" onClick={ () => CreateLinkEvent('mentions/toggle') } className="tb-icon" />
                             { (mentionsUnread > 0) &&
                                 <LayoutItemCountView count={ mentionsUnread } className="absolute -right-2 -top-1" /> }
                         </motion.div> }
diff --git a/src/css/icons/icons.css b/src/css/icons/icons.css
index 17a903f..7245da9 100644
--- a/src/css/icons/icons.css
+++ b/src/css/icons/icons.css
@@ -229,6 +229,13 @@
     height: 32px;
 }
 
+.nitro-icon.icon-mentions {
+    background-image: url("@/assets/images/toolbar/icons/mentions.png");
+    background-size: contain;
+    width: 36px;
+    height: 32px;
+}
+
 .nitro-icon.icon-wired-tools {
     background-image: url("@/assets/images/wiredtools/wired_menu.png");
     background-size: contain;