From 9e59f73a0b324f293126d2e6df77fc912d5feb51 Mon Sep 17 00:00:00 2001 From: Matt Thomas Date: Thu, 21 Nov 2013 00:20:13 +0000 Subject: [PATCH] Bring the install/update screens in line with the new admin design. This affects: * Creating a wp-config.php file * Installation * Database upgrade * Database repair * Readme.html * Network sites actions What's changed: * Bring background/text/link/border colours in line with mp6 * Bring fonts in line with mp6 (see note below) * Switch to device-width for the viewport and tweak margins etc so the layout works nicely on all device sizes * Switch to the new vector WordPress logo in the header to match the log in screen * Force table cells into rows in the <782px media query Fixes #25951, props johnbillion. git-svn-id: https://develop.svn.wordpress.org/trunk@26298 602fd350-edb4-49c9-b593-d223f7449a82 --- src/readme.html | 1 + src/wp-admin/css/install.css | 135 +++++++++++++++++++++++---------- src/wp-admin/install.php | 3 + src/wp-admin/maint/repair.php | 5 +- src/wp-admin/network/sites.php | 1 + src/wp-admin/setup-config.php | 1 + src/wp-admin/upgrade.php | 1 + 7 files changed, 106 insertions(+), 41 deletions(-) diff --git a/src/readme.html b/src/readme.html index b9be942b0d..87030a9580 100644 --- a/src/readme.html +++ b/src/readme.html @@ -1,6 +1,7 @@ + WordPress › ReadMe diff --git a/src/wp-admin/css/install.css b/src/wp-admin/css/install.css index 08297cff37..b27e750cdf 100644 --- a/src/wp-admin/css/install.css +++ b/src/wp-admin/css/install.css @@ -1,36 +1,38 @@ html { - background: #f9f9f9; + background: #eee; + margin: 0 20px; } body { background: #fff; - color: #333; - font-family: sans-serif; - margin: 2em auto; - padding: 1em 2em; - -webkit-border-radius: 3px; - border-radius: 3px; - border: 1px solid #dfdfdf; + color: #555; + font-family: "Open Sans", sans-serif; + margin: 140px auto 25px; + padding: 20px 20px 10px 20px; max-width: 700px; + -webkit-font-smoothing: subpixel-antialiased; + -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.13); + box-shadow: 0 1px 3px rgba(0,0,0,0.13); } a { - color: #21759b; + color: #0074a2; text-decoration: none; } a:hover { - color: #d54e21; + color: #2ea2cc; } h1 { - border-bottom: 1px solid #dadada; + border-bottom: 1px solid #dedede; clear: both; color: #666; - font: 24px Georgia, "Times New Roman", Times, serif; - margin: 30px 0 0 0; + font-size: 24px; + margin: 30px 0; padding: 0; padding-bottom: 7px; + font-weight: normal; } h2 { @@ -44,7 +46,7 @@ p, li, dd, dt { } code, .code { - font-size: 14px; + font-family: Consolas, Monaco, monospace; } ul, ol, dl { @@ -64,25 +66,24 @@ abbr { text-align:center } #logo a { - background-image: url('../images/wordpress-logo.png?ver=20120216'); - background-size: 274px 63px; - background-position: top center; + background-image: url('../images/wordpress-logo.svg?ver=20131107'); + background-size: 80px 80px; + background-position: center top; background-repeat: no-repeat; - height: 67px; + color: #999; + height: 80px; + font-size: 20px; + font-weight: normal; + line-height: 1.3em; + margin: -130px auto 25px; + padding: 0; + text-decoration: none; + width: 80px; text-indent: -9999px; outline: none; overflow: hidden; display: block; } -@media print, - (-o-min-device-pixel-ratio: 5/4), - (-webkit-min-device-pixel-ratio: 1.25), - (min-resolution: 120dpi) { - #logo a { - background-image: url('../images/wordpress-logo-2x.png?ver=20120412'); - background-size: 274px 63px; - } -} .step { margin: 20px 0 15px; } @@ -95,10 +96,12 @@ abbr { } textarea { border: 1px solid #dfdfdf; - -webkit-border-radius: 3px; - border-radius: 3px; - font-family: sans-serif; - width: 695px; + font-family: "Open Sans", sans-serif; + width: 100%; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -ms-box-sizing: border-box; /* ie8 only */ + box-sizing: border-box; } .form-table { @@ -119,7 +122,6 @@ textarea { font-size: 14px; text-align: left; padding: 16px 20px 10px 0; - border-bottom: 8px solid #fff; width: 140px; vertical-align: top; } @@ -137,11 +139,14 @@ textarea { .form-table input { line-height: 20px; font-size: 15px; - padding: 2px; - border: 1px #dfdfdf solid; - -webkit-border-radius: 3px; - border-radius: 3px; - font-family: sans-serif; + padding: 3px 5px; + border: 1px solid #ddd; + box-shadow: inset 0 1px 2px rgba(0,0,0,0.07); +} + +input, +submit { + font-family: "Open Sans", sans-serif; } .form-table input[type=text], @@ -216,8 +221,6 @@ textarea { .message { border: 1px solid #c00; - -webkit-border-radius: 3px; - border-radius: 3px; padding: 0.5em 0.7em; margin: 5px 0 15px; background-color: #ffebe8; @@ -235,3 +238,57 @@ textarea { #pass2 { direction: ltr; } + +@media only screen and (max-width: 799px) { + body { + margin-top: 115px; + } + #logo a { + margin: -125px auto 30px; + } +} + +@media screen and ( max-width: 782px ) { + + .form-table { + margin-top: 0; + } + + .form-table th, + .form-table td { + display: block; + width: auto; + vertical-align: middle; + } + + .form-table th { + padding: 20px 0 0; + } + + .form-table td { + padding: 5px 0; + border: 0; + margin: 0; + } + + textarea, + input { + font-size: 16px; + } + + .form-table td input[type="text"], + .form-table td input[type="password"], + .form-table td select, + .form-table td textarea, + .form-table span.description { + width: 100%; + font-size: 16px; + line-height: 1.5; + padding: 7px 10px; + display: block; + max-width: none; + box-sizing: border-box; + -mox-box-sizing: border-box; + } + +} diff --git a/src/wp-admin/install.php b/src/wp-admin/install.php index 0b6ac2edb3..587d79ade9 100644 --- a/src/wp-admin/install.php +++ b/src/wp-admin/install.php @@ -56,6 +56,7 @@ function display_header() { > + <?php _e( 'WordPress › Installation' ); ?> + diff --git a/src/wp-admin/maint/repair.php b/src/wp-admin/maint/repair.php index 98bf579081..7691e7cd7a 100644 --- a/src/wp-admin/maint/repair.php +++ b/src/wp-admin/maint/repair.php @@ -14,6 +14,7 @@ header( 'Content-Type: text/html; charset=utf-8' ); > + <?php _e( 'WordPress › Database Repair' ); ?> ' . __( 'To allow use of this page to automatically repair database problems, please add the following line to your wp-config.php file. Once this line is added to your config, reload this page.' ) . "

define('WP_ALLOW_REPAIR', true);"; + echo '

' . __( 'To allow use of this page to automatically repair database problems, please add the following line to your wp-config.php file. Once this line is added to your config, reload this page.' ) . "

define('WP_ALLOW_REPAIR', true);

"; } elseif ( isset( $_GET['repair'] ) ) { $optimize = 2 == $_GET['repair']; $okay = true; @@ -103,7 +104,7 @@ if ( ! defined( 'WP_ALLOW_REPAIR' ) ) { $problem_output .= "$table: $problem\n"; echo '

'; } else { - echo '

' . __( 'Repairs complete. Please remove the following line from wp-config.php to prevent this page from being used by unauthorized users.' ) . "

define('WP_ALLOW_REPAIR', true);"; + echo '

' . __( 'Repairs complete. Please remove the following line from wp-config.php to prevent this page from being used by unauthorized users.' ) . "

define('WP_ALLOW_REPAIR', true);

"; } } else { if ( isset( $_GET['referrer'] ) && 'is_blog_installed' == $_GET['referrer'] ) diff --git a/src/wp-admin/network/sites.php b/src/wp-admin/network/sites.php index 37f64407e4..9d1d7ce64a 100644 --- a/src/wp-admin/network/sites.php +++ b/src/wp-admin/network/sites.php @@ -65,6 +65,7 @@ if ( isset( $_GET['action'] ) ) { > + <?php _e( 'WordPress › Confirm your action' ); ?> diff --git a/src/wp-admin/setup-config.php b/src/wp-admin/setup-config.php index d8ae356060..2bcdfd2a08 100644 --- a/src/wp-admin/setup-config.php +++ b/src/wp-admin/setup-config.php @@ -99,6 +99,7 @@ function setup_config_display_header() { > + <?php _e( 'WordPress › Setup Configuration File' ); ?> diff --git a/src/wp-admin/upgrade.php b/src/wp-admin/upgrade.php index 24fe976029..675a901d3a 100644 --- a/src/wp-admin/upgrade.php +++ b/src/wp-admin/upgrade.php @@ -50,6 +50,7 @@ else > + <?php _e( 'WordPress › Update' ); ?>