Add contributor agreement

Closes #317 via #382

app/src/frontend/app.tsx

@@ -18,6 +18,7 @@ import MyAccountPage from './my-account';
 import SignUp from './signup';
 import Welcome from './welcome';
 import { parseCategoryURL } from '../parse';
+import ContributorAgreementPage from './contributor-agreement';
 
 /**
  * App component
@@ -255,6 +256,7 @@ class App extends React.Component<any, any> { // TODO: add proper types
                                 logout={this.logout}
                             />
                         </Route>
+                        <Route exact path="/contributor-agreement.html" component={ContributorAgreementPage} />
                         <Route component={NotFound} />
                     </Switch>
                 </main>

app/src/frontend/contributor-agreement.tsx

@@ -0,0 +1,47 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+
+import InfoBox from './info-box';
+
+const ContributorAgreementPage : React.SFC<any> = () => (
+    <article>
+        <section className='main-col'>
+            <h1>Contributor Agreement</h1>
+
+            <InfoBox msg="This is a draft contributor agreement." />
+
+            <h2 className='h2'>Open data</h2>
+
+            <p>
+                Colouring London contributions are open data, licensed under the <a href="http://opendatacommons.org/licenses/odbl/">Open Data Commons Open Database License</a> (ODbL) by Colouring London contributors.
+            </p>
+            <p>
+                You are free to copy, distribute, transmit and adapt our data, as long as you credit Colouring London and our contributors.If you alter or build upon our data, you may distribute the result only under the same licence.
+            </p>
+
+            <h2 className='h2'>Your contributions</h2>
+
+            <p>
+                Colouring London emphasises local and community knowledge. Contributors use a variety of sources and local and expert knowledge of buildings to contribute data and verify that Colouring London is accurate and up to date.
+            </p>
+            <p>
+                When you contribute to Colouring London, you make your contributions available as open data for anyone to copy, distribute, transmit and adapt in line with the licence.
+            </p>
+            <p>
+                We are unable to accept any data derived from copyright or restricted sources, other than as covered by fair use.
+            </p>
+            <p>
+                We encourage full attribution of data sources where appropriate - more details on potential sources are documented with suggestions for each <a href="https://www.pages.colouring.london/buildingcategories">data category</a>.
+            </p>
+            <p>
+                When you make a contribution to Colouring London, you are creating a permanent, public record of all data added, removed, or changed by you.The database records the username and ID of the user making the edit, along with the time and date of the change.All of this information is also made publicly available through the website and through bulk downloads of the edit history.
+            </p>
+
+            <div className="buttons-container">
+                <Link to="sign-up.html" className="btn btn-outline-dark">Back to sign up</Link>
+            </div>
+        </section>
+    </article>
+)
+
+export default ContributorAgreementPage;

app/src/frontend/signup.tsx

@@ -135,9 +135,9 @@ class SignUp extends Component<any, any> { // TODO: add proper types
                                 onChange={this.handleChange}
                                 required />
                             <label className="form-check-label" htmlFor="confirm_conditions">
-                                I confirm that I have read and agree to the <a
+                                I confirm that I have read and agree to the <Link
-                                    href="/privacy-policy">privacy policy</a> and <a
+                                    to="/privacy-policy">privacy policy</Link> and <Link
-                                    href="/user-agreement">contributor agreement</a>.
+                                    to="/contributor-agreement.html">contributor agreement</Link>.
                             </label>
                         </div>