diff --git a/app/src/frontend/app.js b/app/src/frontend/app.js index 1153ab41..ed9f65e6 100644 --- a/app/src/frontend/app.js +++ b/app/src/frontend/app.js @@ -8,6 +8,7 @@ import Login from './login'; import ColouringMap from './map'; import SignUp from './signup'; import Welcome from './welcome'; +import Legend from './legend'; import '../../node_modules/bootstrap/dist/css/bootstrap.min.css'; import './main.css' @@ -37,21 +38,32 @@ class App extends React.Component {
- - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + +
); diff --git a/app/src/frontend/legend.js b/app/src/frontend/legend.js new file mode 100644 index 00000000..dc3ce9ee --- /dev/null +++ b/app/src/frontend/legend.js @@ -0,0 +1,143 @@ +import React from 'react'; + +const Legend = () => ( +
+

Maps

+
+

Age

+
+
+ Year Built
+
+
    +
  • + - + >=2000 +
    • +
  • + - + 1980-2000 +
    • +
  • + - + 1960-1980 +
    • +
  • + - + 1940-1960 +
    • +
  • + - + 1920-1940 +
    • +
  • + - + 1900-1920 +
    • +
  • + - + 1880-1900 +
    • +
  • + - + 1860-1880 +
    • +
  • + - + 1840-1860 +
    • +
  • + - + 1820-1840 +
    • +
  • + - + 1800-1820 +
    • +
  • + - + 1780-1800 +
    • +
  • + - + 1760-1780 +
    • +
  • + - + 1740-1760 +
    • +
  • + - + 1720-1740 +
    • +
  • + - + 1700-1720 +
    • +
  • + - + 1680-1700 +
    • +
  • + - + 1660-1680 +
    • +
  • + - + <1660 +
    • +
+
+
+
+
+

Size

+
+
+ Number of storeys +
+
+
    +
  • + - + >20 +
    • +
  • + - + 10-20 +
    • +
  • + - + 5-10 +
    • +
  • + - + 4 +
    • +
  • + - + 3 +
    • +
  • + - + 2 +
    • +
  • + - + 1 +
    • + +
+
+
+
+
+); + +export default Legend;