Merge pull request #135 from WordPress/tinymce-single-image-animation

tinymce-single: add image animations similar to main prototype
WordPress · Feb 24, 2017 · 6a60a60 · 6a60a60
2 parents 22920b2 + 103675b
commit 6a60a60
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 7 deletions.
diff --git a/shared/index.css b/shared/index.css
@@ -30,11 +30,13 @@ body {
 }
 
 #editor figure {
+	float: none;
 	margin: 0;
+	width: 100%;
+    transition: margin 0.5s, width 0.5s;
 }
 
 #editor figure.aligncenter {
-	display: block;
 	margin-left: auto;
 	margin-right: auto;
 }

diff --git a/tinymce-single/tinymce/block.css b/tinymce-single/tinymce/block.css
@@ -187,6 +187,10 @@ div.mce-inline-toolbar-grp {
 	max-width: 98%;
 }
 
+div.mce-inline-toolbar-grp:not(.block-toolbar) {
+	transition: all 0.5s;
+}
+
 div.wp-link-preview {
 	float: left;
 	max-width: 694px;
@@ -200,12 +204,6 @@ div.wp-link-preview a {
 	font-size: 16px;
 	padding: 9px;
 	text-decoration: underline;
-	-webkit-transition-property: border, background, color;
-	transition-property: border, background, color;
-	-webkit-transition-duration: .05s;
-	transition-duration: .05s;
-	-webkit-transition-timing-function: ease-in-out;
-	transition-timing-function: ease-in-out;
 	cursor: pointer;
 }
 

diff --git a/tinymce-single/tinymce/block.js b/tinymce-single/tinymce/block.js
@@ -433,6 +433,10 @@
 						top: elementRect.top + window.pageYOffset - toolbarRect.height - 8 + 'px'
 					})
 
+					setTimeout( function() {
+						editor.nodeChanged();
+					}, 500 );
+
 					this.show()
 				}