2020-05-22 17:33:04 +02:00
|
|
|
import { Component } from 'react'
|
2018-01-31 10:35:27 +01:00
|
|
|
|
2020-05-18 23:44:18 +02:00
|
|
|
export default class Contact extends Component {
|
2018-01-31 10:35:27 +01:00
|
|
|
state = { message: '' }
|
|
|
|
|
2019-11-11 04:24:53 +01:00
|
|
|
render() {
|
2018-01-31 10:35:27 +01:00
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
<h1>This is the Contact page</h1>
|
|
|
|
<form onSubmit={this.handleSubmit}>
|
|
|
|
<label>
|
|
|
|
<span>Message:</span>
|
2019-01-18 20:40:23 +01:00
|
|
|
<textarea onChange={this.handleInput} value={this.state.message} />
|
2018-01-31 10:35:27 +01:00
|
|
|
</label>
|
2019-11-11 04:24:53 +01:00
|
|
|
<button type="submit">submit</button>
|
2018-01-31 10:35:27 +01:00
|
|
|
</form>
|
|
|
|
|
|
|
|
<style jsx>{`
|
|
|
|
label span {
|
|
|
|
display: block;
|
|
|
|
margin-bottom: 12px;
|
|
|
|
}
|
|
|
|
|
|
|
|
textarea {
|
|
|
|
min-width: 300px;
|
|
|
|
min-height: 120px;
|
|
|
|
}
|
|
|
|
|
|
|
|
button {
|
|
|
|
margin-top: 12px;
|
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
`}</style>
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
2020-05-18 21:24:37 +02:00
|
|
|
handleInput = (e) => {
|
2018-01-31 10:35:27 +01:00
|
|
|
this.setState({ message: e.target.value })
|
|
|
|
}
|
|
|
|
|
2020-05-18 21:24:37 +02:00
|
|
|
handleSubmit = (e) => {
|
2018-01-31 10:35:27 +01:00
|
|
|
e.preventDefault()
|
|
|
|
global.analytics.track('Form Submitted', {
|
2019-11-11 04:24:53 +01:00
|
|
|
message: this.state.message,
|
2018-01-31 10:35:27 +01:00
|
|
|
})
|
|
|
|
this.setState({ message: '' })
|
|
|
|
}
|
|
|
|
}
|