build template grant_txn_failed.html

app/retail/templates/emails/grant_txn_failed.html

@@ -0,0 +1,43 @@
+{% extends 'emails/template.html' %}
+{% comment %}
+  Copyright (C) 2018 Gitcoin Core
+
+  This program is free software: you can redistribute it and/or modify
+  it under the terms of the GNU Affero General Public License as published
+  by the Free Software Foundation, either version 3 of the License, or
+  (at your option) any later version.
+
+  This program is distributed in the hope that it will be useful,
+  but WITHOUT ANY WARRANTY; without even the implied warranty of
+  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+  GNU Affero General Public License for more details.
+
+  You should have received a copy of the GNU Affero General Public License
+  along with this program. If not, see <http://www.gnu.org/licenses/>.
+{% endcomment %}
+{% load i18n humanize %}
+
+{% block content %}
+
+<h1>Grants transaction failed, try again?</h1>
+
+<div class="grant-txn-msg">
+  <p>
+    Your contribution to <b>{{ grant_title }}</b> failed due to a technical issue.
+  </p>
+</div>
+
+<div class="grant-txn-id">
+  <p>
+    Transaction ID: <br>
+    <a href="{{ tx_url }}">{{ tx_id }}</a>
+  </p>
+</div>
+
+<div style="margin-bottom: 3em; margin-top: 3em;">
+  <a class="button" href="#">{% trans "Resubmit Transaction" %}</a> <!-- TODO: Replace correct href to add the failed grant to cart -->
+  <br>
+  <a class="etherscan-link" href="{{ tx_url }}">View on Etherscan</a>
+</div>
+
+{% endblock %}

app/retail/templates/emails/grant_txn_failed.txt

@@ -0,0 +1,7 @@
+Grants transaction failed, try again?
+
+    Your contribution to {{ grant_title }} failed due to a technical issue.
+
+    Transaction ID: {{ tx_id }}
+
+  View on Etherscan

app/retail/templates/emails/template.html

@@ -275,6 +275,32 @@
     line-height: 20px;
   }
 
+  .etherscan-link {
+    display: inline-block;
+    font-family: 'Muli', sans-serif;
+    color: #3E00FF;
+  }
+
+  .grant-txn-msg, .grant-txn-id {
+    margin: 0 auto;
+  }
+
+  .grant-txn-id a {
+    overflow-wrap: break-word;
+  }
+
+  @media (min-width: 768px) {
+    .grant-txn-msg {
+      width: 70%;
+    }
+  }
+
+  @media (min-width: 1200px) {
+    .grant-txn-msg {
+      width: 60%;
+    }
+  }
+
   /* Bootstrap styles used for activities -- START */
 
     *,