Manage a Pledge: Enable adding/removing contributors from wp-admin. (#99)

This updates the display of contributors into a table view, and adds the ability to add and remove contributors to existing pledges.

The display has been refactored to use JS templates & JSON contributor data– the data is output onto the page when loaded from the server, and rendered when the page finishes loading. Adding & removing contributors now submits to an admin-ajax.php endpoint, which, if successful, return the new list of contributors. This ensures the display is always up to date.

Fixes #3
This commit is contained in:
Kelly Dwan 2019-11-20 11:01:00 -05:00 committed by GitHub
parent f32d26ef47
commit 82192eea4c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 437 additions and 73 deletions

View file

@ -7,17 +7,17 @@
display: inline-block;
}
.pledge-form .form-field input[type=text],
.pledge-form .form-field input[type=url],
.pledge-form .form-field input[type=number],
.pledge-form .form-field input[type=email],
.pledge-form .form-field input[type="text"],
.pledge-form .form-field input[type="url"],
.pledge-form .form-field input[type="number"],
.pledge-form .form-field input[type="email"],
.pledge-form .form-field textarea {
display: block;
width: 100%;
padding: 8px;
}
.pledge-form .form-field input[type=number] {
.pledge-form .form-field input[type="number"] {
max-width: 10em;
height: auto;
}
@ -32,6 +32,45 @@
line-height: 1;
}
.pledge-form .form-field__agree label {
margin-bottom: 0;
.pledge-form .form-field .email-status {
font-size: 1.1em;
}
.pledge-form .email-status.is-confirmed {
color: #297531;
}
.pledge-form .email-status.is-unconfirmed {
color: #c92c2c;
}
.pledge-form .contributor-list-heading {
margin: 1rem 0;
}
.pledge-form .contributor-list {
margin-bottom: 1.5rem;
}
.pledge-contributors.pledge-status__draft .resend-confirm {
display: none;
}
.contributor-list th,
.contributor-list td,
.contributor-list th *,
.contributor-list td * {
vertical-align: middle;
}
.contributor-list .avatar {
margin-right: 8px;
}
.contributor-list .button-link-delete {
text-decoration: none;
}
.contributor-list .button-link-delete .dashicons {
margin-top: -2px;
}