From e5903eebb20c38fc9aea52102a01de8efe5db275 Mon Sep 17 00:00:00 2001
From: Sonny <sonnyba871@gmail.com>
Date: Sat, 23 May 2020 12:59:50 +0200
Subject: [PATCH] Add card component

---
 .../templates/components/card/card.html       | 13 +++++++++
 .../templates/components/card/content.html    |  3 +++
 .../templates/components/card/footer.html     |  3 +++
 .../templates/components/card/header.html     |  3 +++
 .../password-reset-complete.html              | 24 +++++------------
 .../password-reset-confirm.html               | 26 +++++++-----------
 .../password-reset/password-reset-done.html   | 21 +++++----------
 .../registration/activation_complete.html     | 27 +++++++------------
 .../registration/activation_failure.html      | 16 +++--------
 .../activation_resend_complete.html           | 18 ++++---------
 .../registration/registration_closed.html     | 16 +++--------
 .../registration/registration_complete.html   | 18 +++----------
 12 files changed, 71 insertions(+), 117 deletions(-)
 create mode 100644 src/newsreader/templates/components/card/card.html
 create mode 100644 src/newsreader/templates/components/card/content.html
 create mode 100644 src/newsreader/templates/components/card/footer.html
 create mode 100644 src/newsreader/templates/components/card/header.html

diff --git a/src/newsreader/templates/components/card/card.html b/src/newsreader/templates/components/card/card.html
new file mode 100644
index 0000000..750bd06
--- /dev/null
+++ b/src/newsreader/templates/components/card/card.html
@@ -0,0 +1,13 @@
+<div class="card">
+  {% if header_text %}
+    {% include "components/card/header.html" %}
+  {% endif %}
+
+  {% if content %}
+    {% include "components/card/content.html" %}
+  {% endif %}
+
+  {% if footer_text %}
+    {% include "components/card/footer.html" %}
+  {% endif %}
+</div>
diff --git a/src/newsreader/templates/components/card/content.html b/src/newsreader/templates/components/card/content.html
new file mode 100644
index 0000000..8ae0141
--- /dev/null
+++ b/src/newsreader/templates/components/card/content.html
@@ -0,0 +1,3 @@
+<div class="card__content">
+  <p>{{ content }}</p>
+</div>
diff --git a/src/newsreader/templates/components/card/footer.html b/src/newsreader/templates/components/card/footer.html
new file mode 100644
index 0000000..1acffe0
--- /dev/null
+++ b/src/newsreader/templates/components/card/footer.html
@@ -0,0 +1,3 @@
+<div class="card__footer">
+  <p>{{ footer_text }}</p>
+</div>
diff --git a/src/newsreader/templates/components/card/header.html b/src/newsreader/templates/components/card/header.html
new file mode 100644
index 0000000..567756a
--- /dev/null
+++ b/src/newsreader/templates/components/card/header.html
@@ -0,0 +1,3 @@
+<div class="card__header">
+  <h1>{{ header_text }}</h1>
+</div>
diff --git a/src/newsreader/templates/password-reset/password-reset-complete.html b/src/newsreader/templates/password-reset/password-reset-complete.html
index 8a47f55..0b7796f 100755
--- a/src/newsreader/templates/password-reset/password-reset-complete.html
+++ b/src/newsreader/templates/password-reset/password-reset-complete.html
@@ -1,23 +1,13 @@
 {% extends "base.html" %}
-{% load static i18n %}
-
-{% block title %}{% trans "Password reset complete" %}{% endblock %}
+{% load i18n %}
 
 {% block content %}
 <main class="main">
-  <div class="card">
-    <div class="card__header">
-      <h1>{% trans "Password reset complete" %}</h1>
-    </div>
-    <div class="card__content">
-    <p>
-        {% trans "Your password has been reset!" %}
-        {% blocktrans %}
-          You may now <a href="{{ login_url }}">log in</a>
-        {% endblocktrans %}.
-    </p>
-    </div>
-    <div class="card__footer" />
-  </div>
+  {% trans "Password reset complete" as header_text %}
+  {% blocktrans asvar content %}
+    You may now <a href="{{ login_url }}">log in</a>
+  {% endblocktrans %}
+
+  {% include "components/card/card.html" with header_text=header_text content=content %}
 </main>
 {% endblock %}
diff --git a/src/newsreader/templates/password-reset/password-reset-confirm.html b/src/newsreader/templates/password-reset/password-reset-confirm.html
index 93c1975..d0d5037 100755
--- a/src/newsreader/templates/password-reset/password-reset-confirm.html
+++ b/src/newsreader/templates/password-reset/password-reset-confirm.html
@@ -1,5 +1,5 @@
 {% extends "base.html" %}
-{% load static i18n %}
+{% load i18n %}
 
 {% block meta %}
   <!-- NOTE(joshblum): This prevents leaking the password reset token via the
@@ -15,23 +15,15 @@
     {% trans "Change password" as confirm_text %}
     {% include "components/form/form.html" with form=form title=title confirm_text=confirm_text cancel_url=cancel_url %}
   {% else %}
-    <div class="card">
-      <div class="card__header">
-        <h1>{% trans "Password reset unsuccessful" %}</h1>
-      </div>
-      <div class="card__content">
-        <p>
-          {% url 'accounts:password-reset' as reset_url %}
-          {% blocktrans %}
-            Password reset unsuccessful. Please
-            <a class="link" href="{{ reset_url }}">try again.</a>
-          {% endblocktrans %}
-        </p>
-      </div>
-      <div class="card__footer" />
-    </div>
-  {% endif %}
+    {% trans "Password reset unsuccessful" as header_text %}
+    {% url 'accounts:password-reset' as reset_url %}
+    {% blocktrans asvar content %}
+      Password reset unsuccessful. Please
+      <a class="link" href="{{ reset_url }}">try again.</a>
+    {% endblocktrans %}
 
+    {% include "components/card/card.html" with header_text=header_text content=content %}
+  {% endif %}
 </main>
 {% endblock %}
 
diff --git a/src/newsreader/templates/password-reset/password-reset-done.html b/src/newsreader/templates/password-reset/password-reset-done.html
index dfa141c..7012439 100755
--- a/src/newsreader/templates/password-reset/password-reset-done.html
+++ b/src/newsreader/templates/password-reset/password-reset-done.html
@@ -5,19 +5,12 @@
 
 {% block content %}
 <main class="main">
-  <div class="card">
-    <div class="card__header">
-      <h1>{% trans "Password reset" %}</h1>
-    </div>
-    <div class="card__content">
-      <p>
-        {% blocktrans %}
-          We have sent you an email with a link to reset your password. Please check
-          your email and click the link to continue.
-        {% endblocktrans %}
-      </p>
-    </div>
-    <div class="card__footer" />
-  </div>
+  {% trans "Password reset" as header_text %}
+  {% blocktrans asvar content %}
+    We have sent you an email with a link to reset your password. Please check
+    your email and click the link to continue.
+  {% endblocktrans %}
+
+  {% include "components/card/card.html" with header_text=header_text content=content %}
 </main>
 {% endblock %}
diff --git a/src/newsreader/templates/registration/activation_complete.html b/src/newsreader/templates/registration/activation_complete.html
index 61ea493..f8dd91b 100755
--- a/src/newsreader/templates/registration/activation_complete.html
+++ b/src/newsreader/templates/registration/activation_complete.html
@@ -1,7 +1,5 @@
 {% extends "base.html" %}
-{% load static i18n %}
-
-{% block title %}{% trans "Account Activated" %}{% endblock %}
+{% load i18n %}
 
 {% comment %}
 **registration/activation_complete.html**
@@ -13,19 +11,14 @@ account is now active.
 
 {% block content %}
   <main class="main">
-    <div class="card">
-      <div class="card__header">
-        <h1>{% trans "Account activated" %}</h1>
-      </div>
-      <div class="card__content">
-        <p>
-            {% trans "Your account is now activated." %}
-            {% if not user.is_authenticated %}
-            {% trans "You can log in." %}
-            {% endif %}
-        </p>
-      </div>
-      <div class="card__footer" />
-    </div>
+    {% trans "Account activated" as header_text %}
+
+    {% if user.is_authenticated %}
+      {% trans "Your account is activated. You can now log in." as content %}
+    {% else %}
+      {% trans "Your account is activated." as content %}
+    {% endif %}
+
+    {% include "components/card/card.html" with header_text=header_text content=content %}
   </main>
 {% endblock %}
diff --git a/src/newsreader/templates/registration/activation_failure.html b/src/newsreader/templates/registration/activation_failure.html
index 5cf0f67..c99cc34 100644
--- a/src/newsreader/templates/registration/activation_failure.html
+++ b/src/newsreader/templates/registration/activation_failure.html
@@ -1,7 +1,5 @@
 {% extends "base.html" %}
-{% load static i18n %}
-
-{% block title %}{% trans "Activation Failure" %}{% endblock %}
+{% load i18n %}
 
 {% comment %}
 **registration/activate.html**
@@ -14,14 +12,8 @@ Used if account activation fails. With the default setup, has the following cont
 
 {% block content %}
   <main class="main">
-    <div class="card">
-      <div class="card__header">
-        <h1>{% trans "Activation Failure" %}</h1>
-      </div>
-      <div class="card__content">
-        <p>{% trans "Account activation failed." %}</p>
-      </div>
-      <div class="card__footer" />
-    </div>
+    {% trans "Activation Failure" as header_text %}
+    {% trans "Account activation failed." as content %}
+    {% include "components/card/card.html" with header_text=header_text content=content %}
   </main>
 {% endblock %}
diff --git a/src/newsreader/templates/registration/activation_resend_complete.html b/src/newsreader/templates/registration/activation_resend_complete.html
index dcf1e79..6d01fee 100644
--- a/src/newsreader/templates/registration/activation_resend_complete.html
+++ b/src/newsreader/templates/registration/activation_resend_complete.html
@@ -14,18 +14,10 @@ the following context:
 
 {% block content %}
   <main class="main">
-    <div class="card">
-      <div class="card__header">
-        <h1>{% trans "Account activation resent" %}</h1>
-      </div>
-      <div class="card__content">
-        <p>
-          {% blocktrans %}
-          We have sent an email to {{ email }} with further instructions.
-          {% endblocktrans %}
-        </p>
-      </div>
-      <div class="card__footer" />
-    </div>
+    {% trans "Account activation resent" as header_text %}
+    {% blocktrans asvar content %}
+      We have sent an email to {{ email }} with further instructions.
+    {% endblocktrans %}
+    {% include "components/card/card.html" with header_text=header_text content=content %}
   </main>
 {% endblock %}
diff --git a/src/newsreader/templates/registration/registration_closed.html b/src/newsreader/templates/registration/registration_closed.html
index 6169ebe..c7cfd9a 100755
--- a/src/newsreader/templates/registration/registration_closed.html
+++ b/src/newsreader/templates/registration/registration_closed.html
@@ -1,20 +1,10 @@
 {% extends "base.html" %}
 {% load static i18n %}
 
-{% block title %}{% trans "Registration is closed" %}{% endblock %}
-
 {% block content %}
   <main class="main">
-    <div class="card">
-      <div class="card__header">
-        <h1>{% trans "Registration is closed" %}</h1>
-      </div>
-      <div class="card__content">
-        <p>
-          {% trans "Sorry, but registration is closed at this moment. Come back later." %}
-        </p>
-      </div>
-      <div class="card__footer" />
-    </div>
+    {% trans "Registration is closed" as header_text %}
+    {% trans "Sorry, but registration is closed at this moment. Come back later." as content %}
+    {% include "components/card/card.html" with header_text=header_text content=content %}
   </main>
 {% endblock %}
diff --git a/src/newsreader/templates/registration/registration_complete.html b/src/newsreader/templates/registration/registration_complete.html
index cc5f868..ccf70b2 100755
--- a/src/newsreader/templates/registration/registration_complete.html
+++ b/src/newsreader/templates/registration/registration_complete.html
@@ -1,7 +1,5 @@
 {% extends "base.html" %}
-{% load static i18n %}
-
-{% block title %}{% trans "Activation email sent" %}{% endblock %}
+{% load i18n %}
 
 {% comment %}
 **registration/registration_complete.html**
@@ -14,16 +12,8 @@ been sent.
 
 {% block content %}
   <main class="main">
-    <div class="card">
-      <div class="card__header">
-        <h1>{% trans "Activation email sent" %}</h1>
-      </div>
-      <div class="card__content">
-        <p>
-          {% trans "Please check your email to complete the registration process." %}
-        </p>
-      </div>
-      <div class="card__footer" />
-    </div>
+    {% trans "Activation email sent" as header_text %}
+    {% trans "Please check your email to complete the registration process." as content %}
+    {% include "components/card/card.html" with header_text=header_text content=content %}
   </main>
 {% endblock %}