people: Update design of stats page

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>

diff --git a/src/templates/people/stats.html b/src/templates/people/stats.html
index 3a1d2b6b26f565075c0dfa3512c805e7f5e327bb..94cccbc1a9aafc4e68cf946eb1641be113f3d66a 100644 (file)
--- a/src/templates/people/stats.html
+++ b/src/templates/people/stats.html
@@ -2,66 +2,70 @@
 
 {% block title %}{{ _("Statistics") }}{% end block %}
 
-{% block content %}
-       <h1>{{ _("Statistics") }}</h1>
+{% block container %}
+       <div class="header">
+               <div class="container">
+                       <h1>{{ _("Statistics") }}</h1>
+               </div>
+       </div>
 
        {% set total_accounts = len(backend.accounts) %}
 
-       <div class="row">
-               <div class="col-12 col-lg-3">
-                       <div class="card mb-3">
-                               <div class="card-body text-center">
-                                       <h1>{{ total_accounts }}</h1>
-                                       <h5>{{ _("Total Accounts") }}</h5>
+       <div class="container">
+               <section>
+                       <div class="row">
+                               <div class="col-12 col-lg-3">
+                                       <div class="card mb-3">
+                                               <div class="card-body text-center">
+                                                       <h1>{{ total_accounts }}</h1>
+                                                       <h5>{{ _("Total Accounts") }}</h5>
 
-                                       <hr>
+                                                       <hr>
 
-                                       {% set t = now - datetime.timedelta(days=7) %}
+                                                       {% set t = now - datetime.timedelta(days=7) %}
 
-                                       <h1>{{ backend.accounts.count_created_after(t) }}</h1>
-                                       <h5 class="mb-0">{{ _("Created This Week") }}</h5>
+                                                       <h1>{{ backend.accounts.count_created_after(t) }}</h1>
+                                                       <h5 class="mb-0">{{ _("Created This Week") }}</h5>
 
-                                       <hr>
+                                                       <hr>
 
-                                       {% set t = now - datetime.timedelta(days=30) %}
+                                                       {% set t = now - datetime.timedelta(days=30) %}
 
-                                       <h1>{{ backend.accounts.count_created_after(t) }}</h1>
-                                       <h5 class="mb-0">{{ _("Created This Month") }}</h5>
+                                                       <h1>{{ backend.accounts.count_created_after(t) }}</h1>
+                                                       <h5 class="mb-0">{{ _("Created This Month") }}</h5>
 
-                                       {% set pending_registrations = backend.accounts.pending_registrations %}
-                                       {% if pending_registrations %}
-                                               <hr>
+                                                       {% set pending_registrations = backend.accounts.pending_registrations %}
+                                                       {% if pending_registrations %}
+                                                               <hr>
 
-                                               <h1>{{ pending_registrations }}</h1>
-                                               <h5 class="mb-0">{{ _("Pending Registrations") }}</h5>
-                                       {% end %}
+                                                               <h1>{{ pending_registrations }}</h1>
+                                                               <h5 class="mb-0">{{ _("Pending Registrations") }}</h5>
+                                                       {% end %}
+                                               </div>
+                                       </div>
                                </div>
-                       </div>
-               </div>
 
-               <div class="col-12 col-lg-9">
-                       <div class="card">
-                               <div class="card-body">
-                                       <h4 class="mb-0">{{ _("By Country") }}</h4>
+                               <div class="col-12 col-lg-9">
+                                       <div class="card">
+                                               <ul class="list-group list-group-flush">
+                                                       {% set countries = backend.accounts.countries %}
+
+                                                       {% for country in sorted(countries, key=lambda c: countries[c], reverse=True) %}
+                                                               <li class="list-group-item d-flex justify-content-between align-items-center">
+                                                                       <span>
+                                                                               <span class="flag-icon flag-icon-{{ country.alpha2.lower() }} small mr-1"></span>
+                                                                               {{ country.apolitical_name }}
+                                                                       </span>
+
+                                                                       <span class="badge badge-primary" title="{{ countries[country] }}">
+                                                                               {{ "%.1f%%" % (countries[country] * 100 / total_accounts) }}
+                                                                       </span>
+                                                               </li>
+                                                       {% end %}
+                                               </ul>
+                                       </div>
                                </div>
-
-                               <ul class="list-group list-group-flush">
-                                       {% set countries = backend.accounts.countries %}
-
-                                       {% for country in sorted(countries, key=lambda c: countries[c], reverse=True) %}
-                                               <li class="list-group-item d-flex justify-content-between align-items-center">
-                                                       <span>
-                                                               <span class="flag-icon flag-icon-{{ country.alpha2.lower() }} small mr-1"></span>
-                                                               {{ country.apolitical_name }}
-                                                       </span>
-
-                                                       <span class="badge badge-secondary" title="{{ countries[country] }}">
-                                                               {{ "%.1f%%" % (countries[country] * 100 / total_accounts) }}
-                                                       </span>
-                                               </li>
-                                       {% end %}
-                               </ul>
                        </div>
-               </div>
+               </section>
        </div>
 {% end block %}