From 48de4fd645fcb283f1b8c55d839d6abea5c164c5 Mon Sep 17 00:00:00 2001
From: Maciej Ziarkowski <maciej.ziarkowski@gmail.com>
Date: Mon, 10 Feb 2020 23:38:46 +0000
Subject: [PATCH] Add disclaimer to legend

---
 app/src/frontend/map/legend.css | 8 +++++++-
 app/src/frontend/map/legend.tsx | 5 +++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/app/src/frontend/map/legend.css b/app/src/frontend/map/legend.css
index f1fbbc7e..cae69b33 100644
--- a/app/src/frontend/map/legend.css
+++ b/app/src/frontend/map/legend.css
@@ -7,7 +7,8 @@
     right: 10px;
     z-index: 1000;
 
-    min-width: 12rem;
+    min-width: 14rem;
+    max-width: 14rem;
     max-height: 60%;
     
     display: flex;
@@ -63,6 +64,11 @@
 .map-legend p {
     margin: 0.25rem 0 0.5rem;
 }
+
+.map-legend .legend-disclaimer {
+    font-size: 0.8em;
+    padding:0;
+}
 .data-legend {
     overflow: auto;
     list-style: none;
diff --git a/app/src/frontend/map/legend.tsx b/app/src/frontend/map/legend.tsx
index 078be3f7..a859cb11 100644
--- a/app/src/frontend/map/legend.tsx
+++ b/app/src/frontend/map/legend.tsx
@@ -99,6 +99,7 @@ const LEGEND_CONFIG = {
     },
     planning: {
         title: 'Planning',
+        disclaimer: 'All data relating to designated buildings should be checked on the National Heritage List for England or local authority websites where used for planning or development purposes',
         elements: [
             { color: '#c72e08', text: 'Grade I listed'}, 
             { color: '#e75b42', text: 'Grade II* listed'}, 
@@ -200,6 +201,10 @@ class Legend extends React.Component<LegendProps, LegendState> {
                 {
                     elements.length?
                         <ul className={this.state.collapseList ? 'collapse data-legend' : 'data-legend'} >
+                            {
+                                details.disclaimer &&
+                                    <p className='legend-disclaimer'>{details.disclaimer}</p>
+                            }
                             {
                                 elements.map((item) => (