Changeset 27579

Timestamp:

03/18/2014 02:29:45 AM (11 years ago)

Author:

azaozz

Message:

TinyMCE: move the caption and gallery toolbars to the right, fix selected gallery border/outline, see #27320

Location:

trunk/src/wp-includes/js/tinymce

Files:

• plugins/wpeditimage/plugin.js (modified) (3 diffs)
• skins/wordpress/wp-content.css (modified) (6 diffs)

trunk/src/wp-includes/js/tinymce/plugins/wpeditimage/plugin.js

@@ -336 +336 @@
 
     function addToolbar( node ) {
-        var position, toolbarHtml, toolbar,
+        var rectangle, toolbarHtml, toolbar, toolbarSize,
             dom = editor.dom;
 
@@ -347 +347 @@
 
         dom.setAttrib( node, 'data-wp-imgselect', 1 );
-        position = dom.getPos( node, editor.getBody() );
+        rectangle = dom.getRect( node );
 
         toolbarHtml = '<div class="dashicons dashicons-edit edit" data-mce-bogus="1"></div> ' +
@@ -359 +359 @@
 
         editor.getBody().appendChild( toolbar );
+        toolbarSize = dom.getSize( toolbar );
 
         dom.setStyles( toolbar, {
-            top: position.y,
-            left: position.x
+            top: rectangle.y,
+            left: rectangle.x + rectangle.w - toolbarSize.w
         });
     }

trunk/src/wp-includes/js/tinymce/skins/wordpress/wp-content.css

@@ -230 +230 @@
     margin-bottom: 16px;
     cursor: pointer;
+    border: 1px solid transparent;
 }
 
@@ -240 +241 @@
  .wpview-type-gallery.selected {
     background-color: #f2f8ff;
-    outline: 1px solid #777;
+    border-color: #777;
 }
 
@@ -246 +247 @@
     position: absolute;
     top: 0;
-    left: 0;
+    right: 0;
     background-color: #333;
     color: white;
@@ -274 +275 @@
 
 .gallery {
-    margin: auto;
-    padding: 0.5em 0;
+    margin: auto -6px;
+    padding: 6px 0;
     line-height: 1;
-    margin-left: -0.5em;
-    margin-right: -0.5em;
     overflow-x: hidden;
 }
@@ -286 +285 @@
     margin: 0;
     text-align: center;
-    padding: 0.5em;
+    padding: 6px;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
@@ -339 +338 @@
 
 .gallery img {
-    border: 1px solid #cfcfcf;
     max-width: 100%;
     height: auto;