WordPress.org

Make WordPress Core

Ticket #32589: 32589-install.php

File 32589-install.php, 5.0 KB (added by MikeHansenMe, 7 years ago)

Add the password UI to install page

Line 
1Index: src/wp-admin/css/install.css
2===================================================================
3--- src/wp-admin/css/install.css        (revision 33095)
4+++ src/wp-admin/css/install.css        (working copy)
5@@ -200,36 +200,60 @@
6 
7 #pass-strength-result {
8        background-color: #eee;
9-       border-color: #ddd !important;
10-       border-style: solid;
11-       border-width: 1px;
12-       margin: 5px 5px 5px 0;
13-       padding: 5px;
14+       border: 1px solid #ddd;
15+       padding: 3px 5px;
16        text-align: center;
17-       width: 200px;
18-       display: none;
19+       width: 218px;
20+       -webkit-box-sizing: border-box;
21+       -moz-box-sizing: border-box;
22+       box-sizing: border-box;
23+       opacity: 0;
24 }
25 
26-#pass-strength-result.bad {
27-       background-color: #ffb78c;
28-       border-color: #ff853c !important;
29-}
30+#pass-strength-result.short {
31+       opacity: 1;
32+       background-color: #ffa0a0;
33+       border-color: #f04040;
34+}
35 
36-#pass-strength-result.good {
37-       background-color: #ffec8b;
38-       border-color: #ffcc00 !important;
39-}
40+#pass-strength-result.bad {
41+       opacity: 1;
42+       background-color: #ffb78c;
43+       border-color: #ff853c;
44+}
45 
46-#pass-strength-result.short {
47-       background-color: #ffa0a0;
48-       border-color: #f04040 !important;
49-}
50+#pass-strength-result.good {
51+       opacity: 1;
52+       background-color: #ffec8b;
53+       border-color: #fc0;
54+}
55 
56-#pass-strength-result.strong {
57-       background-color: #c3ff88;
58-       border-color: #8dff1c !important;
59-}
60+#pass-strength-result.strong {
61+       opacity: 1;
62+       background-color: #c3ff88;
63+       border-color: #8dff1c;
64+}
65 
66+#pass1.short {
67+       border-color: #f04040;
68+}
69+
70+#pass1.bad {
71+       border-color: #ff853c;
72+}
73+
74+#pass1.good {
75+       border-color: #fc0;
76+}
77+
78+#pass1.strong {
79+       border-color: #8dff1c;
80+}
81+
82+.pw-weak{
83+       display:none;
84+}
85+
86 .message {
87        border: 1px solid #c00;
88        padding: 0.5em 0.7em;
89@@ -374,6 +398,8 @@
90        vertical-align: top;
91 }
92 
93+
94+
95 /**
96  * HiDPI Displays
97  */
98Index: src/wp-admin/install.php
99===================================================================
100--- src/wp-admin/install.php    (revision 33095)
101+++ src/wp-admin/install.php    (working copy)
102@@ -128,18 +128,40 @@
103                        </td>
104                </tr>
105                <?php if ( ! $user_table ) : ?>
106-               <tr>
107+               <tr class="form-field form-required user-pass1-wrap">
108                        <th scope="row">
109-                               <label for="pass1"><?php _e('Password, twice'); ?></label>
110-                               <p><?php _e('A password will be automatically generated for you if you leave this blank.'); ?></p>
111+                               <label for="pass1">
112+                                       <?php _e( 'Password' ); ?>
113+                                       <span class="description hide-if-js"><?php /* translators: password input field */_e( '(required)' ); ?></span>
114+                               </label>
115                        </th>
116                        <td>
117-                               <input name="admin_password" type="password" id="pass1" size="25" value="" />
118-                               <p><input name="admin_password2" type="password" id="pass2" size="25" value="" /></p>
119-                               <div id="pass-strength-result"><?php _e('Strength indicator'); ?></div>
120-                               <p><?php echo wp_get_password_hint(); ?></p>
121+                               <button type="button" class="button button-secondary wp-generate-pw hide-if-no-js"><?php _e( 'Show password' ); ?></button>
122+                               <div class="wp-pwd hide-if-js">
123+                                       <?php $initial_password = wp_generate_password( 24 ); ?>
124+                                       <input type="password" name="admin_password" id="pass1" class="regular-text" autocomplete="off" data-reveal="1" data-pw="<?php echo esc_attr( $initial_password ); ?>" />
125+                                       <button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0">
126+                                               <span class="dashicons dashicons-visibility"></span>
127+                                               <span class="text">hide</span>
128+                                       </button>
129+                                       <div style="display:none" id="pass-strength-result"></div>
130+                               </div>
131+                               <p><span class="description"><?php _e( 'A password reset link will be sent to the user via email' ); ?></span></p>
132                        </td>
133                </tr>
134+               <tr class="form-field form-required user-pass2-wrap hide-if-js">
135+                       <th scope="row"><label for="pass2"><?php _e( 'Repeat Password' ); ?> <span class="description"><?php /* translators: password input field */_e('(required)'); ?></span></label></th>
136+                       <td>
137+                       <input name="admin_password2" type="password" id="pass2" autocomplete="off" />
138+                       </td>
139+               </tr>
140+               <tr class="pw-weak">
141+                       <th><label for="pw-weak"><?php _e( 'Confirm Password' ); ?></label></th>
142+                       <td>
143+                               <input type="checkbox" name="pw-weak" class="pw-checkbox" />
144+                               <?php _e( 'Confirm use of weak password' ); ?>
145+                       </td>
146+               </tr>
147                <?php endif; ?>
148                <tr>
149                        <th scope="row"><label for="admin_email"><?php _e( 'Your E-mail' ); ?></label></th>
150@@ -151,7 +173,7 @@
151                        <td colspan="2"><label><input type="checkbox" name="blog_public" id="blog_public" value="1" <?php checked( $blog_public ); ?> /> <?php _e( 'Allow search engines to index this site.' ); ?></label></td>
152                </tr>
153        </table>
154-       <p class="step"><input type="submit" name="Submit" value="<?php esc_attr_e( 'Install WordPress' ); ?>" class="button button-large" /></p>
155+       <p class="step"><input id="submit" type="submit" name="Submit" value="<?php esc_attr_e( 'Install WordPress' ); ?>" class="button button-large" /></p>
156        <input type="hidden" name="language" value="<?php echo isset( $_REQUEST['language'] ) ? esc_attr( $_REQUEST['language'] ) : ''; ?>" />
157 </form>
158 <?php