Changeset 33285

Timestamp:

07/15/2015 09:30:09 PM (9 years ago)

Author:

iseulde

Message:

TinyMCE: fix visual regressions

See #32801.

Location:

trunk/src

Files:

• wp-admin/css/colors/_admin.scss (modified) (1 diff)
• wp-includes/css/editor.css (modified) (9 diffs)

trunk/src/wp-admin/css/colors/_admin.scss

@@ -530 +530 @@
     color: $menu-icon;
 }
+
+/* TinyMCE */
+
+.mce-container.mce-menu .mce-menu-item:hover,
+.mce-container.mce-menu .mce-menu-item.mce-selected,
+.mce-container.mce-menu .mce-menu-item:focus,
+.mce-container.mce-menu .mce-menu-item-normal.mce-active {
+    background: $highlight-color;
+}

trunk/src/wp-includes/css/editor.css

@@ -181 +181 @@
 }
 
+.mce-menu,
 .mce-floatpanel.mce-popover.mce-bottom {
     margin-top: 2px;
@@ -370 +371 @@
     border: 1px solid transparent;
     margin: 2px;
-    background-image: none;
     -webkit-border-radius: 2px;
     border-radius: 2px;
@@ -428 +428 @@
 
 .mce-toolbar .mce-listbox button {
+    font-size: 13px;
+    line-height: 20px;
+    padding-left: 6px;
     padding-right: 20px;
 }
@@ -465 +468 @@
 
 .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:hover {
-    background-image: none;
-    border-color: #b4b9be;
-}
-
-.mce-toolbar .mce-btn-group .mce-btn.mce-listbox span {
-    font-size: 13px;
+    border-color: #b4b9be;
 }
 
@@ -501 +499 @@
 }
 
-.mce-toolbar .mce-splitbtn .mce-open.mce-active{
-    -webkit-box-shadow: none;
-    box-shadow: none;
-}
-
-.mce-menu .mce-menu-item-normal.mce-active {
-    background-color: #e5e5e5;
-    -webkit-filter: none;
-    filter: none;
+.mce-toolbar .mce-splitbtn .mce-open.mce-active {
+    background: transparent;
+    outline: none;
 }
 
 .mce-menu .mce-menu-item:hover,
 .mce-menu .mce-menu-item.mce-selected,
-.mce-menu .mce-menu-item:focus {
-    color: #000;
-    background-color: #b4b9be;
-    background-image: none;
-    -webkit-filter: none;
-    filter: none;
-}
-
-.mce-menu .mce-menu-item:hover .mce-ico,
-.mce-menu .mce-menu-item.mce-selected .mce-ico,
-.mce-menu .mce-menu-item:focus .mce-ico,
-.mce-menu .mce-menu-item:hover .mce-text,
-.mce-menu .mce-menu-item.mce-active:hover .mce-text,
-.mce-menu .mce-menu-item.mce-selected .mce-text {
-    color: #000;
+.mce-menu .mce-menu-item:focus,
+.mce-menu .mce-menu-item-normal.mce-active {
+    background: #0073aa; /* See color scheme. */
+}
+
+.mce-menu .mce-menu-item.mce-disabled {
+    cursor: default;
+}
+
+.mce-menu .mce-menu-item.mce-disabled:hover {
+    background: #ccc;
 }
 
@@ -538 +526 @@
 }
 
-.mce-menubar .mce-btn:focus {
-    outline: 0;
+.mce-menubar .mce-menubtn {
+    margin: 2px;
+}
+
+.mce-menubar .mce-menubtn:hover,
+.mce-menubar .mce-menubtn.mce-active,
+.mce-menubar .mce-menubtn:focus {
+    border-color: transparent;
+    background: transparent;
+    filter: none;
+}
+
+.mce-menubar .mce-menubtn:focus {
+    color: #124964;
+    -webkit-box-shadow:
+        0 0 0 1px #5b9dd9,
+        0 0 2px 1px rgba(30, 140, 190, .8);
+    box-shadow:
+        0 0 0 1px #5b9dd9,
+        0 0 2px 1px rgba(30, 140, 190, .8);
 }
 
 div.mce-menu .mce-menu-item-sep,
 .mce-menu-item-sep:hover {
-    margin: 5px 0 4px;
+    border-bottom: 1px solid #ddd;
+    height: 0px;
+    margin: 5px 0;
 }
 
@@ -583 +591 @@
     -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 );
     box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 );
-    background-image: none;
 }
 
@@ -677 +684 @@
 }
 
-.mce-menubtn.mce-fixed-width button span {
-    max-width: 80px;
-    padding-right: 16px;
+.mce-menubtn.mce-fixed-width button {
+    overflow-x: hidden;
+    text-overflow: ellipsis;
+    width: 110px;
 }
 
@@ -709 +717 @@
 
 .mce-tooltip-inner {
+    -webkit-border-radius: 3px;
+    border-radius: 3px;
     -webkit-box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 );
     box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 );