mirror of
https://github.com/WordPress/five-for-the-future.git
synced 2025-07-13 22:05:44 +03:00
Create Pledge: Make form functional (#31)
This broadly enables & styles the pledge forms across the frontend and wp-admin. - Switches field `readonly` control to a variable called `$readonly` - Create `PledgeMeta\get_pledge_meta()` which will fetch data from `$_POST`, a pledge post, or defaults. - Add Number of Employees field - Update form content to match mockup: - fields now have help text - success message uses content from mockup - logo field is moved to the "org info" section - Style form in theme, add some similar styles to the admin Fixes #7, fixes #28
This commit is contained in:
parent
0111c36db4
commit
0f675ae6c3
13 changed files with 313 additions and 127 deletions
|
@ -8,5 +8,6 @@
|
|||
@import "../../../pub/wporg/css/objects/notices";
|
||||
@import "buttons";
|
||||
@import "image";
|
||||
@import "pledge-form";
|
||||
@import "pullquote";
|
||||
@import "site-header";
|
||||
|
|
59
themes/wporg-5ftf/css/objects/_pledge-form.scss
Normal file
59
themes/wporg-5ftf/css/objects/_pledge-form.scss
Normal file
|
@ -0,0 +1,59 @@
|
|||
.pledge-form {
|
||||
|
||||
.form-field {
|
||||
margin-bottom: ms(4);
|
||||
|
||||
label {
|
||||
margin-bottom: ms(-5);
|
||||
display: inline-block;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: $color__text-input;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="url"],
|
||||
input[type="number"],
|
||||
input[type="email"],
|
||||
textarea {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: ms(-5) ms(-2);
|
||||
background: $color__background-input;
|
||||
border: 1px solid $color__border-input;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
input[type="number"] {
|
||||
max-width: 10em;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
> p {
|
||||
margin-top: ms(-5);
|
||||
font-size: ms(-2);
|
||||
}
|
||||
}
|
||||
|
||||
.form-field__logo {
|
||||
|
||||
input {
|
||||
padding: ms(-6) 0;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.form-field__agree {
|
||||
|
||||
label {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
display: inline-block;
|
||||
height: auto;
|
||||
padding: ms(-3) ms(0);
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
|
@ -4,6 +4,7 @@ $color__background-hr: #eee;
|
|||
$color__background-button: #eee;
|
||||
$color__background-pre: #eee;
|
||||
$color__background-ins: #fff9c0;
|
||||
$color__background-input: #f9f9f9;
|
||||
|
||||
$color__text-screen: #21759b;
|
||||
$color__text-input: #32373c;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue