Permalink
Browse files

Fix background on split buttons, remove redundant !important, remove …

…spacers, a little css cleanup, see #18141

git-svn-id: http://core.svn.wordpress.org/trunk@22025 1a063a9b-81f0-0310-95a4-ce76da25c4cd
  • Loading branch information...
1 parent baaf5c4 commit 3c6ef163d695a9365e4d470434ca924bf60496b0 Andrew Ozz committed Sep 27, 2012
Showing with 66 additions and 137 deletions.
  1. +42 −58 wp-admin/css/colors-classic.css
  2. +2 −5 wp-admin/css/wp-admin.css
  3. +3 −3 wp-includes/class-wp-editor.php
  4. +19 −71 wp-includes/css/editor.css
View
100 wp-admin/css/colors-classic.css
@@ -1021,20 +1021,20 @@ table.widefat .spam a:hover,
/* TinyMCE */
-.wp-editor-wrap .wp-switch-editor {
+.wp-admin .wp-editor-wrap .wp-switch-editor {
background-color: #d3e9f2;
border-color: #d1e5ee #d1e5ee #d3e9f2;
color: #888;
}
-.wp-editor-wrap.tmce-active .switch-tmce,
-.wp-editor-wrap.html-active .switch-html {
- background: #f7fcfe !important;
- border-color: #d1e5ee #d1e5ee #f7fcfe !important;
+.wp-admin .wp-editor-wrap.tmce-active .switch-tmce,
+.wp-admin .wp-editor-wrap.html-active .switch-html {
+ background: #f7fcfe;
+ border-color: #d1e5ee #d1e5ee #f7fcfe;
}
-.wp-editor-wrap .quicktags-toolbar,
-.wp-editor-wrap .wp_themeSkin tr.mceFirst td.mceToolbar {
+.wp-admin .wp-editor-wrap .quicktags-toolbar,
+.wp-admin .wp-editor-wrap .wp_themeSkin tr.mceFirst td.mceToolbar {
border-color: #d0dfe9;
background-color: #f5fafd;
background-image: -webkit-gradient(linear, left bottom, left top, from(#eff8ff), to(#f7fcfe));
@@ -1044,70 +1044,54 @@ table.widefat .spam a:hover,
background-image: linear-gradient(to top, #eff8ff, #f7fcfe);
}
-.wp_themeSkin table.mceListBox {
+.wp-admin .wp_themeSkin table.mceListBox {
border-color: #d1e5ee;
}
-.wp_themeSkin table.mceListBoxEnabled:hover,
-.wp_themeSkin table.mceListBoxEnabled:active,
-.wp_themeSkin table.mceListBoxHover,
-.wp_themeSkin table.mceListBoxHover:active,
-.wp_themeSkin table.mceListBoxSelected {
+.wp-admin .wp_themeSkin table.mceListBoxEnabled:hover,
+.wp-admin .wp_themeSkin table.mceListBoxEnabled:active,
+.wp-admin .wp_themeSkin table.mceListBoxHover,
+.wp-admin .wp_themeSkin table.mceListBoxHover:active,
+.wp-admin .wp_themeSkin table.mceListBoxSelected {
border-color: #b8cfdf;
}
-.wp_themeSkin a.mceButtonEnabled:hover {
- border-color: #c3d2dc !important;
+.wp-admin .wp_themeSkin a.mceButtonEnabled:hover,
+.wp-admin .wp_themeSkin table.mceSplitButton:hover {
+ border-color: #c3d2dc;
background: #f4f9fc;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#f4f9fc), to(#fff)) !important;
- background-image: -webkit-linear-gradient(bottom, #f4f9fc, #fff) !important;
- background-image: -moz-linear-gradient(bottom, #f4f9fc, #fff) !important;
- background-image: -o-linear-gradient(bottom, #f4f9fc, #fff) !important;
- background-image: linear-gradient(to top, #f4f9fc, #fff) !important;
-}
-
-.wp_themeSkin a.mceButton:active,
-.wp_themeSkin a.mceButtonEnabled:active,
-.wp_themeSkin a.mceButtonSelected:active,
-.wp_themeSkin a.mceButtonActive,
-.wp_themeSkin a.mceButtonActive:active,
-.wp_themeSkin a.mceButtonActive:hover {
- border-color: #8f9da9 #c3d2dc #c3d2dc #8f9da9 !important;
+ background-image: -webkit-gradient(linear, left bottom, left top, from(#f4f9fc), to(#fff));
+ background-image: -webkit-linear-gradient(bottom, #f4f9fc, #fff);
+ background-image: -moz-linear-gradient(bottom, #f4f9fc, #fff);
+ background-image: -o-linear-gradient(bottom, #f4f9fc, #fff);
+ background-image: linear-gradient(to top, #f4f9fc, #fff);
+}
+
+.wp-admin .wp_themeSkin a.mceButton:active,
+.wp-admin .wp_themeSkin a.mceButtonEnabled:active,
+.wp-admin .wp_themeSkin a.mceButtonSelected:active,
+.wp-admin .wp_themeSkin a.mceButtonActive,
+.wp-admin .wp_themeSkin a.mceButtonActive:active,
+.wp-admin .wp_themeSkin a.mceButtonActive:hover,
+.wp-admin .wp_themeSkin .mceSplitButtonSelected table,
+.wp-admin .wp_themeSkin .mceSplitButtonSelected table:hover {
+ border-color: #8f9da9 #c3d2dc #c3d2dc #8f9da9;
background: #f4f9fc;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#f4f9fc)) !important;
- background-image: -webkit-linear-gradient(bottom, #fff, #f4f9fc) !important;
- background-image: -moz-linear-gradient(bottom, #fff, #f4f9fc) !important;
- background-image: -o-linear-gradient(bottom, #fff, #f4f9fc) !important;
- background-image: linear-gradient(to top, #fff, #f4f9fc) !important;
-}
-
-.wp_themeSkin .mceSplitButton:hover a.mceOpen,
-.wp_themeSkin .mceSplitButtonSelected a.mceOpen,
-.wp_themeSkin .mceSplitButtonSelected a.mceAction,
-.wp_themeSkin table.mceSplitButtonEnabled:hover a.mceAction,
-.wp_themeSkin .mceSplitButton a.mceAction:hover {
- border-color: #c3d2dc !important;
+ background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#f4f9fc));
+ background-image: -webkit-linear-gradient(bottom, #fff, #f4f9fc);
+ background-image: -moz-linear-gradient(bottom, #fff, #f4f9fc);
+ background-image: -o-linear-gradient(bottom, #fff, #f4f9fc);
+ background-image: linear-gradient(to top, #fff, #f4f9fc);
}
-.wp_themeSkin table.mceSplitButton:hover td {
- border-color: #f4f9fc;
- background: #eee;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#f4f9fc), to(#fff)) !important;
- background-image: -webkit-linear-gradient(bottom, #f4f9fc, #fff) !important;
- background-image: -moz-linear-gradient(bottom, #f4f9fc, #fff) !important;
- background-image: -o-linear-gradient(bottom, #f4f9fc, #fff) !important;
- background-image: linear-gradient(to top, #f4f9fc, #fff) !important;
+.wp-admin .wp_themeSkin .mceSplitButtonSelected table a.mceOpen,
+.wp-admin .wp_themeSkin .mceSplitButtonSelected table a.mceAction {
+ border-color: #8f9da9 #c3d2dc #c3d2dc #8f9da9;
}
-.wp_themeSkin .mceSplitButtonSelected td {
- background: #f4f9fc;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#f4f9fc)) !important;
- background-image: -webkit-linear-gradient(bottom, #fff, #f4f9fc) !important;
- background-image: -moz-linear-gradient(bottom, #fff, #f4f9fc) !important;
- background-image: -o-linear-gradient(bottom, #fff, #f4f9fc) !important;
- background-image: linear-gradient(to top, #fff, #f4f9fc) !important;
+.wp-admin .wp_themeSkin .mceSplitButton:hover a {
+ border-color: #c3d2dc;
}
-
/* end TinyMCE */
.editwidget .widget-inside {
View
7 wp-admin/css/wp-admin.css
@@ -719,12 +719,9 @@ h2 .nav-tab,
}
.pre {
- /* http://www.longren.org/2006/09/27/wrapping-text-inside-pre-tags/ */
+ /* https://developer.mozilla.org/en-US/docs/CSS/white-space */
white-space: pre-wrap; /* css-3 */
- white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
- white-space: -pre-wrap; /* Opera 4-6 */
- white-space: -o-pre-wrap; /* Opera 7 */
- word-wrap: break-word; /* Internet Explorer 5.5+ */
+ word-wrap: break-word; /* IE 5.5 - 7 */
}
.howto {
View
6 wp-includes/class-wp-editor.php
@@ -383,11 +383,11 @@ public static function editor_settings($editor_id, $set) {
}
if ( $set['teeny'] ) {
- $mce_buttons = apply_filters( 'teeny_mce_buttons', array('bold', 'italic', 'underline', 'blockquote', 'separator', 'strikethrough', 'bullist', 'numlist', 'justifyleft', 'justifycenter', 'justifyright', 'undo', 'redo', 'link', 'unlink', 'fullscreen'), $editor_id );
+ $mce_buttons = apply_filters( 'teeny_mce_buttons', array('bold', 'italic', 'underline', 'blockquote', 'strikethrough', 'bullist', 'numlist', 'justifyleft', 'justifycenter', 'justifyright', 'undo', 'redo', 'link', 'unlink', 'fullscreen'), $editor_id );
$mce_buttons_2 = $mce_buttons_3 = $mce_buttons_4 = array();
} else {
- $mce_buttons = apply_filters('mce_buttons', array('bold', 'italic', 'strikethrough', '|', 'bullist', 'numlist', 'blockquote', '|', 'justifyleft', 'justifycenter', 'justifyright', '|', 'link', 'unlink', 'wp_more', '|', 'spellchecker', 'fullscreen', 'wp_adv' ), $editor_id);
- $mce_buttons_2 = apply_filters('mce_buttons_2', array( 'formatselect', 'underline', 'justifyfull', 'forecolor', '|', 'pastetext', 'pasteword', 'removeformat', '|', 'charmap', '|', 'outdent', 'indent', '|', 'undo', 'redo', 'wp_help' ), $editor_id);
+ $mce_buttons = apply_filters('mce_buttons', array('bold', 'italic', 'strikethrough', 'bullist', 'numlist', 'blockquote', 'justifyleft', 'justifycenter', 'justifyright', 'link', 'unlink', 'wp_more', 'spellchecker', 'fullscreen', 'wp_adv' ), $editor_id);
+ $mce_buttons_2 = apply_filters('mce_buttons_2', array( 'formatselect', 'underline', 'justifyfull', 'forecolor', 'pastetext', 'pasteword', 'removeformat', 'charmap', 'outdent', 'indent', 'undo', 'redo', 'wp_help' ), $editor_id);
$mce_buttons_3 = apply_filters('mce_buttons_3', array(), $editor_id);
$mce_buttons_4 = apply_filters('mce_buttons_4', array(), $editor_id);
}
View
90 wp-includes/css/editor.css
@@ -200,12 +200,7 @@
/* Separator */
.wp_themeSkin .mceSeparator {
- height: 24px;
- width: 1px;
- display: block;
- background: transparent;
- overflow: hidden;
- margin: 0 2px;
+ display: none;
}
/* ListBox */
@@ -316,7 +311,7 @@
height: 20px;
width: 20px;
padding: 1px 2px;
- border-right: 0 none !important;
+ border-right: 0 none;
}
.wp_themeSkin .mceSplitButton span.mceAction {
@@ -334,17 +329,6 @@
padding: 1px 0;
}
-.wp_themeSkin .mceSplitButtonActive a.mceOpen,
-.wp_themeSkin .mceSplitButtonSelected a.mceOpen,
-.wp_themeSkin .mceSplitButton a.mceOpen:hover {
- width: 12px;
- border-left: 1px solid transparent !important;
- background-position: 2px 2px !important;
- position: relative;
- left: -1px;
- margin-right: -1px;
-}
-
.wp_themeSkin .mceSplitButton span.mceOpen {
display: none;
}
@@ -756,7 +740,7 @@
.wp_themeSkin .mceSplitButton .mce_forecolor span.mce_forecolor {background-position:-320px -20px}
.wp_themeSkin .mceSplitButtonEnabled:hover span.mce_forecolor,
-.wp_themeSkin .mceSplitButtonActive span.mce_forecolor {background-position:-320px 0}
+.wp_themeSkin .mceSplitButtonSelected span.mce_forecolor {background-position:-320px 0}
.wp_themeSkin .mce_forecolorpicker {background-position:-320px -20px}
@@ -785,7 +769,7 @@
.wp_themeSkin .mceButtonEnabled:hover span.mce_spellchecker,
.wp_themeSkin .mceSplitButtonEnabled:hover span.mce_spellchecker,
.wp_themeSkin .mceButtonActive span.mce_spellchecker,
-.wp_themeSkin .mceSplitButtonActive span.mce_spellchecker {background-position:-220px 0}
+.wp_themeSkin .mceSplitButtonSelected span.mce_spellchecker {background-position:-220px 0}
.wp_themeSkin span.mce_wp_help {background-position:-520px -20px}
.wp_themeSkin .mceButtonEnabled:hover span.mce_wp_help,
@@ -905,7 +889,8 @@
border-color: transparent;
}
-.wp_themeSkin a.mceButtonEnabled:hover {
+.wp_themeSkin a.mceButtonEnabled:hover,
+.wp_themeSkin table.mceSplitButton:hover {
border-color: #bbb;
background: #eee;
background-image: -webkit-gradient(linear, left bottom, left top, from(#e5e5e5), to(#fff));
@@ -920,7 +905,9 @@
.wp_themeSkin a.mceButtonSelected:active,
.wp_themeSkin a.mceButtonActive,
.wp_themeSkin a.mceButtonActive:active,
-.wp_themeSkin a.mceButtonActive:hover {
+.wp_themeSkin a.mceButtonActive:hover,
+.wp_themeSkin .mceSplitButtonSelected table,
+.wp_themeSkin .mceSplitButtonSelected table:hover {
outline: none;
border-color: #999 #ccc #ccc #999;
background: #eee;
@@ -931,12 +918,17 @@
background-image: linear-gradient(to top, #f6f6f6, #e3e3e3);
}
+.wp_themeSkin .mceSplitButtonSelected table a.mceOpen,
+.wp_themeSkin .mceSplitButtonSelected table a.mceAction {
+ border-color: #999 #ccc #ccc #999;
+}
+
.wp_themeSkin .mceButtonDisabled {
- border-color: transparent !important;
+ border-color: transparent;
}
.wp_themeSkin .mceListBox .mceOpen {
- border-left: 0 !important;
+ border-left: 0;
}
.wp_themeSkin .mceListBoxEnabled:hover,
@@ -951,19 +943,15 @@
/* SplitButton */
.wp_themeSkin .mceSplitButton .mceLast span.mceOpen .mceIconOnly {
- display: block !important;
+ display: block;
}
.wp_themeSkin .mceSplitButton a.mceAction,
.wp_themeSkin .mceSplitButton a.mceOpen {
border-color: transparent;
}
-.wp_themeSkin .mceSplitButton:hover a.mceOpen,
-.wp_themeSkin .mceSplitButtonSelected a.mceOpen,
-.wp_themeSkin .mceSplitButtonSelected a.mceAction,
-.wp_themeSkin table.mceSplitButtonEnabled:hover a.mceAction,
-.wp_themeSkin .mceSplitButton a.mceAction:hover {
+.wp_themeSkin .mceSplitButton:hover a {
border-color: #bbb;
}
@@ -974,50 +962,10 @@
background-image: url("../images/down_arrow.gif");
background-position: 1px 2px;
background-repeat: no-repeat;
-}
-
-.wp_themeSkin .mceSplitButtonSelected td {
- background-color: #ddd;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#ccc));
- background-image: -webkit-linear-gradient(bottom, #fff, #ccc);
- background-image: -moz-linear-gradient(bottom, #fff, #ccc);
- background-image: -o-linear-gradient(bottom, #fff, #ccc);
- background-image: linear-gradient(to top, #fff, #ccc);
-}
-
-.wp_themeSkin table.mceSplitButton:hover td {
- border-color: #bbb;
- background-color: #eee;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#ccc), to(#fff));
- background-image: -webkit-linear-gradient(bottom, #ccc, #fff);
- background-image: -moz-linear-gradient(bottom, #ccc, #fff);
- background-image: -o-linear-gradient(bottom, #ccc, #fff);
- background-image: linear-gradient(to top, #ccc, #fff);
-}
-
-.wp_themeSkin table.mceSplitButton:active td.mceFirst,
-.wp_themeSkin table.mceSplitButton td.mceLast:active {
- border-color: #bbb;
- background-color: #ddd;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#ccc));
- background-image: -webkit-linear-gradient(bottom, #fff, #ccc);
- background-image: -moz-linear-gradient(bottom, #fff, #ccc);
- background-image: -o-linear-gradient(bottom, #fff, #ccc);
- background-image: linear-gradient(to top, #fff, #ccc);
-}
-
-.wp_themeSkin .mceSplitButtonActive td a.mceAction,
-.wp_themeSkin .mceSplitButtonActive td a.mceOpen {
- border-color: #bbb;
+ border-left: 0;
}
.wp_themeSkin .mceSplitButtonActive td {
- background-color: #ddd;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#ccc));
- background-image: -webkit-linear-gradient(bottom, #fff, #ccc);
- background-image: -moz-linear-gradient(bottom, #fff, #ccc);
- background-image: -o-linear-gradient(bottom, #fff, #ccc);
- background-image: linear-gradient(to top, #fff, #ccc);
-webkit-border-radius: 3px;
border-radius: 3px;
}

0 comments on commit 3c6ef16

Please sign in to comment.