Bug 40896: Bugzilla needs a "preview" mode for comments

2 files changed, 51 insertions, 3 deletions

diff --git a/skins/contrib/Mozilla/global.css b/skins/contrib/Mozilla/global.css
index 4d6fd7113..d47c4e2f8 100644
--- a/skins/contrib/Mozilla/global.css
+++ b/skins/contrib/Mozilla/global.css
@@ -449,11 +449,15 @@ table.edit_form hr {
 }
 
 .bz_comment {
-    width: 65em !important;
+    width: 65em;
     margin: 0 0 20px;
 }
 
-.bz_comment pre {
+.bz_comment_table .bz_comment {
+    width: 65em !important;
+}
+
+.bz_comment pre, #comment {
     font: 13px/1.2 "Droid Sans Mono", Menlo, Monaco, "Courier New", Courier, monospace;
 }
 
@@ -618,7 +622,17 @@ table.edit_form hr {
     -moz-box-sizing: content-box;
     -webkit-box-sizing: content-box;
     box-sizing: content-box;
-    margin: 5px 0 20px;
+}
+
+#comment_tabs {
+    margin-top: 2px;
+}
+
+#comment_preview_text {
+    background: transparent;
+    border: none;
+    box-shadow: none;
+    padding: 2px 2px 2px 1px;
 }
 
 #footer {
diff --git a/skins/standard/global.css b/skins/standard/global.css
index bb44a919b..25a60f750 100644
--- a/skins/standard/global.css
+++ b/skins/standard/global.css
@@ -586,6 +586,40 @@ input.required, select.required, span.required_explanation {
     margin-left: -1px;
 }
 
+.comment_tab {
+    float: left;
+    border: 1px solid silver;
+    border-bottom: 0px;
+    padding: 2px 1em;
+    cursor: pointer;
+    background: transparent;
+}
+
+.active_comment_tab {
+    background: #fff;
+    font-weight: bold;
+}
+
+#comment_preview {
+    border: 1px solid silver;
+    padding: 2px;
+    overflow: auto;
+    margin: 0px;
+}
+
+#comment_preview_text {
+    margin: 0px;
+    width: auto;
+}
+
+#comment_preview_loading {
+    font-style: italic;
+}
+
+#comment {
+    margin-top: 0px;
+}
+
 /*******************/
 /* Form Validation */
 /*******************/