Feat: success template for in-person enrollment (#2378)

benefits/in_person/templates/in_person/enrollment/success.html

@@ -0,0 +1,36 @@
+{% extends "admin/agency-base.html" %}
+{% load static %}
+
+{% block content %}
+    <div class="row justify-content-center">
+        <div class="col-lg-6">
+            <div class="border border-3 p-3">
+                <h2 class="p-0 m-0 text-left">In-person enrollment</h2>
+            </div>
+            <div class="border border-3 border-top-0 p-3 min-vh-60 d-flex flex-column justify-content-between">
+                <div class="d-flex">
+                    <i class="success-icon"></i>
+                    <div>
+                        <p>Success! This rider can now use their contactless card to automatically receive a reduced fare when they tap-to-ride.</p>
+
+                        {% if enrollment.supports_expiration %}
+                            <p>
+                                <span class="fw-bold my-3">This rider will enjoy a transit benefit until {{ enrollment.expires|date }}.</span> They will need to enroll again at that time to continue receiving reduced fares.
+                            </p>
+                        {% endif %}
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-6">
+                        {% url routes.IN_PERSON_ELIGIBILITY as url_eligibility %}
+                        <a href="{{ url_eligibility }}" class="btn btn-lg btn-outline-primary d-block">New enrollment</a>
+                    </div>
+                    <div class="col-6">
+                        {% url routes.ADMIN_INDEX as url_done %}
+                        <a href="{{ url_done }}" class="btn btn-lg btn-primary d-block">Done</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+{% endblock content %}

benefits/in_person/views.py

@@ -149,4 +149,6 @@ def server_error(request):
 
 
 def success(request):
-    return TemplateResponse(request, "in_person/enrollment/success.html")
+    context = {**admin_site.each_context(request)}
+
+    return TemplateResponse(request, "in_person/enrollment/success.html", context)

benefits/static/css/admin/styles.css

@@ -109,6 +109,22 @@ iframe.card-collection {
   height: 60vh;
 }
 
+/* Enrollment Success Page */
+.success-icon {
+  background-color: var(--bs-success);
+  mask: url("../../../static/img/icon/check-circle-fill.svg") no-repeat;
+  -webkit-mask: url("../../../static/img/icon/check-circle-fill.svg") no-repeat;
+
+  display: inline-block;
+  width: 64px;
+  height: 64px;
+  margin-right: calc(12rem / 16);
+}
+
+.min-vh-60 {
+  min-height: 60vh;
+}
+
 /* Login Page */
 .login #header {
   padding: 0 !important;