Make WordPress Core

Changeset 22314


Ignore:
Timestamp:
10/26/2012 07:40:39 PM (14 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.