Defect #27862
closed
Preformatted text overflows in preview
Added by Kenan Dervisevic over 6 years ago. Updated over 6 years ago.
0%
Description
If user uses pre in his note and the note has some long text, it overflows over the sidebar on the right.
Files
| issue_notes overflow.png (101 KB) issue_notes overflow.png | Long note overflow with pre | Kenan Dervisevic, 2017-12-28 14:39 | |
| 27862-patch.diff (590 Bytes) 27862-patch.diff | patch made from Mizuki Ishikawa's post | Go MAEDA, 2018-01-18 04:48 |
Updated by Kenan Dervisevic over 6 years ago
I should note this happens in the preview panel
Updated by Mizuki ISHIKAWA over 6 years ago
It is not preferable that the display at preview is different from the actual display.
I think adding this code will solve this problem.
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index e194ccd78..385869fab 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -718,6 +718,7 @@ input#time_entry_comments { width: 90%;}
input#months { width: 30px; }
#preview fieldset {margin-top: 1em; background: url(../images/draft.png)}
+fieldset.preview { min-width: inherit; }
.tabular.settings p{ padding-left: 300px; }
.tabular.settings label{ margin-left: -300px; width: 295px; }
Updated by Go MAEDA over 6 years ago
- Status changed from New to Confirmed
I confirmed the problem and the patch submitted in #27862#note-2 works fine for me. But I think we can use the existing selector "#preview fieldset" instead of adding "fieldset.preview", don't we?
Index: public/stylesheets/application.css
===================================================================
--- public/stylesheets/application.css (revision 17180)
+++ public/stylesheets/application.css (working copy)
@@ -717,7 +717,7 @@
input#time_entry_comments { width: 90%;}
input#months { width: 30px; }
-#preview fieldset {margin-top: 1em; background: url(../images/draft.png)}
+#preview fieldset {margin-top: 1em; min-width: inherit; background: url(../images/draft.png)}
.tabular.settings p{ padding-left: 300px; }
.tabular.settings label{ margin-left: -300px; width: 295px; }
Updated by Mizuki ISHIKAWA over 6 years ago
When using the selector "#preview fieldset", the style was not applied to the preview screen for editing existing notes.
Therefore, I prepared a new selector "fieldset.preview".
Updated by Go MAEDA over 6 years ago
Mizuki ISHIKAWA wrote:
When using the selector "#preview fieldset", the style was not applied to the preview screen for editing existing notes.
Thank you for the explanation, I confirmed what you wrote. I noticed that the preview area when editing an existing note doesn't have "DRAFT" background image. Your patch also fixes that.
Maybe you can put the two lines of CSS together as follows. Mizuki, could you review this?
Index: public/stylesheets/application.css
===================================================================
--- public/stylesheets/application.css (revision 17180)
+++ public/stylesheets/application.css (working copy)
@@ -717,7 +717,7 @@
input#time_entry_comments { width: 90%;}
input#months { width: 30px; }
-#preview fieldset {margin-top: 1em; background: url(../images/draft.png)}
+fieldset.preview {margin-top: 1em; min-width: inherit; background: url(../images/draft.png)}
.tabular.settings p{ padding-left: 300px; }
.tabular.settings label{ margin-left: -300px; width: 295px; }
Updated by Mizuki ISHIKAWA over 6 years ago
Go MAEDA wrote:
I noticed that the preview area when editing an existing note doesn't have "DRAFT" background image. Your patch also fixes that.
Maybe you can put the two lines of CSS together as follows. Mizuki, could you review this?
Thank you for fixing the code I wrote.
I confirmed that the code works as expected. This makes it possible to equalize the layout of the preview panel.
Updated by Go MAEDA over 6 years ago
- File 27862-patch.diff 27862-patch.diff added
- Target version set to 3.3.7
- Affected version changed from 3.4.3 to 3.3.6
I confirmed that the patch also works as expected for news and wiki.
Setting target version to 3.3.7.
Updated by Go MAEDA over 6 years ago
- Subject changed from Issue notes overflow when using pre to Preformatted text overflows in preview
- Status changed from Confirmed to Resolved
- Assignee set to Go MAEDA
- Resolution set to Fixed
Committed. Thank you all for reporting and fixing this issue.
Updated by Go MAEDA over 6 years ago
- Status changed from Resolved to Closed
Merged to stable branches.