From b59928e5ada9f3a2efbcb97459c4d001db5404cd Mon Sep 17 00:00:00 2001
From: "W. Trevor King" <wking@tremily.us>
Date: Mon, 28 Nov 2016 12:18:31 -0800
Subject: [PATCH] DepCard: Push the border rect beneath the icon/text

I'd shifted this in 25fadc4b (DepCard: Add tasks, tasksCompleted, and
a progress bar, 2016-11-28, #18) with some rough thoughts about
clipping long slugs so they don't overflow the card.  But it meant
that the border rect masked the links provided by the icon and text.
This commit shifts the border rect lower in the stack so you can get a
click through to the active elements again.  We'll need a more robust
solution to clipping/overflow anyway.
---
 webapp/src/DepCard.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/webapp/src/DepCard.js b/webapp/src/DepCard.js
index 80bfb49..748ec4e 100644
--- a/webapp/src/DepCard.js
+++ b/webapp/src/DepCard.js
@@ -124,6 +124,10 @@ class DepCard extends PureComponent {
         rx={radius} ry={radius} style={backgroundStyle}>
       </rect>
       <path d={taskPath.join(' ')} style={taskStyle} />
+      <rect
+        x={left} y={top} width={width} height={height}
+        rx={radius} ry={radius} style={style}>
+      </rect>
       <a xlinkHref={host}>
         <image
           x={leftCenter} y={this.props.cy - 0.4 * height}
@@ -138,10 +142,6 @@ class DepCard extends PureComponent {
           {this.props.slug.replace(/^[^\/]*\//, '')}
         </text>
       </a>
-      <rect
-        x={left} y={top} width={width} height={height}
-        rx={radius} ry={radius} style={style}>
-      </rect>
       <DepIndicators
         cx={right} cy={this.props.cy} dy={height/2}
         blockers={this.props.blockers}