WordPress.org

Make WordPress Core

Changeset 22314


Ignore:
Timestamp:
10/26/2012 07:40:39 PM (8 years ago)
Author:
azaozz
Message:

Buttons:

  • 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

Location:
trunk
Files:
9 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-admin/css/ie.css

    r22289 r22314  
    238238}
    239239
    240 button,
     240.button,
    241241input[type="reset"],
    242242input[type="button"],
    243243input[type="submit"] {
    244     padding: 2px 8px;
    245 }
    246 
    247 button.button-large,
     244    padding: 0 8px;
     245    line-height: 20px;
     246    height: auto;
     247}
     248
     249.button.button-large,
    248250input[type="reset"].button-large,
    249251input[type="button"].button-large,
    250252input[type="submit"].button-large {
    251     padding: 4px 12px;
    252 }
    253 
    254 button.button-small,
     253    padding: 0 10px;
     254    line-height: 24px;
     255    height: auto;
     256}
     257
     258.button.button-small,
    255259input[type="reset"].button-small,
    256260input[type="button"].button-small,
    257261input[type="submit"].button-small {
    258     padding: 0 8px;
     262    padding: 0 6px;
     263    line-height: 16px;
     264    height: auto;
    259265}
    260266
    261267a.button {
    262268    margin: 1px;
    263     padding: 3px 8px;
     269    padding: 1px 9px 2px;
     270}
     271
     272a.button.button-large {
     273    padding: 1px 11px 2px;
    264274}
    265275
    266276a.button.button-small {
    267     padding: 1px 8px;
     277    padding: 1px 7px 2px;
    268278}
    269279
  • trunk/wp-admin/css/install.css

    r21592 r22314  
    7171    padding: 0;
    7272}
    73 
    74 .submit input,
    75 .button,
    76 .button-secondary {
    77     font-family: sans-serif;
    78     text-decoration: none;
    79     font-size: 14px !important;
    80     line-height: 16px;
    81     padding: 6px 12px;
    82     cursor: pointer;
    83     border: 1px solid #bbb;
    84     color: #464646;
    85     -webkit-border-radius: 15px;
    86     border-radius:         15px;
    87     -webkit-box-sizing: content-box;
    88     -moz-box-sizing:    content-box;
    89     box-sizing:         content-box;
    90     background: #f2f2f2;
    91     background-image: -webkit-gradient(linear, left bottom, left top, from(#ededed), to(#fff));
    92     background-image: -webkit-linear-gradient(bottom, #ededed, #fff);
    93     background-image:    -moz-linear-gradient(bottom, #ededed, #fff);
    94     background-image:      -o-linear-gradient(bottom, #ededed, #fff);
    95     background-image: linear-gradient(to top, #ededed, #fff);
    96 }
    97 
    98 .button:hover,
    99 .button-secondary:hover,
    100 .submit input:hover {
    101     color: #000;
    102     border-color: #666;
    103 }
    104 
    105 .button:active,
    106 .submit input:active,
    107 .button-secondary:active {
    108     background: #eee;
    109     background-image: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
    110     background-image: -webkit-linear-gradient(top, #ededed, #fff);
    111     background-image:    -moz-linear-gradient(top, #ededed, #fff);
    112     background-image:      -o-linear-gradient(top, #ededed, #fff);
    113     background-image: linear-gradient(to bottom, #ededed, #fff);
    114 }
    115 
     73.step .button-large {
     74    font-size: 14px;
     75}
    11676textarea {
    11777    border: 1px solid #dfdfdf;
  • trunk/wp-admin/css/wp-admin.css

    r22290 r22314  
    22632263
    22642264.welcome-panel .welcome-button {
    2265     margin: -9px 0 3px;
    2266     padding: 1em 3em;
    2267     font: normal 15px/1 sans-serif;
     2265    font: normal 15px sans-serif;
     2266    height: 46px;
     2267    line-height: 44px;
     2268    margin: -9px 0 3px;
     2269    padding: 0 36px;
    22682270}
    22692271
  • trunk/wp-admin/install.php

    r20715 r22314  
    5959    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    6060    <title><?php _e( 'WordPress &rsaquo; Installation' ); ?></title>
    61     <?php wp_admin_css( 'install', true ); ?>
     61    <?php
     62    wp_admin_css( 'install', true );
     63    wp_admin_css( 'buttons', true );
     64    ?>
    6265</head>
    6366<body<?php if ( is_rtl() ) echo ' class="rtl"'; ?>>
     
    135138        </tr>
    136139    </table>
    137     <p class="step"><input type="submit" name="Submit" value="<?php esc_attr_e( 'Install WordPress' ); ?>" class="button" /></p>
     140    <p class="step"><input type="submit" name="Submit" value="<?php esc_attr_e( 'Install WordPress' ); ?>" class="button button-large" /></p>
    138141</form>
    139142<?php
     
    143146if ( is_blog_installed() ) {
    144147    display_header();
    145     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>' );
     148    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>' );
    146149}
    147150
     
    242245</table>
    243246
    244 <p class="step"><a href="../wp-login.php" class="button"><?php _e( 'Log In' ); ?></a></p>
     247<p class="step"><a href="../wp-login.php" class="button button-large"><?php _e( 'Log In' ); ?></a></p>
    245248
    246249<?php
  • trunk/wp-admin/maint/repair.php

    r20953 r22314  
    1717    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    1818    <title><?php _e( 'WordPress &rsaquo; Database Repair' ); ?></title>
    19     <?php wp_admin_css( 'install', true ); ?>
     19    <?php
     20    wp_admin_css( 'install', true );
     21    wp_admin_css( 'buttons', true );
     22    ?>
    2023</head>
    2124<body>
     
    103106        echo '<p>' . __( 'WordPress can automatically look for some common database problems and repair them. Repairing can take a while, so please be patient.' ) . '</p>';
    104107?>
    105     <p class="step"><a class="button" href="repair.php?repair=1"><?php _e( 'Repair Database' ); ?></a></p>
     108    <p class="step"><a class="button button-large" href="repair.php?repair=1"><?php _e( 'Repair Database' ); ?></a></p>
    106109    <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>
    107     <p class="step"><a class="button" href="repair.php?repair=2"><?php _e( 'Repair and Optimize Database' ); ?></a></p>
     110    <p class="step"><a class="button button-large" href="repair.php?repair=2"><?php _e( 'Repair and Optimize Database' ); ?></a></p>
    108111<?php
    109112}
  • trunk/wp-admin/setup-config.php

    r22124 r22314  
    9797<title><?php _e( 'WordPress &rsaquo; Setup Configuration File' ); ?></title>
    9898<link rel="stylesheet" href="css/install.css?ver=<?php echo preg_replace( '/[^0-9a-z\.-]/i', '', $wp_version ); ?>" type="text/css" />
     99<link rel="stylesheet" href="../wp-includes/css/buttons.css?ver=<?php echo preg_replace( '/[^0-9a-z\.-]/i', '', $wp_version ); ?>" type="text/css" />
    99100
    100101</head>
     
    120121<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>
    121122
    122 <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>
     123<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>
    123124<?php
    124125    break;
     
    157158    </table>
    158159    <?php if ( isset( $_GET['noapi'] ) ) { ?><input name="noapi" type="hidden" value="1" /><?php } ?>
    159     <p class="step"><input name="submit" type="submit" value="<?php echo htmlspecialchars( __( 'Submit' ), ENT_QUOTES ); ?>" class="button" /></p>
     160    <p class="step"><input name="submit" type="submit" value="<?php echo htmlspecialchars( __( 'Submit' ), ENT_QUOTES ); ?>" class="button button-large" /></p>
    160161</form>
    161162<?php
     
    166167        $$key = trim( stripslashes( $_POST[ $key ] ) );
    167168
    168     $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>';
     169    $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>';
    169170
    170171    if ( empty( $prefix ) )
     
    265266?></textarea>
    266267<p><?php _e( 'After you&#8217;ve done that, click &#8220;Run the install.&#8221;' ); ?></p>
    267 <p class="step"><a href="install.php" class="button"><?php _e( 'Run the install' ); ?></a></p>
     268<p class="step"><a href="install.php" class="button button-large"><?php _e( 'Run the install' ); ?></a></p>
    268269<script>
    269270(function(){
     
    285286<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>
    286287
    287 <p class="step"><a href="install.php" class="button"><?php _e( 'Run the install' ); ?></a></p>
     288<p class="step"><a href="install.php" class="button button-large"><?php _e( 'Run the install' ); ?></a></p>
    288289<?php
    289290    endif;
  • trunk/wp-includes/css/buttons.css

    r22289 r22314  
    4040.button-secondary {
    4141    display: inline-block;
    42     vertical-align: middle;
    4342    text-decoration: none;
    4443    font-size: 12px;
    45     line-height: 1.45em;
     44    line-height: 23px;
     45    height: 24px;
    4646    margin: 0;
    47     padding: 3px 10px;
     47    padding: 0 10px 1px;
    4848    cursor: pointer;
    4949    border-width: 1px;
     
    6262input[type="button"]::-moz-focus-inner,
    6363input[type="submit"]::-moz-focus-inner {
    64     border: 1px solid transparent;
     64    border-width: 1px 0;
     65    border-style: solid none;
     66    border-color: transparent;
    6567    padding: 0;
    6668}
     
    6870.button.button-large,
    6971.button-group.button-large .button {
    70     padding: 5px 12px;
     72    height: 30px;
     73    line-height: 28px;
     74    padding: 0 12px 2px;
    7175}
    7276
    7377.button.button-small,
    7478.button-group.button-small .button {
    75     padding: 2px 8px;
     79    height: 21px;
     80    line-height: 20px;
     81    padding: 0 8px 1px;
    7682}
    7783
  • trunk/wp-includes/functions.php

    r22303 r22314  
    21272127            color: #D54E21;
    21282128        }
    2129 
    21302129        .button {
    2131             font-family: sans-serif;
     2130            display: inline-block;
    21322131            text-decoration: none;
    2133             font-size: 14px !important;
    2134             line-height: 16px;
    2135             padding: 6px 12px;
     2132            font-size: 14px;
     2133            line-height: 23px;
     2134            height: 24px;
     2135            margin: 0;
     2136            padding: 0 10px 1px;
    21362137            cursor: pointer;
    2137             border: 1px solid #bbb;
    2138             color: #464646;
    2139             -webkit-border-radius: 15px;
    2140             border-radius: 15px;
    2141             -moz-box-sizing: content-box;
    2142             -webkit-box-sizing: content-box;
    2143             box-sizing: content-box;
    2144             background-color: #f5f5f5;
    2145             background-image: -ms-linear-gradient(top, #ffffff, #f2f2f2);
    2146             background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
    2147             background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
    2148             background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f2f2f2));
    2149             background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
    2150             background-image: linear-gradient(top, #ffffff, #f2f2f2);
    2151         }
    2152 
    2153         .button:hover {
    2154             color: #000;
    2155             border-color: #666;
     2138            border-width: 1px;
     2139            border-style: solid;
     2140            -webkit-border-radius: 3px;
     2141            border-radius: 3px;
     2142            white-space: nowrap;
     2143            -webkit-box-sizing: border-box;
     2144            -moz-box-sizing:    border-box;
     2145            box-sizing:         border-box;
     2146            background: #f3f3f3;
     2147            background-image: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#f4f4f4));
     2148            background-image: -webkit-linear-gradient(top, #fefefe, #f4f4f4);
     2149            background-image:    -moz-linear-gradient(top, #fefefe, #f4f4f4);
     2150            background-image:      -o-linear-gradient(top, #fefefe, #f4f4f4);
     2151            background-image:   linear-gradient(to bottom, #fefefe, #f4f4f4);
     2152            border-color: #bbb;
     2153            color: #333;
     2154            text-shadow: 0 1px 0 #fff;
     2155        }
     2156       
     2157        .button.button-large {
     2158            height: 29px;
     2159            line-height: 28px;
     2160            padding: 0 12px;
     2161        }
     2162
     2163        .button:hover,
     2164        .button:focus {
     2165            background: #f3f3f3;
     2166            background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f3f3f3));
     2167            background-image: -webkit-linear-gradient(top, #fff, #f3f3f3);
     2168            background-image:    -moz-linear-gradient(top, #fff, #f3f3f3);
     2169            background-image:     -ms-linear-gradient(top, #fff, #f3f3f3);
     2170            background-image:      -o-linear-gradient(top, #fff, #f3f3f3);
     2171            background-image:   linear-gradient(to bottom, #fff, #f3f3f3);
     2172            border-color: #999;
     2173            color: #222;
     2174        }
     2175       
     2176        .button:focus  {
     2177            -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.2);
     2178            box-shadow: 1px 1px 1px rgba(0,0,0,.2);
    21562179        }
    21572180
    21582181        .button:active {
    2159             background-image: -ms-linear-gradient(top, #f2f2f2, #ffffff);
    2160             background-image: -moz-linear-gradient(top, #f2f2f2, #ffffff);
    2161             background-image: -o-linear-gradient(top, #f2f2f2, #ffffff);
    2162             background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#ffffff));
    2163             background-image: -webkit-linear-gradient(top, #f2f2f2, #ffffff);
    2164             background-image: linear-gradient(top, #f2f2f2, #ffffff);
     2182            outline: none;
     2183            background: #eee;
     2184            background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f4f4), to(#fefefe));
     2185            background-image: -webkit-linear-gradient(top, #f4f4f4, #fefefe);
     2186            background-image:    -moz-linear-gradient(top, #f4f4f4, #fefefe);
     2187            background-image:     -ms-linear-gradient(top, #f4f4f4, #fefefe);
     2188            background-image:      -o-linear-gradient(top, #f4f4f4, #fefefe);
     2189            background-image:   linear-gradient(to bottom, #f4f4f4, #fefefe);
     2190            border-color: #999;
     2191            color: #333;
     2192            text-shadow: 0 -1px 0 #fff;
     2193            -webkit-box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
     2194            box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
    21652195        }
    21662196
  • trunk/wp-load.php

    r21715 r22314  
    5858    $die .= '<p>' . __( "Need more help? <a href='http://codex.wordpress.org/Editing_wp-config.php'>We got it</a>." ) . '</p>';
    5959    $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>';
    60     $die .= '<p><a href="' . $path . '" class="button">' . __( "Create a Configuration File" ) . '</a>';
     60    $die .= '<p><a href="' . $path . '" class="button button-large">' . __( "Create a Configuration File" ) . '</a>';
    6161
    6262    wp_die( $die, __( 'WordPress &rsaquo; Error' ) );
Note: See TracChangeset for help on using the changeset viewer.