diff --git a/assets/src/scripts/components/hydrograph/index.js b/assets/src/scripts/components/hydrograph/index.js index 36363b15a10f1945ef24b3532e730962afc7c7f8..59dbdcf1ee57512fb9e163f6b3ca2ca8fab57561 100644 --- a/assets/src/scripts/components/hydrograph/index.js +++ b/assets/src/scripts/components/hydrograph/index.js @@ -156,11 +156,11 @@ const plotPatterns = function(elem) { .attr('id', 'display-mask') .attr('maskUnits', 'userSpaceOnUse') .append('rect') - .attr('x', '0') - .attr('y', '0') - .attr('width', '100%') - .attr('height', '100%') - .attr('fill', '#0000ff'); + .attr('x', '0') + .attr('y', '0') + .attr('width', '100%') + .attr('height', '100%') + .attr('fill', '#0000ff'); defs.append('pattern') .attr('id', 'hash-45') @@ -172,8 +172,21 @@ const plotPatterns = function(elem) { .attr('width', '4') .attr('height', '8') .attr('transform', 'translate(0, 0)') - .attr('fill', '#3633FF') .attr('mask', 'url(#display-mask)'); + + defs.append('pattern') + .attr('id', 'hash-135') + .attr('width', '8') + .attr('height', '8') + .attr('patternUnits', 'userSpaceOnUse') + .attr('patternTransform', 'rotate(135)') + .append('rect') + .attr('width', '4') + .attr('height', '8') + .attr('transform', 'translate(0, 0)') + .attr('mask', 'url(#display-mask)'); + + }; diff --git a/assets/src/styles/components/_hydrograph.scss b/assets/src/styles/components/_hydrograph.scss index 3205377f74a98cffa90a231f85352a220399b500..13d8897046d16446a2487d30ff1e6e02ec4e519c 100644 --- a/assets/src/styles/components/_hydrograph.scss +++ b/assets/src/styles/components/_hydrograph.scss @@ -71,7 +71,7 @@ fill: #f96713; } .generic-mask { - fill: #cce6ff; + fill: #33daff; opacity: 0.2; } }