vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-08-05 08:50:12 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Refine UI for FTP modal and shiny updates

Browse Source 
Numerous changes to make the FTP modal experience a good one.  These include:
 * Update HTML used by both the form here and the form on the standalone screen
 * Allow users to cancel FTP install
 * Focus locking in the modal
 * Focus on modal form on load
 * ARIA Attributes
 * Style Enhancements
 * Add low screen height (such as phone and some tablets) friendly experience for entering credentials

Props ericlewis, afercia 
Fixes #31608



git-svn-id: https://develop.svn.wordpress.org/trunk@31949 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Aaron Jorbin
2015-04-01 02:47:55 +00:00
parent 235b83b4c0
commit 9932d7973d
4 changed files with 227 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
src/wp-admin/css/forms.css
View File

@@ -864,11 +864,58 @@ table.form-table td .updated p {
margin: 25px;
}
.request-filesystem-credentials-dialog-content input[type="text"],
.request-filesystem-credentials-dialog-content input[type="password"] {
width: 85%;
.request-filesystem-credentials-form input[type="text"],
.request-filesystem-credentials-form input[type="password"] {
display: block;
}
.request-filesystem-credentials-dialog input[type="text"],
.request-filesystem-credentials-dialog input[type="password"] {
width: 100%;
}
.request-filesystem-credentials-form .field-title {
font-weight: 600;
}
.request-filesystem-credentials-dialog label[for="hostname"],
.request-filesystem-credentials-dialog label[for="public_key"],
.request-filesystem-credentials-dialog label[for="private_key"] {
display: block;
margin-bottom: 1em;
}
.request-filesystem-credentials-dialog .ftp-username,
.request-filesystem-credentials-dialog .ftp-password {
float: left;
width: 48%;
}
.request-filesystem-credentials-dialog .ftp-password {
margin-left: 4%;
}
.request-filesystem-credentials-dialog .request-filesystem-credentials-action-buttons {
text-align: right;
}
.request-filesystem-credentials-dialog label[for="ftp"] {
margin-right: 10px;
}
#request-filesystem-credentials-dialog .button:not(:last-child) {
margin-right: 10px;
}
#request-filesystem-credentials-form .cancel-button {
display: none;
}
#request-filesystem-credentials-dialog .cancel-button {
display: inline;
}
/* =Media Queries
-------------------------------------------------------------- */
@@ -1098,6 +1145,20 @@ table.form-table td .updated p {
max-width: 400px;
width: auto;
}
}
@media only screen and (max-height: 480px) {
/* Request Credentials */
.request-filesystem-credentials-dialog .notification-dialog{
width: 100%;
height: 100%;
position: fixed;
top: 0;
margin: 0;
left: 0;
overflow-y: auto;
}
}
/* Smartphone */