From ba4ae5badbeca228559c1cffa2cc4cbc5c752be6 Mon Sep 17 00:00:00 2001
From: ilja <git@ilja.space>
Date: Sat, 10 Aug 2024 12:45:37 +0200
Subject: [PATCH] Fix MFM functions x2, x3, and x4

These now work for the new, FEP-c16b compliant, representation
Nesting also works

It already worked for text and "normal" emoji, but now it also works for custom emoji
---
 src/components/status_body/status_body.scss |  1 +
 src/components/status_content/mfm.scss      | 28 +++++++++++++++++++++
 2 files changed, 29 insertions(+)

diff --git a/src/components/status_body/status_body.scss b/src/components/status_body/status_body.scss
index b9e328c8..dd1b62a5 100644
--- a/src/components/status_body/status_body.scss
+++ b/src/components/status_body/status_body.scss
@@ -12,6 +12,7 @@
   }
   .emoji {
     --_still_image-label-scale: 0.5;
+    /* NOTE: We also use this value hard-coded in src/components/status_content/mfm.scss */
     --emoji-size: 38px;
   }
 
diff --git a/src/components/status_content/mfm.scss b/src/components/status_content/mfm.scss
index f5d77938..3bcd84f3 100644
--- a/src/components/status_content/mfm.scss
+++ b/src/components/status_content/mfm.scss
@@ -63,14 +63,35 @@
 
   .mfm-x2 {
     --mfm-zoom-size: 200%;
+    /*
+     emoji is normally 38px (see src/components/status_body/status_body.scss
+     we want x2 to be ~100px, so we enlarge (100px/38px) ~= 2.63
+    */
+    .emoji {
+      --mfm-emoji-zoom-size: 2.63;
+    }
   }
 
   .mfm-x3 {
     --mfm-zoom-size: 400%;
+    /*
+     emoji is normally 38px (see src/components/status_body/status_body.scss
+     we want x3 to be ~150px, so we enlarge (150px/38px) ~= 3.95
+    */
+    .emoji {
+      --mfm-emoji-zoom-size: 3.95;
+    }
   }
 
   .mfm-x4 {
     --mfm-zoom-size: 600%;
+    /*
+     emoji is normally 38px (see src/components/status_body/status_body.scss
+     we want x4 to be ~200px, so we enlarge (200px/38px) ~= 5.26
+    */
+    .emoji {
+      --mfm-emoji-zoom-size: 5.26;
+    }
   }
 
   .mfm-x2,
@@ -78,6 +99,10 @@
   .mfm-x4,
   .mfm-tada {
     font-size: var(--mfm-zoom-size);
+    .emoji {
+      --nested-emoji-base-size: calc(var(--emoji-size) * var(--mfm-emoji-zoom-size));
+      height: var(--nested-emoji-base-size);
+    }
 
     .mfm-x2,
     .mfm-x3,
@@ -85,6 +110,9 @@
     .mfm-tada {
       /* only half effective */
       font-size: calc(var(--mfm-zoom-size) / 2 + 50%);
+      .emoji {
+        height: calc(var(--nested-emoji-base-size) * var(--mfm-emoji-zoom-size) / 2);
+      }
 
       .mfm-x2,
       .mfm-x3,