- Update the install/initial configuration/repair screens buttons, props DrewAPicture
- Fix the welcome screen buttons and fine-tune the buttons css, props lessbloat

fixes #21598


git-svn-id: http://core.svn.wordpress.org/trunk@22314 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrew Ozz 2012-10-26 19:40:39 +00:00
parent 2677205fba
commit efbc9d2336
9 changed files with 115 additions and 100 deletions

View File

@ -237,34 +237,44 @@ table.fixed td {
width: 98%; width: 98%;
} }
button, .button,
input[type="reset"], input[type="reset"],
input[type="button"], input[type="button"],
input[type="submit"] { input[type="submit"] {
padding: 2px 8px; padding: 0 8px;
line-height: 20px;
height: auto;
} }
button.button-large, .button.button-large,
input[type="reset"].button-large, input[type="reset"].button-large,
input[type="button"].button-large, input[type="button"].button-large,
input[type="submit"].button-large { input[type="submit"].button-large {
padding: 4px 12px; padding: 0 10px;
line-height: 24px;
height: auto;
} }
button.button-small, .button.button-small,
input[type="reset"].button-small, input[type="reset"].button-small,
input[type="button"].button-small, input[type="button"].button-small,
input[type="submit"].button-small { input[type="submit"].button-small {
padding: 0 8px; padding: 0 6px;
line-height: 16px;
height: auto;
} }
a.button { a.button {
margin: 1px; margin: 1px;
padding: 3px 8px; padding: 1px 9px 2px;
}
a.button.button-large {
padding: 1px 11px 2px;
} }
a.button.button-small { a.button.button-small {
padding: 1px 8px; padding: 1px 7px 2px;
} }
#screen-options-wrap { #screen-options-wrap {

View File

@ -70,49 +70,9 @@ abbr {
text-align: left; text-align: left;
padding: 0; padding: 0;
} }
.step .button-large {
.submit input, font-size: 14px;
.button,
.button-secondary {
font-family: sans-serif;
text-decoration: none;
font-size: 14px !important;
line-height: 16px;
padding: 6px 12px;
cursor: pointer;
border: 1px solid #bbb;
color: #464646;
-webkit-border-radius: 15px;
border-radius: 15px;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
background: #f2f2f2;
background-image: -webkit-gradient(linear, left bottom, left top, from(#ededed), to(#fff));
background-image: -webkit-linear-gradient(bottom, #ededed, #fff);
background-image: -moz-linear-gradient(bottom, #ededed, #fff);
background-image: -o-linear-gradient(bottom, #ededed, #fff);
background-image: linear-gradient(to top, #ededed, #fff);
} }
.button:hover,
.button-secondary:hover,
.submit input:hover {
color: #000;
border-color: #666;
}
.button:active,
.submit input:active,
.button-secondary:active {
background: #eee;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
background-image: -webkit-linear-gradient(top, #ededed, #fff);
background-image: -moz-linear-gradient(top, #ededed, #fff);
background-image: -o-linear-gradient(top, #ededed, #fff);
background-image: linear-gradient(to bottom, #ededed, #fff);
}
textarea { textarea {
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;

View File

@ -2262,9 +2262,11 @@ html.wp-toolbar {
} }
.welcome-panel .welcome-button { .welcome-panel .welcome-button {
font: normal 15px sans-serif;
height: 46px;
line-height: 44px;
margin: -9px 0 3px; margin: -9px 0 3px;
padding: 1em 3em; padding: 0 36px;
font: normal 15px/1 sans-serif;
} }
.welcome-panel-content { .welcome-panel-content {

View File

@ -58,7 +58,10 @@ function display_header() {
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php _e( 'WordPress &rsaquo; Installation' ); ?></title> <title><?php _e( 'WordPress &rsaquo; Installation' ); ?></title>
<?php wp_admin_css( 'install', true ); ?> <?php
wp_admin_css( 'install', true );
wp_admin_css( 'buttons', true );
?>
</head> </head>
<body<?php if ( is_rtl() ) echo ' class="rtl"'; ?>> <body<?php if ( is_rtl() ) echo ' class="rtl"'; ?>>
<h1 id="logo"><img alt="WordPress" src="images/wordpress-logo.png?ver=20120216" /></h1> <h1 id="logo"><img alt="WordPress" src="images/wordpress-logo.png?ver=20120216" /></h1>
@ -134,7 +137,7 @@ function display_setup_form( $error = null ) {
<td colspan="2"><label><input type="checkbox" name="blog_public" value="1" <?php checked( $blog_public ); ?> /> <?php _e( 'Allow search engines to index this site.' ); ?></label></td> <td colspan="2"><label><input type="checkbox" name="blog_public" value="1" <?php checked( $blog_public ); ?> /> <?php _e( 'Allow search engines to index this site.' ); ?></label></td>
</tr> </tr>
</table> </table>
<p class="step"><input type="submit" name="Submit" value="<?php esc_attr_e( 'Install WordPress' ); ?>" class="button" /></p> <p class="step"><input type="submit" name="Submit" value="<?php esc_attr_e( 'Install WordPress' ); ?>" class="button button-large" /></p>
</form> </form>
<?php <?php
} // end display_setup_form() } // end display_setup_form()
@ -142,7 +145,7 @@ function display_setup_form( $error = null ) {
// Let's check to make sure WP isn't already installed. // Let's check to make sure WP isn't already installed.
if ( is_blog_installed() ) { if ( is_blog_installed() ) {
display_header(); display_header();
die( '<h1>' . __( 'Already Installed' ) . '</h1><p>' . __( 'You appear to have already installed WordPress. To reinstall please clear your old database tables first.' ) . '</p><p class="step"><a href="../wp-login.php" class="button">' . __('Log In') . '</a></p></body></html>' ); die( '<h1>' . __( 'Already Installed' ) . '</h1><p>' . __( 'You appear to have already installed WordPress. To reinstall please clear your old database tables first.' ) . '</p><p class="step"><a href="../wp-login.php" class="button button-large">' . __( 'Log In' ) . '</a></p></body></html>' );
} }
$php_version = phpversion(); $php_version = phpversion();
@ -241,7 +244,7 @@ switch($step) {
</tr> </tr>
</table> </table>
<p class="step"><a href="../wp-login.php" class="button"><?php _e( 'Log In' ); ?></a></p> <p class="step"><a href="../wp-login.php" class="button button-large"><?php _e( 'Log In' ); ?></a></p>
<?php <?php
} }

View File

@ -16,7 +16,10 @@ header( 'Content-Type: text/html; charset=utf-8' );
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php _e( 'WordPress &rsaquo; Database Repair' ); ?></title> <title><?php _e( 'WordPress &rsaquo; Database Repair' ); ?></title>
<?php wp_admin_css( 'install', true ); ?> <?php
wp_admin_css( 'install', true );
wp_admin_css( 'buttons', true );
?>
</head> </head>
<body> <body>
<h1 id="logo"><img alt="WordPress" src="../images/wordpress-logo.png?ver=20120216" /></h1> <h1 id="logo"><img alt="WordPress" src="../images/wordpress-logo.png?ver=20120216" /></h1>
@ -102,9 +105,9 @@ if ( ! defined( 'WP_ALLOW_REPAIR' ) ) {
else else
echo '<p>' . __( 'WordPress can automatically look for some common database problems and repair them. Repairing can take a while, so please be patient.' ) . '</p>'; echo '<p>' . __( 'WordPress can automatically look for some common database problems and repair them. Repairing can take a while, so please be patient.' ) . '</p>';
?> ?>
<p class="step"><a class="button" href="repair.php?repair=1"><?php _e( 'Repair Database' ); ?></a></p> <p class="step"><a class="button button-large" href="repair.php?repair=1"><?php _e( 'Repair Database' ); ?></a></p>
<p><?php _e( 'WordPress can also attempt to optimize the database. This improves performance in some situations. Repairing and optimizing the database can take a long time and the database will be locked while optimizing.' ); ?></p> <p><?php _e( 'WordPress can also attempt to optimize the database. This improves performance in some situations. Repairing and optimizing the database can take a long time and the database will be locked while optimizing.' ); ?></p>
<p class="step"><a class="button" href="repair.php?repair=2"><?php _e( 'Repair and Optimize Database' ); ?></a></p> <p class="step"><a class="button button-large" href="repair.php?repair=2"><?php _e( 'Repair and Optimize Database' ); ?></a></p>
<?php <?php
} }
?> ?>

View File

@ -96,6 +96,7 @@ function setup_config_display_header() {
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php _e( 'WordPress &rsaquo; Setup Configuration File' ); ?></title> <title><?php _e( 'WordPress &rsaquo; Setup Configuration File' ); ?></title>
<link rel="stylesheet" href="css/install.css?ver=<?php echo preg_replace( '/[^0-9a-z\.-]/i', '', $wp_version ); ?>" type="text/css" /> <link rel="stylesheet" href="css/install.css?ver=<?php echo preg_replace( '/[^0-9a-z\.-]/i', '', $wp_version ); ?>" type="text/css" />
<link rel="stylesheet" href="../wp-includes/css/buttons.css?ver=<?php echo preg_replace( '/[^0-9a-z\.-]/i', '', $wp_version ); ?>" type="text/css" />
</head> </head>
<body<?php if ( is_rtl() ) echo ' class="rtl"'; ?>> <body<?php if ( is_rtl() ) echo ' class="rtl"'; ?>>
@ -119,7 +120,7 @@ switch($step) {
<p><strong><?php _e( "If for any reason this automatic file creation doesn&#8217;t work, don&#8217;t worry. All this does is fill in the database information to a configuration file. You may also simply open <code>wp-config-sample.php</code> in a text editor, fill in your information, and save it as <code>wp-config.php</code>." ); ?></strong></p> <p><strong><?php _e( "If for any reason this automatic file creation doesn&#8217;t work, don&#8217;t worry. All this does is fill in the database information to a configuration file. You may also simply open <code>wp-config-sample.php</code> in a text editor, fill in your information, and save it as <code>wp-config.php</code>." ); ?></strong></p>
<p><?php _e( "In all likelihood, these items were supplied to you by your Web Host. If you do not have this information, then you will need to contact them before you can continue. If you&#8217;re all ready&hellip;" ); ?></p> <p><?php _e( "In all likelihood, these items were supplied to you by your Web Host. If you do not have this information, then you will need to contact them before you can continue. If you&#8217;re all ready&hellip;" ); ?></p>
<p class="step"><a href="setup-config.php?step=1<?php if ( isset( $_GET['noapi'] ) ) echo '&amp;noapi'; ?>" class="button"><?php _e( 'Let&#8217;s go!' ); ?></a></p> <p class="step"><a href="setup-config.php?step=1<?php if ( isset( $_GET['noapi'] ) ) echo '&amp;noapi'; ?>" class="button button-large"><?php _e( 'Let&#8217;s go!' ); ?></a></p>
<?php <?php
break; break;
@ -156,7 +157,7 @@ switch($step) {
</tr> </tr>
</table> </table>
<?php if ( isset( $_GET['noapi'] ) ) { ?><input name="noapi" type="hidden" value="1" /><?php } ?> <?php if ( isset( $_GET['noapi'] ) ) { ?><input name="noapi" type="hidden" value="1" /><?php } ?>
<p class="step"><input name="submit" type="submit" value="<?php echo htmlspecialchars( __( 'Submit' ), ENT_QUOTES ); ?>" class="button" /></p> <p class="step"><input name="submit" type="submit" value="<?php echo htmlspecialchars( __( 'Submit' ), ENT_QUOTES ); ?>" class="button button-large" /></p>
</form> </form>
<?php <?php
break; break;
@ -165,7 +166,7 @@ switch($step) {
foreach ( array( 'dbname', 'uname', 'pwd', 'dbhost', 'prefix' ) as $key ) foreach ( array( 'dbname', 'uname', 'pwd', 'dbhost', 'prefix' ) as $key )
$$key = trim( stripslashes( $_POST[ $key ] ) ); $$key = trim( stripslashes( $_POST[ $key ] ) );
$tryagain_link = '</p><p class="step"><a href="setup-config.php?step=1" onclick="javascript:history.go(-1);return false;" class="button">' . __( 'Try again' ) . '</a>'; $tryagain_link = '</p><p class="step"><a href="setup-config.php?step=1" onclick="javascript:history.go(-1);return false;" class="button button-large">' . __( 'Try again' ) . '</a>';
if ( empty( $prefix ) ) if ( empty( $prefix ) )
wp_die( __( '<strong>ERROR</strong>: "Table Prefix" must not be empty.' . $tryagain_link ) ); wp_die( __( '<strong>ERROR</strong>: "Table Prefix" must not be empty.' . $tryagain_link ) );
@ -264,7 +265,7 @@ switch($step) {
} }
?></textarea> ?></textarea>
<p><?php _e( 'After you&#8217;ve done that, click &#8220;Run the install.&#8221;' ); ?></p> <p><?php _e( 'After you&#8217;ve done that, click &#8220;Run the install.&#8221;' ); ?></p>
<p class="step"><a href="install.php" class="button"><?php _e( 'Run the install' ); ?></a></p> <p class="step"><a href="install.php" class="button button-large"><?php _e( 'Run the install' ); ?></a></p>
<script> <script>
(function(){ (function(){
var el=document.getElementById('wp-config'); var el=document.getElementById('wp-config');
@ -284,7 +285,7 @@ el.select();
?> ?>
<p><?php _e( "All right sparky! You&#8217;ve made it through this part of the installation. WordPress can now communicate with your database. If you are ready, time now to&hellip;" ); ?></p> <p><?php _e( "All right sparky! You&#8217;ve made it through this part of the installation. WordPress can now communicate with your database. If you are ready, time now to&hellip;" ); ?></p>
<p class="step"><a href="install.php" class="button"><?php _e( 'Run the install' ); ?></a></p> <p class="step"><a href="install.php" class="button button-large"><?php _e( 'Run the install' ); ?></a></p>
<?php <?php
endif; endif;
break; break;

View File

@ -39,12 +39,12 @@ TABLE OF CONTENTS:
.button-primary, .button-primary,
.button-secondary { .button-secondary {
display: inline-block; display: inline-block;
vertical-align: middle;
text-decoration: none; text-decoration: none;
font-size: 12px; font-size: 12px;
line-height: 1.45em; line-height: 23px;
height: 24px;
margin: 0; margin: 0;
padding: 3px 10px; padding: 0 10px 1px;
cursor: pointer; cursor: pointer;
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
@ -61,18 +61,24 @@ button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner { input[type="submit"]::-moz-focus-inner {
border: 1px solid transparent; border-width: 1px 0;
border-style: solid none;
border-color: transparent;
padding: 0; padding: 0;
} }
.button.button-large, .button.button-large,
.button-group.button-large .button { .button-group.button-large .button {
padding: 5px 12px; height: 30px;
line-height: 28px;
padding: 0 12px 2px;
} }
.button.button-small, .button.button-small,
.button-group.button-small .button { .button-group.button-small .button {
padding: 2px 8px; height: 21px;
line-height: 20px;
padding: 0 8px 1px;
} }
.button:active { .button:active {

View File

@ -2126,42 +2126,72 @@ function _default_wp_die_handler( $message, $title = '', $args = array() ) {
a:hover { a:hover {
color: #D54E21; color: #D54E21;
} }
.button { .button {
font-family: sans-serif; display: inline-block;
text-decoration: none; text-decoration: none;
font-size: 14px !important; font-size: 14px;
line-height: 16px; line-height: 23px;
padding: 6px 12px; height: 24px;
margin: 0;
padding: 0 10px 1px;
cursor: pointer; cursor: pointer;
border: 1px solid #bbb; border-width: 1px;
color: #464646; border-style: solid;
-webkit-border-radius: 15px; -webkit-border-radius: 3px;
border-radius: 15px; border-radius: 3px;
-moz-box-sizing: content-box; white-space: nowrap;
-webkit-box-sizing: content-box; -webkit-box-sizing: border-box;
box-sizing: content-box; -moz-box-sizing: border-box;
background-color: #f5f5f5; box-sizing: border-box;
background-image: -ms-linear-gradient(top, #ffffff, #f2f2f2); background: #f3f3f3;
background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2); background-image: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#f4f4f4));
background-image: -o-linear-gradient(top, #ffffff, #f2f2f2); background-image: -webkit-linear-gradient(top, #fefefe, #f4f4f4);
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f2f2f2)); background-image: -moz-linear-gradient(top, #fefefe, #f4f4f4);
background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2); background-image: -o-linear-gradient(top, #fefefe, #f4f4f4);
background-image: linear-gradient(top, #ffffff, #f2f2f2); background-image: linear-gradient(to bottom, #fefefe, #f4f4f4);
border-color: #bbb;
color: #333;
text-shadow: 0 1px 0 #fff;
} }
.button:hover { .button.button-large {
color: #000; height: 29px;
border-color: #666; line-height: 28px;
padding: 0 12px;
}
.button:hover,
.button:focus {
background: #f3f3f3;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f3f3f3));
background-image: -webkit-linear-gradient(top, #fff, #f3f3f3);
background-image: -moz-linear-gradient(top, #fff, #f3f3f3);
background-image: -ms-linear-gradient(top, #fff, #f3f3f3);
background-image: -o-linear-gradient(top, #fff, #f3f3f3);
background-image: linear-gradient(to bottom, #fff, #f3f3f3);
border-color: #999;
color: #222;
}
.button:focus {
-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.2);
box-shadow: 1px 1px 1px rgba(0,0,0,.2);
} }
.button:active { .button:active {
background-image: -ms-linear-gradient(top, #f2f2f2, #ffffff); outline: none;
background-image: -moz-linear-gradient(top, #f2f2f2, #ffffff); background: #eee;
background-image: -o-linear-gradient(top, #f2f2f2, #ffffff); background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f4f4), to(#fefefe));
background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#ffffff)); background-image: -webkit-linear-gradient(top, #f4f4f4, #fefefe);
background-image: -webkit-linear-gradient(top, #f2f2f2, #ffffff); background-image: -moz-linear-gradient(top, #f4f4f4, #fefefe);
background-image: linear-gradient(top, #f2f2f2, #ffffff); background-image: -ms-linear-gradient(top, #f4f4f4, #fefefe);
background-image: -o-linear-gradient(top, #f4f4f4, #fefefe);
background-image: linear-gradient(to bottom, #f4f4f4, #fefefe);
border-color: #999;
color: #333;
text-shadow: 0 -1px 0 #fff;
-webkit-box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
} }
<?php if ( 'rtl' == $text_direction ) : ?> <?php if ( 'rtl' == $text_direction ) : ?>

View File

@ -57,7 +57,7 @@ if ( file_exists( ABSPATH . 'wp-config.php') ) {
$die = __( "There doesn't seem to be a <code>wp-config.php</code> file. I need this before we can get started." ) . '</p>'; $die = __( "There doesn't seem to be a <code>wp-config.php</code> file. I need this before we can get started." ) . '</p>';
$die .= '<p>' . __( "Need more help? <a href='http://codex.wordpress.org/Editing_wp-config.php'>We got it</a>." ) . '</p>'; $die .= '<p>' . __( "Need more help? <a href='http://codex.wordpress.org/Editing_wp-config.php'>We got it</a>." ) . '</p>';
$die .= '<p>' . __( "You can create a <code>wp-config.php</code> file through a web interface, but this doesn't work for all server setups. The safest way is to manually create the file." ) . '</p>'; $die .= '<p>' . __( "You can create a <code>wp-config.php</code> file through a web interface, but this doesn't work for all server setups. The safest way is to manually create the file." ) . '</p>';
$die .= '<p><a href="' . $path . '" class="button">' . __( "Create a Configuration File" ) . '</a>'; $die .= '<p><a href="' . $path . '" class="button button-large">' . __( "Create a Configuration File" ) . '</a>';
wp_die( $die, __( 'WordPress &rsaquo; Error' ) ); wp_die( $die, __( 'WordPress &rsaquo; Error' ) );
} }