From dfbf202d91599c490819c78ab6f457db16a9c24d Mon Sep 17 00:00:00 2001
From: Aaron Briggs <abriggs@contractor.usgs.gov>
Date: Fri, 28 Aug 2020 14:16:41 -0500
Subject: [PATCH] last tweaks for mobile
---
assets/src/scripts/d3-rendering/legend.js | 13 ++++++++-----
assets/src/scripts/d3-rendering/legend.spec.js | 2 +-
2 files changed, 9 insertions(+), 6 deletions(-)
diff --git a/assets/src/scripts/d3-rendering/legend.js b/assets/src/scripts/d3-rendering/legend.js
index ac13e7162..42f47a774 100644
--- a/assets/src/scripts/d3-rendering/legend.js
+++ b/assets/src/scripts/d3-rendering/legend.js
@@ -32,9 +32,9 @@ export const drawSimpleLegend = function(div, {legendMarkerRows, layout}) {
legend.append('rect')
.attr('x', 0)
- .attr('y', 0)
- .attr('width', 98)
- .attr('height', VERTICAL_ROW_OFFSET_PROVISIONAL_DATA_MESSAGE + 5)
+ .attr('y', mediaQuery(config.USWDS_MEDIUM_SCREEN) ? 0 : 5)
+ .attr('width', mediaQuery(config.USWDS_MEDIUM_SCREEN) ? 98 : 73)
+ .attr('height', mediaQuery(config.USWDS_MEDIUM_SCREEN) ? VERTICAL_ROW_OFFSET_PROVISIONAL_DATA_MESSAGE + 5 : 17)
.attr('fill', '#565c65')
.attr('rx', 2);
@@ -44,8 +44,11 @@ export const drawSimpleLegend = function(div, {legendMarkerRows, layout}) {
.attr('x', 8)
.attr('y', VERTICAL_ROW_OFFSET_PROVISIONAL_DATA_MESSAGE)
.append('tspan')
- .text('IMPORTANT').style('fill', 'white')
- .append('tspan').text('data shown may be provisional - ').style('fill', 'black').attr('x', 105)
+ .text('IMPORTANT')
+ .style('fill', 'white')
+ .append('tspan').text('data may be provisional - ')
+ .style('fill', 'black')
+ .attr('x', mediaQuery(config.USWDS_MEDIUM_SCREEN) ? 105 : 75)
.append('tspan')
.text('learn more')
.style('fill', '#0000EE');
diff --git a/assets/src/scripts/d3-rendering/legend.spec.js b/assets/src/scripts/d3-rendering/legend.spec.js
index e6480653c..7b06248fd 100644
--- a/assets/src/scripts/d3-rendering/legend.spec.js
+++ b/assets/src/scripts/d3-rendering/legend.spec.js
@@ -65,7 +65,7 @@ describe('Legend module', () => {
expect(container.select('svg').size()).toBe(1);
expect(container.selectAll('line').size()).toBe(2);
- expect(container.selectAll('rect').size()).toBe(1);
+ expect(container.selectAll('rect').size()).toBe(2); // The 'provisional data message' adds a background rectangle that is always present in the legend, making the count one more than would be expected from the mock data
expect(container.selectAll('text').size()).toBe(5); // The 'provisional data message' is a text node that is always present in the legend, making the count one more than might be expected from the mock data
});
});
--
GitLab