From c698dec89d2a2264a0a8fb73a7bf373afb8dc45b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 19 Dec 2024 14:43:27 +0200
Subject: [PATCH] fix emoji size incosistencies and proper scaling support

---
 changelog.d/emoji-size.fix                             | 1 +
 src/components/basic_user_card/basic_user_card.vue     | 2 +-
 src/components/chat_title/chat_title.vue               | 2 +-
 src/components/notification/notification.scss          | 2 +-
 src/components/status/status.scss                      | 2 +-
 src/components/status_body/status_body.scss            | 2 +-
 src/components/user_list_popover/user_list_popover.vue | 2 +-
 7 files changed, 7 insertions(+), 6 deletions(-)
 create mode 100644 changelog.d/emoji-size.fix

diff --git a/changelog.d/emoji-size.fix b/changelog.d/emoji-size.fix
new file mode 100644
index 00000000..a1189b83
--- /dev/null
+++ b/changelog.d/emoji-size.fix
@@ -0,0 +1 @@
+fix emoji inconsistencies in notifications, fix some emoji not scaling with interface
diff --git a/src/components/basic_user_card/basic_user_card.vue b/src/components/basic_user_card/basic_user_card.vue
index 9e2b0295..29a60cd1 100644
--- a/src/components/basic_user_card/basic_user_card.vue
+++ b/src/components/basic_user_card/basic_user_card.vue
@@ -48,7 +48,7 @@
   flex: 1 0;
   margin: 0;
 
-  --emoji-size: 14px;
+  --emoji-size: 1em;
 
   &-collapsed-content {
     margin-left: 0.7em;
diff --git a/src/components/chat_title/chat_title.vue b/src/components/chat_title/chat_title.vue
index 68ee7a5a..0213b86f 100644
--- a/src/components/chat_title/chat_title.vue
+++ b/src/components/chat_title/chat_title.vue
@@ -32,7 +32,7 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 
-  --emoji-size: 14px;
+  --emoji-size: 1em;
 
   .username {
     max-width: 100%;
diff --git a/src/components/notification/notification.scss b/src/components/notification/notification.scss
index 0ca6aea7..d46b25be 100644
--- a/src/components/notification/notification.scss
+++ b/src/components/notification/notification.scss
@@ -10,7 +10,7 @@
     background-color: transparent !important;
   }
 
-  --emoji-size: 14px;
+  --emoji-size: 1em;
 
   &:hover {
     --_still-image-img-visibility: visible;
diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index 344e4b8e..85ad24b3 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -72,7 +72,7 @@
     text-overflow: ellipsis;
 
     --_still_image-label-scale: 0.25;
-    --emoji-size: 14px;
+    --emoji-size: 1em;
   }
 
   .status-favicon {
diff --git a/src/components/status_body/status_body.scss b/src/components/status_body/status_body.scss
index 0a467b4f..cc66dc5a 100644
--- a/src/components/status_body/status_body.scss
+++ b/src/components/status_body/status_body.scss
@@ -113,7 +113,7 @@
     align-items: top;
     flex-direction: row;
 
-    --emoji-size: 16px;
+    --emoji-size: calc(var(--emojiSize, 32px) / 2);
 
     & .body,
     & .attachments {
diff --git a/src/components/user_list_popover/user_list_popover.vue b/src/components/user_list_popover/user_list_popover.vue
index cd134453..293a4709 100644
--- a/src/components/user_list_popover/user_list_popover.vue
+++ b/src/components/user_list_popover/user_list_popover.vue
@@ -51,7 +51,7 @@
 .user-list-popover {
   padding: 0.5em;
 
-  --emoji-size: 16px;
+  --emoji-size: calc(var(--emojiSize, 32px) / 2);
 
   .user-list-row {
     padding: 0.25em;