Changeset 3788 for sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss

Timestamp:

08/09/2016 06:06:41 PM (8 years ago)

Author:

coffee2code

Message:

developer.wordpress.org: Add a comment preview to the front-end form for user contributed notes.

• Preview is fetched via AJAX.
• Preview updates 1.5 seconds after user stops typing.
• Adds editor toolbar button "preview note".
• Moves filtering of 'syntaxhighlighter_htmlresult' outside of just handbooks since it can also be applied elsewhere.

Props keesiemeijer.
Fixes #1865.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss (modified) (2 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss

@@ -1183 +1183 @@
         }
 
-        .comment-list li {
+        .comment-list li,
+        #comment-preview {
             margin-top: 2.5rem;
             background: #fff;
@@ -1193 +1194 @@
                 overflow: auto;
             }
+        }
+
+        #comment-preview {
+            clear:both;
+        }
+
+        #comment-preview .comment-content {
+            min-height: 6em;
+        }
+
+        #comment-preview .spinner {
+            background: url("/wp-includes/images/spinner-2x.gif") no-repeat scroll 0 50%;
+            -webkit-background-size: 20px 20px;
+            background-size: 20px 20px;
+            margin: 0 0.5em;
+            padding-left: 20px;
         }