Project

General

Profile

Actions

Defect #42773

closed

Padding in the Preview tab is larger than in the actual rendered content

Added by Mizuki ISHIKAWA 5 days ago. Updated 2 days ago.

Status:
Closed
Priority:
Normal
Assignee:
Category:
UI
Target version:
Start date:
Due date:
% Done:

0%

Estimated time:
Resolution:
Fixed
Affected version:

Description

The paragraph padding is larger in preview mode than in the saved view.

This is caused by extra padding applied to p elements in .wiki-preview, such as in .tabular .wiki-preview p. Since this difference can be confusing, the styles were adjusted to match the saved view.
Also, the rules for .jstBlock .wiki-preview p:first-child and p:last-child were affecting paragraphs inside alert blocks (like .note-1). The selectors were updated to apply only to p elements that are direct children of .wiki-preview.
These issues are fixed by the attached patch. This patch mainly adjusts the layout during preview, and does not change the appearance of the saved view.

Before change After change
preview
saved view

Files

after_preview.png (156 KB) after_preview.png Mizuki ISHIKAWA, 2025-05-26 05:58
after_saved.png (160 KB) after_saved.png Mizuki ISHIKAWA, 2025-05-26 05:58
before_saved.png (160 KB) before_saved.png Mizuki ISHIKAWA, 2025-05-26 05:58
before_preview.png (153 KB) before_preview.png Mizuki ISHIKAWA, 2025-05-26 05:58
align-preview-and-saved-padding.diff (1.48 KB) align-preview-and-saved-padding.diff Mizuki ISHIKAWA, 2025-05-26 06:22
screenshot 2025-05-28 11.23.14.png (121 KB) screenshot 2025-05-28 11.23.14.png Mizuki ISHIKAWA, 2025-05-28 07:21
screenshot 2025-05-28 11.22.47.png (121 KB) screenshot 2025-05-28 11.22.47.png Mizuki ISHIKAWA, 2025-05-28 07:21
screenshot 2025-05-28 11.23.31.png (128 KB) screenshot 2025-05-28 11.23.31.png Mizuki ISHIKAWA, 2025-05-28 07:21
Actions #1

Updated by Go MAEDA 4 days ago

  • Tracker changed from Patch to Defect
  • Subject changed from Padding is larger in preview than after saving to Padding in the Preview tab is larger than in the actual rendered content
  • Status changed from New to Confirmed
  • Target version set to 6.0.6

Setting the target version to 6.0.6.

Actions #2

Updated by Go MAEDA 4 days ago

  • Status changed from Confirmed to Resolved
  • Assignee set to Go MAEDA
  • Resolution set to Fixed

Committed the fix in r23800. Thank you.

Actions #3

Updated by Go MAEDA 4 days ago

  • Status changed from Resolved to Closed

Merged the fix into 6.0-stable branch in r23801.

Actions #4

Updated by Mizuki ISHIKAWA 2 days ago

It was discovered that the changes made in this issue caused the padding in the board view of the project list to become larger.
The following diff can be applied to fix it. This fix was assisted by Katsuya HIDAKA.

diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index 26e719cbb..e6ca6f736 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -936,6 +936,9 @@ ul.projects div.description ul li {list-style-type:initial;}
 #projects-index a.project ~ svg, table.projects tr.project td.name svg {
   margin-left: 4px;
 }
+#projects-index li p {
+  margin-top: 0px;
+}

 #notified-projects>ul, #tracker_project_ids>ul, #custom_field_project_ids>ul {max-height:250px; overflow-y:auto;}

Before applying the changes from this issue After applying the changes from this issue After applying the fix with the diff below
Actions #5

Updated by Go MAEDA 2 days ago

Mizuki ISHIKAWA wrote in #note-4:

It was discovered that the changes made in this issue caused the padding in the board view of the project list to become larger.

Committed the suggested fix in r23805 and r23806. Thank you.

Actions

Also available in: Atom PDF