Header images: Improve accessibility of Randomize buttons.

props ehg.
see #27598, #21785.

git-svn-id: https://develop.svn.wordpress.org/trunk@27970 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Dominik Schilling (ocean90) 2014-04-06 19:27:40 +00:00
parent ab8f7f7afd
commit 2f0a34dbb8
3 changed files with 18 additions and 18 deletions

View File

@ -469,8 +469,8 @@ body {
margin-bottom: 18px;
}
#customize-control-header_image .uploaded button,
#customize-control-header_image .default button {
#customize-control-header_image .uploaded button:not(.random),
#customize-control-header_image .default button:not(.random) {
width: 100%;
padding: 0;
margin: 0;
@ -478,7 +478,6 @@ body {
border: none;
color: inherit;
cursor: pointer;
outline: none;
}
#customize-control-header_image button img {
@ -584,11 +583,17 @@ body {
height: 40px;
}
#customize-control-header_image .random .inner {
display: block;
#customize-control-header_image button.random {
width: 100%;
height: 40px;
}
#customize-control-header_image .placeholder:hover .dice {
#customize-control-header_image button.random .dice {
margin-top: 4px;
}
#customize-control-header_image .placeholder:hover .dice,
#customize-control-header_image .header-view:hover > button.random .dice {
-webkit-animation: dice-color-change 3s infinite;
-ms-animation: dice-color-change 3s infinite;
animation: dice-color-change 3s infinite;

View File

@ -771,18 +771,14 @@ final class WP_Customize_Header_Image_Control extends WP_Customize_Image_Control
?>
<script type="text/template" id="tmpl-header-choice">
<# if (data.random) { #>
<div class="placeholder random">
<div class="inner">
<button type="button"><span class="dashicons dashicons-randomize dice"></span>
<# if ( data.type === 'uploaded' ) { #>
<?php _e( 'Randomize uploaded headers' ); ?>
<# } else if ( data.type === 'default' ) { #>
<?php _e( 'Randomize suggested headers' ); ?>
<# } #>
<button type="button" class="button display-options random">
<span class="dashicons dashicons-randomize dice"></span>
<# if ( data.type === 'uploaded' ) { #>
<?php _e( 'Randomize uploaded headers' ); ?>
<# } else if ( data.type === 'default' ) { #>
<?php _e( 'Randomize suggested headers' ); ?>
<# } #>
</button>
</div>
</div>
<# } else { #>

View File

@ -121,7 +121,6 @@
this.$el.html(this.template(this.extendedModel()));
if (this.model.get('random')) {
this.$el.addClass('button display-options');
this.setPlaceholder(40);
}