YourWishes/domsPlace
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added fade to form on contact page

Browse Source
This commit is contained in:
Dominic Masters
2018-06-08 12:47:57 +10:00
parent 7120067f48
commit ce926e09a9
1 changed files with 33 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
public/page/contact/ContactPage.jsx
View File

@@ -26,6 +26,7 @@ import { connect } from 'react-redux';
import Page, { PageBoundary } from './../Page'; import Page, { PageBoundary } from './../Page';
import Input, { Form, InputGroup, TextArea, Label, ButtonGroup } from './../../input/input'; import Input, { Form, InputGroup, TextArea, Label, ButtonGroup } from './../../input/input';
import Language from './../../language/Language'; import Language from './../../language/Language';
import ElementScrollFader from './../../animation/fade/ElementScrollFader';
import Section, { import Section, {
BodySection, BodySection,
ClearSection, ClearSection,
@@ -47,39 +48,41 @@ class ContactPage extends React.Component {
<PageBoundary small> <PageBoundary small>
<SplitSection> <SplitSection>
<Split> <Split>
<BodySection> <ElementScrollFader>
<Form> <BodySection>
<InputGroup> <Form>
<Label>{ Language.get("pages.contact.name.label") }</Label> <InputGroup>
<Input <Label>{ Language.get("pages.contact.name.label") }</Label>
type="text" <Input
placeholder={ Language.get("pages.contact.name.placeholder") } type="text"
/> placeholder={ Language.get("pages.contact.name.placeholder") }
</InputGroup> />
</InputGroup>
<InputGroup > <InputGroup >
<Label>{ Language.get("pages.contact.email.label") }</Label> <Label>{ Language.get("pages.contact.email.label") }</Label>
<Input <Input
type="email" type="email"
placeholder={ Language.get("pages.contact.email.placeholder") } placeholder={ Language.get("pages.contact.email.placeholder") }
/> />
</InputGroup> </InputGroup>
<InputGroup> <InputGroup>
<Label>{ Language.get("pages.contact.message.label") }</Label> <Label>{ Language.get("pages.contact.message.label") }</Label>
<TextArea <TextArea
placeholder={ Language.get("pages.contact.message.placeholder") } placeholder={ Language.get("pages.contact.message.placeholder") }
rows="8" rows="8"
className="p-contact-page__message" className="p-contact-page__message"
/> />
</InputGroup> </InputGroup>
<ButtonGroup> <ButtonGroup>
<Input type="submit" value={ Language.get("pages.contact.send") } primary="true" /> <Input type="submit" value={ Language.get("pages.contact.send") } primary="true" />
<Input type="reset" value={ Language.get("pages.contact.reset") } /> <Input type="reset" value={ Language.get("pages.contact.reset") } />
</ButtonGroup> </ButtonGroup>
</Form> </Form>
</BodySection> </BodySection>
</ElementScrollFader>
</Split> </Split>
</SplitSection> </SplitSection>