Fix a conflict with WordPress' "quick edit" feature.

Explanation:
WordPress includes a "quick edit" function that lets users edit certain post properties (title, categories, etc) from the "All Posts" list. WP calculates the width (colspan attribute) of the inline editor based on the number of <th>'s in the header of the first .widefat table on the page. When PUC and Debug Bar are both active, that first table happens to be the debug info table in our Debug Bar panel. This table does not have a <thead>. As a result, WordPress sets the colspan to zero, making the inline editor unusable.

Fixed by removing the "widefat" class from our debug info tables and adding a bunch of new CSS to emulate WordPress table style.
This commit is contained in:
Yahnis Elsts 2013-09-27 03:08:51 -07:00
parent 9f7c8f74ba
commit 2edd17e0a5
3 changed files with 47 additions and 4 deletions

View File

@ -2,8 +2,51 @@
margin-top: 0;
}
/* Style the debug data table to match "widefat" table style used by WordPress. */
table.puc-debug-data {
width: 100%;
clear: both;
margin: 0;
border-spacing: 0;
background-color: #f9f9f9;
border-radius: 3px;
border: 1px solid #dfdfdf;
border-collapse: separate;
}
table.puc-debug-data * {
word-wrap: break-word;
}
table.puc-debug-data th {
width: 11em;
padding: 7px 7px 8px;
text-align: left;
font-family: "Georgia", "Times New Roman", "Bitstream Charter", "Times", serif;
font-weight: 400;
font-size: 14px;
line-height: 1.3em;
text-shadow: rgba(255, 255, 255, 0.804) 0 1px 0;
}
table.puc-debug-data td, table.puc-debug-data th {
border-width: 1px 0;
border-style: solid;
border-top-color: #fff;
border-bottom-color: #dfdfdf;
text-transform: none;
}
table.puc-debug-data td {
color: #555;
font-size: 12px;
padding: 4px 7px 2px;
vertical-align: top;
}
.puc-ajax-response {

View File

@ -29,7 +29,7 @@ class PluginUpdateCheckerPanel extends Debug_Bar_Panel {
$responseBox = '<div class="puc-ajax-response" style="display: none;"></div>';
echo '<h3>Configuration</h3>';
echo '<table class="widefat puc-debug-data">';
echo '<table class="puc-debug-data">';
$this->row('Plugin file', htmlentities($this->updateChecker->pluginFile));
$this->row('Slug', htmlentities($this->updateChecker->slug));
$this->row('DB option', htmlentities($this->updateChecker->optionName));
@ -45,7 +45,7 @@ class PluginUpdateCheckerPanel extends Debug_Bar_Panel {
echo '</table>';
echo '<h3>Status</h3>';
echo '<table class="widefat puc-debug-data">';
echo '<table class="puc-debug-data">';
$state = $this->updateChecker->getUpdateState();
$checkNowButton = function_exists('get_submit_button') ? get_submit_button('Check Now', 'secondary', 'puc-check-now-button', false) : '';
@ -68,7 +68,7 @@ class PluginUpdateCheckerPanel extends Debug_Bar_Panel {
$update = $this->updateChecker->getUpdate();
if ( $update !== null ) {
echo '<h3>An Update Is Available</h3>';
echo '<table class="widefat puc-debug-data">';
echo '<table class="puc-debug-data">';
$fields = array('version', 'download_url', 'slug', 'homepage', 'upgrade_notice');
foreach($fields as $field) {
$this->row(ucwords(str_replace('_', ' ', $field)), htmlentities($update->$field));

View File

@ -37,7 +37,7 @@ class PucDebugBarPlugin {
'puc-debug-bar-style',
plugins_url( "/css/puc-debug-bar.css", __FILE__ ),
array('debug-bar'),
'20121026-3'
'20130927'
);
wp_enqueue_script(