a_adli/colouring-montreal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Larger legend colour keys

Browse Source
This commit is contained in:
Tom Russell 2018-10-02 21:47:59 +01:00
parent 2e0ee04dce
commit 84cfda5a58
3 changed files with 36 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
app/src/frontend/legend.css Normal file
View File

@ -0,0 +1,16 @@
/**
* Map legend
*/
.data-legend {
list-style: none;
padding: 0;
}
.data-legend .key {
display: inline-block;
width: 1.75rem;
height: 1.75rem;
text-indent: -30px;
margin: 0.125rem 0.5rem 0.125rem 0;
vertical-align: middle;
overflow: hidden;
}

39
app/src/frontend/legend.js
View File

@ -2,6 +2,7 @@ import React, { Component, Fragment } from 'react';
import { Link, NavLink } from 'react-router-dom';
import Sidebar from './sidebar';
import './legend.css';
const data_map = [
{
@ -13,23 +14,23 @@ const data_map = [
label: 'Year Built',
elements: [
{ color: '#f0eaba', text: '≥2000' },
{ color: '#fae269', text: '1980-2000' },
{ color: '#fbaf27', text: '1960-1980' },
{ color: '#e6711d', text: '1940-1960' },
{ color: '#d73d3a', text: '1920-1940' },
{ color: '#ba221c', text: '1900-1920' },
{ color: '#bb859b', text: '1880-1900' },
{ color: '#8b3654', text: '1860-1880' },
{ color: '#8f5385', text: '1840-1860' },
{ color: '#56619b', text: '1820-1840' },
{ color: '#6793b2', text: '1800-1820' },
{ color: '#83c3b3', text: '1780-1800' },
{ color: '#adc88f', text: '1760-1780' },
{ color: '#83a663', text: '1740-1760' },
{ color: '#77852d', text: '1720-1740' },
{ color: '#69814e', text: '1700-1720' },
{ color: '#d0c291', text: '1680-1700' },
{ color: '#918158', text: '1660-1680' },
{ color: '#fae269', text: '1980–2000' },
{ color: '#fbaf27', text: '1960–1980' },
{ color: '#e6711d', text: '1940–1960' },
{ color: '#d73d3a', text: '1920–1940' },
{ color: '#ba221c', text: '1900–1920' },
{ color: '#bb859b', text: '1880–1900' },
{ color: '#8b3654', text: '1860–1880' },
{ color: '#8f5385', text: '1840–1860' },
{ color: '#56619b', text: '1820–1840' },
{ color: '#6793b2', text: '1800–1820' },
{ color: '#83c3b3', text: '1780–1800' },
{ color: '#adc88f', text: '1760–1780' },
{ color: '#83a663', text: '1740–1760' },
{ color: '#77852d', text: '1720–1740' },
{ color: '#69814e', text: '1700–1720' },
{ color: '#d0c291', text: '1680–1700' },
{ color: '#918158', text: '1660–1680' },
{ color: '#7a5732', text: '<1660' },
]
}
@ -44,8 +45,8 @@ const data_map = [
label: 'Number of storeys',
elements: [
{ color: '#ffc584', text: '≥20' },
{ color: '#f46259', text: '10-20' },
{ color: '#da456a', text: '5-10' },
{ color: '#f46259', text: '10–20' },
{ color: '#da456a', text: '5–10' },
{ color: '#a8327d', text: '4' },
{ color: '#7c2383', text: '3' },
{ color: '#5b167f', text: '2' },

13
app/src/frontend/main.css
View File

@ -148,19 +148,6 @@
.data-list .no-data {
color: #999;
}
.data-legend {
list-style: none;
padding: 0;
}
.data-legend .key {
display: inline-block;
width: 1em;
height: 1em;
text-indent: -30px;
margin-right: 0.2em;
vertical-align: text-bottom;
overflow: hidden;
}
/**
* Animations for welcome-float and sidebar