From 1994ca12b08703d9f40819bfca0ddaeb9c5e50a7 Mon Sep 17 00:00:00 2001
From: wintan1418 <wintan1418@gmail.com>
Date: Thu, 30 Jul 2026 15:33:28 +0100
Subject: [PATCH 1/2] Render emphasis upright inside italic blockquotes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Blockquotes are styled italic, and emphasized text inside them picked up
the same font-style, leaving <em> visually indistinguishable from the
surrounding quote. Follow the typographic convention of flipping nested
emphasis back to upright so it stands out by contrast.

The rule targets both plain <em> tags (exported Action Text content) and
.lexxy-content__italic (the editor's theme class, which also covers
bold+italic runs rendered as <strong class="…__italic">).

Fixes #939
---
 app/assets/stylesheets/lexxy-content.css      |  5 ++++
 .../blockquote_nested_emphasis.test.js        | 29 +++++++++++++++++++
 2 files changed, 34 insertions(+)
 create mode 100644 test/browser/tests/formatting/blockquote_nested_emphasis.test.js

diff --git a/app/assets/stylesheets/lexxy-content.css b/app/assets/stylesheets/lexxy-content.css
index 6a06d9539..5a5b61677 100644
--- a/app/assets/stylesheets/lexxy-content.css
+++ b/app/assets/stylesheets/lexxy-content.css
@@ -77,6 +77,11 @@
     margin: var(--lexxy-content-margin) 0;
     padding: 0.5lh 2ch;
 
+    em,
+    .lexxy-content__italic {
+      font-style: normal;
+    }
+
     p:last-child {
       margin-block-end: 0;
     }
diff --git a/test/browser/tests/formatting/blockquote_nested_emphasis.test.js b/test/browser/tests/formatting/blockquote_nested_emphasis.test.js
new file mode 100644
index 000000000..dbafbd398
--- /dev/null
+++ b/test/browser/tests/formatting/blockquote_nested_emphasis.test.js
@@ -0,0 +1,29 @@
+import { test } from "../../test_helper.js"
+import { expect } from "@playwright/test"
+
+test.describe("Emphasis inside blockquotes", () => {
+  test.beforeEach(async ({ page }) => {
+    await page.goto("/")
+    await page.waitForSelector("lexxy-editor[connected]")
+  })
+
+  test("renders emphasized text upright inside an italic blockquote", async ({ editor }) => {
+    await editor.setValue("<blockquote><p>Quoted <em>emphasized</em> text</p></blockquote>")
+    await editor.flush()
+
+    const paragraph = editor.content.locator("blockquote p")
+    const emphasis = editor.content.locator("blockquote em")
+
+    await expect(paragraph).toHaveCSS("font-style", "italic")
+    await expect(emphasis).toHaveCSS("font-style", "normal")
+  })
+
+  test("renders bold emphasized text upright inside an italic blockquote", async ({ editor }) => {
+    await editor.setValue("<blockquote><p>Quoted <strong><em>emphasized</em></strong> text</p></blockquote>")
+    await editor.flush()
+
+    const emphasis = editor.content.locator("blockquote .lexxy-content__italic")
+
+    await expect(emphasis).toHaveCSS("font-style", "normal")
+  })
+})

From 2cea824e0616ab1b4bbf8b9e544354284b750c5d Mon Sep 17 00:00:00 2001
From: wintan1418 <wintan1418@gmail.com>
Date: Thu, 30 Jul 2026 19:52:34 +0100
Subject: [PATCH 2/2] Assert the quote stays italic alongside the upright bold
 emphasis

Guards against a regression where the blockquote's own italic styling
changes and the nested-emphasis test would still pass.
---
 .../browser/tests/formatting/blockquote_nested_emphasis.test.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/test/browser/tests/formatting/blockquote_nested_emphasis.test.js b/test/browser/tests/formatting/blockquote_nested_emphasis.test.js
index dbafbd398..647173811 100644
--- a/test/browser/tests/formatting/blockquote_nested_emphasis.test.js
+++ b/test/browser/tests/formatting/blockquote_nested_emphasis.test.js
@@ -22,8 +22,10 @@ test.describe("Emphasis inside blockquotes", () => {
     await editor.setValue("<blockquote><p>Quoted <strong><em>emphasized</em></strong> text</p></blockquote>")
     await editor.flush()
 
+    const paragraph = editor.content.locator("blockquote p")
     const emphasis = editor.content.locator("blockquote .lexxy-content__italic")
 
+    await expect(paragraph).toHaveCSS("font-style", "italic")
     await expect(emphasis).toHaveCSS("font-style", "normal")
   })
 })