TinyMCE: fix visual regressions

See #32801.


git-svn-id: https://develop.svn.wordpress.org/trunk@33285 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Ella Iseulde Van Dorpe 2015-07-15 21:30:09 +00:00
parent 9c9b61e7da
commit c0e3449295
2 changed files with 55 additions and 36 deletions

View File

@ -529,3 +529,12 @@ div#wp-responsive-toggle a:before {
.wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle .ab-icon:before {
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;
}

View File

@ -180,6 +180,7 @@
box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 );
}
.mce-menu,
.mce-floatpanel.mce-popover.mce-bottom {
margin-top: 2px;
}
@ -369,7 +370,6 @@ div.mce-path {
.qt-dfw {
border: 1px solid transparent;
margin: 2px;
background-image: none;
-webkit-border-radius: 2px;
border-radius: 2px;
-webkit-filter: none;
@ -427,6 +427,9 @@ div.mce-path {
}
.mce-toolbar .mce-listbox button {
font-size: 13px;
line-height: 20px;
padding-left: 6px;
padding-right: 20px;
}
@ -464,14 +467,9 @@ div.mce-path {
}
.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;
}
.mce-panel .mce-btn i.mce-caret {
border-top: 6px solid #777;
margin-left: 2px;
@ -500,34 +498,24 @@ div.mce-path {
border-right-color: transparent;
}
.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:focus,
.mce-menu .mce-menu-item-normal.mce-active {
background: #0073aa; /* See color scheme. */
}
.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.mce-disabled {
cursor: default;
}
.mce-menu .mce-menu-item.mce-disabled:hover {
background: #ccc;
}
/* Menubar */
@ -537,13 +525,33 @@ div.mce-path {
border-width: 0px 0px 1px;
}
.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;
}
.mce-menubtn span {
@ -582,7 +590,6 @@ div.mce-menu .mce-menu-item-sep,
white-space: nowrap;
-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;
}
/* Remove the dotted border on :focus and the extra padding in Firefox */
@ -676,9 +683,10 @@ div.mce-menu .mce-menu-item-sep,
cursor: default;
}
.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;
}
/* Charmap modal */
@ -708,6 +716,8 @@ div.mce-menu .mce-menu-item-sep,
}
.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 );
color: #fff;