Custom background UI tweaks. Make 'Select Color' a link instead of a button, move color below the background image options, standardize screen reader text.
git-svn-id: http://svn.automattic.com/wordpress/trunk@15016 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
parent
3ed432fab2
commit
549ec140b9
|
@ -232,14 +232,6 @@ if ( get_background_image() ) {
|
|||
<form method="post" action="">
|
||||
<table class="form-table">
|
||||
<tbody>
|
||||
<tr valign="top">
|
||||
<th scope="row"><?php _e( 'Color' ); ?></th>
|
||||
<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Background Color' ); ?></span></legend>
|
||||
<input type="text" name="background-color" id="background-color" value="#<?php echo esc_attr(get_background_color()) ?>" />
|
||||
<input type="button" class="button" value="<?php esc_attr_e('Select a Color'); ?>" id="pickcolor" />
|
||||
<div id="colorPickerDiv" style="z-index: 100; background:#eee; border:1px solid #ccc; position:absolute; display:none;"></div>
|
||||
</fieldset></td>
|
||||
</tr>
|
||||
<?php if ( get_background_image() ) : ?>
|
||||
<tr valign="top">
|
||||
<th scope="row"><?php _e( 'Position' ); ?></th>
|
||||
|
@ -261,7 +253,7 @@ if ( get_background_image() ) {
|
|||
|
||||
<tr valign="top">
|
||||
<th scope="row"><?php _e( 'Repeat' ); ?></th>
|
||||
<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Repeat' ); ?></span></legend>
|
||||
<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Background Repeat' ); ?></span></legend>
|
||||
<label><input type="radio" name="background-repeat" value="no-repeat"<?php checked('no-repeat', get_theme_mod('background_repeat', 'repeat')); ?>> <?php _e('No Repeat'); ?></option></label>
|
||||
<label><input type="radio" name="background-repeat" value="repeat"<?php checked('repeat', get_theme_mod('background_repeat', 'repeat')); ?>> <?php _e('Tile'); ?></option></label>
|
||||
<label><input type="radio" name="background-repeat" value="repeat-x"<?php checked('repeat-x', get_theme_mod('background_repeat', 'repeat')); ?>> <?php _e('Tile Horizontally'); ?></option></label>
|
||||
|
@ -271,7 +263,7 @@ if ( get_background_image() ) {
|
|||
|
||||
<tr valign="top">
|
||||
<th scope="row"><?php _e( 'Attachment' ); ?></th>
|
||||
<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Attachment' ); ?></span></legend>
|
||||
<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Background Attachment' ); ?></span></legend>
|
||||
<label>
|
||||
<input name="background-attachment" type="radio" value="scroll" <?php checked('scroll', get_theme_mod('background_attachment', 'fixed')); ?> />
|
||||
<?php _e('Scroll') ?>
|
||||
|
@ -283,6 +275,14 @@ if ( get_background_image() ) {
|
|||
</fieldset></td>
|
||||
</tr>
|
||||
<?php endif; // get_background_image() ?>
|
||||
<tr valign="top">
|
||||
<th scope="row"><?php _e( 'Color' ); ?></th>
|
||||
<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Background Color' ); ?></span></legend>
|
||||
<input type="text" name="background-color" id="background-color" value="#<?php echo esc_attr(get_background_color()) ?>" />
|
||||
<a class="hide-if-no-js" href="#" id="pickcolor"><?php _e('Select a Color'); ?></a>
|
||||
<div id="colorPickerDiv" style="z-index: 100; background:#eee; border:1px solid #ccc; position:absolute; display:none;"></div>
|
||||
</fieldset></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
|
|
@ -9,6 +9,7 @@ function pickColor(color) {
|
|||
jQuery(document).ready(function() {
|
||||
jQuery('#pickcolor').click(function() {
|
||||
jQuery('#colorPickerDiv').show();
|
||||
return false;
|
||||
});
|
||||
|
||||
jQuery('#background-color').keyup(function() {
|
||||
|
|
|
@ -1 +1 @@
|
|||
var farbtastic;function pickColor(a){farbtastic.setColor(a);jQuery("#background-color").val(a);jQuery("#custom-background-image").css("background-color",a)}jQuery(document).ready(function(){jQuery("#pickcolor").click(function(){jQuery("#colorPickerDiv").show()});jQuery("#background-color").keyup(function(){var b=jQuery("#background-color").val(),a=b;if(a[0]!="#"){a="#"+a}a=a.replace(/[^#a-fA-F0-9]+/,"");if(a!=b){jQuery("#background-color").val(a)}if(a.length==4||a.length==7){pickColor(a)}});jQuery('input[name="background-position-x"]').change(function(){jQuery("#custom-background-image").css("background-position",jQuery(this).val()+" top")});jQuery('select[name="background-repeat"]').change(function(){jQuery("#custom-background-image").css("background-repeat",jQuery(this).val())});farbtastic=jQuery.farbtastic("#colorPickerDiv",function(a){pickColor(a)});pickColor(jQuery("#background-color").val());jQuery(document).mousedown(function(){jQuery("#colorPickerDiv").each(function(){var a=jQuery(this).css("display");if(a=="block"){jQuery(this).fadeOut(2)}})})});
|
||||
var farbtastic;function pickColor(a){farbtastic.setColor(a);jQuery("#background-color").val(a);jQuery("#custom-background-image").css("background-color",a)}jQuery(document).ready(function(){jQuery("#pickcolor").click(function(){jQuery("#colorPickerDiv").show();return false});jQuery("#background-color").keyup(function(){var b=jQuery("#background-color").val(),a=b;if(a[0]!="#"){a="#"+a}a=a.replace(/[^#a-fA-F0-9]+/,"");if(a!=b){jQuery("#background-color").val(a)}if(a.length==4||a.length==7){pickColor(a)}});jQuery('input[name="background-position-x"]').change(function(){jQuery("#custom-background-image").css("background-position",jQuery(this).val()+" top")});jQuery('select[name="background-repeat"]').change(function(){jQuery("#custom-background-image").css("background-repeat",jQuery(this).val())});farbtastic=jQuery.farbtastic("#colorPickerDiv",function(a){pickColor(a)});pickColor(jQuery("#background-color").val());jQuery(document).mousedown(function(){jQuery("#colorPickerDiv").each(function(){var a=jQuery(this).css("display");if(a=="block"){jQuery(this).fadeOut(2)}})})});
|
|
@ -395,7 +395,7 @@ function wp_default_scripts( &$scripts ) {
|
|||
'saveAlert' => __('The changes you made will be lost if you navigate away from this page.'),
|
||||
) );
|
||||
|
||||
$scripts->add( 'custom-background', "/wp-admin/js/custom-background$suffix.js", array('farbtastic'), '20100516' );
|
||||
$scripts->add( 'custom-background', "/wp-admin/js/custom-background$suffix.js", array('farbtastic'), '20100527' );
|
||||
$scripts->add_data( 'custom-background', 'group', 1 );
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue