From 2a88753e17cf094e6c54f09b39fbc1ef0e1dee3d Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Mon, 4 Oct 2021 10:40:39 -0700
Subject: [PATCH 1/6] Chart class

---
 bookwyrm/views/admin/dashboard.py | 82 +++++++++++++++++++------------
 1 file changed, 51 insertions(+), 31 deletions(-)

diff --git a/bookwyrm/views/admin/dashboard.py b/bookwyrm/views/admin/dashboard.py
index e02b9143e..66dd9c90f 100644
--- a/bookwyrm/views/admin/dashboard.py
+++ b/bookwyrm/views/admin/dashboard.py
@@ -25,13 +25,6 @@ class Dashboard(View):
         """list of users"""
         interval = int(request.GET.get("days", 1))
         now = timezone.now()
-
-        user_queryset = models.User.objects.filter(local=True)
-        user_stats = {"labels": [], "total": [], "active": []}
-
-        status_queryset = models.Status.objects.filter(user__local=True, deleted=False)
-        status_stats = {"labels": [], "total": []}
-
         start = request.GET.get("start")
         if start:
             start = timezone.make_aware(parse(start))
@@ -42,31 +35,33 @@ class Dashboard(View):
         end = timezone.make_aware(parse(end)) if end else now
         start = start.replace(hour=0, minute=0, second=0)
 
-        interval_start = start
-        interval_end = interval_start + timedelta(days=interval)
-        while interval_start <= end:
-            print(interval_start, interval_end)
-            interval_queryset = user_queryset.filter(
-                Q(is_active=True) | Q(deactivation_date__gt=interval_end),
-                created_date__lte=interval_end,
-            )
-            user_stats["total"].append(interval_queryset.filter().count())
-            user_stats["active"].append(
-                interval_queryset.filter(
-                    last_active_date__gt=interval_end - timedelta(days=31),
+        user_queryset = models.User.objects.filter(local=True)
+        user_chart = Chart(
+            queryset=user_queryset,
+            queries={
+                "total": lambda q, s, e: q.filter(
+                    Q(is_active=True) | Q(deactivation_date__gt=e),
+                    created_date__lte=e,
+                ).count(),
+                "active": lambda q, s, e: q.filter(
+                    Q(is_active=True) | Q(deactivation_date__gt=e),
+                    created_date__lte=e,
+                ).filter(
+                    last_active_date__gt=e - timedelta(days=31),
                 ).count()
-            )
-            user_stats["labels"].append(interval_start.strftime("%b %d"))
+            }
+        )
 
-            status_stats["total"].append(
-                status_queryset.filter(
-                    created_date__gt=interval_start,
-                    created_date__lte=interval_end,
+        status_queryset = models.Status.objects.filter(user__local=True, deleted=False)
+        status_chart = Chart(
+            queryset=status_queryset,
+            queries = {
+                "total": lambda q, s, e: q.filter(
+                    created_date__gt=s,
+                    created_date__lte=e,
                 ).count()
-            )
-            status_stats["labels"].append(interval_start.strftime("%b %d"))
-            interval_start = interval_end
-            interval_end += timedelta(days=interval)
+            }
+        )
 
         data = {
             "start": start.strftime("%Y-%m-%d"),
@@ -82,7 +77,32 @@ class Dashboard(View):
             "invite_requests": models.InviteRequest.objects.filter(
                 ignored=False, invite_sent=False
             ).count(),
-            "user_stats": user_stats,
-            "status_stats": status_stats,
+            "user_stats": user_chart.get_chart(start, end, interval),
+            "status_stats": status_chart.get_chart(start, end, interval),
         }
         return TemplateResponse(request, "settings/dashboard/dashboard.html", data)
+
+
+class Chart:
+    """ Data for a chart """
+
+    def __init__(self, queryset, queries: dict):
+        self.queryset = queryset
+        self.queries = queries
+
+    def get_chart(self, start, end, interval):
+        """ load the data for the chart given a time scale and interval """
+        interval_start = start
+        interval_end = interval_start + timedelta(days=interval)
+
+        chart = {k: [] for k in self.queries.keys()}
+        chart["labels"] = []
+        while interval_start <= end:
+            for (name, query) in self.queries.items():
+                chart[name].append(query(self.queryset, interval_start, interval_end))
+            chart["labels"].append(interval_start.strftime("%b %d"))
+
+            interval_start = interval_end
+            interval_end += timedelta(days=interval)
+
+        return chart

From fa241b08e7f5502a4f988ba6d5614abd90db1e13 Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Mon, 4 Oct 2021 10:42:02 -0700
Subject: [PATCH 2/6] Rename charts snippets and add register chart file

---
 .../settings/dashboard/dashboard.html         | 15 ++++++++----
 .../dashboard/registration_chart.html         | 24 +++++++++++++++++++
 ...rd_status_chart.html => status_chart.html} |  0
 ...hboard_user_chart.html => user_chart.html} |  0
 bookwyrm/views/admin/dashboard.py             | 11 +++++++++
 5 files changed, 46 insertions(+), 4 deletions(-)
 create mode 100644 bookwyrm/templates/settings/dashboard/registration_chart.html
 rename bookwyrm/templates/settings/dashboard/{dashboard_status_chart.html => status_chart.html} (100%)
 rename bookwyrm/templates/settings/dashboard/{dashboard_user_chart.html => user_chart.html} (100%)

diff --git a/bookwyrm/templates/settings/dashboard/dashboard.html b/bookwyrm/templates/settings/dashboard/dashboard.html
index fbf3ff72a..863df40d9 100644
--- a/bookwyrm/templates/settings/dashboard/dashboard.html
+++ b/bookwyrm/templates/settings/dashboard/dashboard.html
@@ -95,9 +95,9 @@
         </div>
     </form>
 
-    <div class="columns">
+    <div class="columns is-multiline">
         <div class="column">
-            <h3>{% trans "User signup activity" %}</h3>
+            <h3>{% trans "Total users" %}</h3>
             <div class="box">
                 <canvas id="user_stats"></canvas>
             </div>
@@ -108,6 +108,12 @@
                 <canvas id="status_stats"></canvas>
             </div>
         </div>
+        <div class="column">
+            <h3>{% trans "User signup activity" %}</h3>
+            <div class="box">
+                <canvas id="user_stats"></canvas>
+            </div>
+        </div>
     </div>
 </div>
 
@@ -115,6 +121,7 @@
 
 {% block scripts %}
 <script src="https://cdn.jsdelivr.net/npm/chart.js@3.5.1/dist/chart.min.js"></script>
-{% include 'settings/dashboard/dashboard_user_chart.html' %}
-{% include 'settings/dashboard/dashboard_status_chart.html' %}
+{% include 'settings/dashboard/user_chart.html' %}
+{% include 'settings/dashboard/status_chart.html' %}
+{% include 'settings/dashboard/registration_chart.html' %}
 {% endblock %}
diff --git a/bookwyrm/templates/settings/dashboard/registration_chart.html b/bookwyrm/templates/settings/dashboard/registration_chart.html
new file mode 100644
index 000000000..eec909ed3
--- /dev/null
+++ b/bookwyrm/templates/settings/dashboard/registration_chart.html
@@ -0,0 +1,24 @@
+{% load i18n %}
+<script>
+const labels = [{% for label in registration_stats.labels %}"{{ label }}",{% endfor %}];
+const data = {
+    labels: labels,
+    datasets: [{
+        label: '{% trans "Active this month" %}',
+        backgroundColor: 'rgb(75, 192, 192)',
+        borderColor: 'rgb(75, 192, 192)',
+        data: {{ register_stats.total }},
+    }]
+};
+
+const config = {
+    type: 'line',
+    data: data,
+    options: {}
+};
+
+var userStats = new Chart(
+    document.getElementById('user_stats'),
+    config
+);
+</script>
diff --git a/bookwyrm/templates/settings/dashboard/dashboard_status_chart.html b/bookwyrm/templates/settings/dashboard/status_chart.html
similarity index 100%
rename from bookwyrm/templates/settings/dashboard/dashboard_status_chart.html
rename to bookwyrm/templates/settings/dashboard/status_chart.html
diff --git a/bookwyrm/templates/settings/dashboard/dashboard_user_chart.html b/bookwyrm/templates/settings/dashboard/user_chart.html
similarity index 100%
rename from bookwyrm/templates/settings/dashboard/dashboard_user_chart.html
rename to bookwyrm/templates/settings/dashboard/user_chart.html
diff --git a/bookwyrm/views/admin/dashboard.py b/bookwyrm/views/admin/dashboard.py
index 66dd9c90f..27edc3438 100644
--- a/bookwyrm/views/admin/dashboard.py
+++ b/bookwyrm/views/admin/dashboard.py
@@ -63,6 +63,16 @@ class Dashboard(View):
             }
         )
 
+        register_chart = Chart(
+            queryset=user_queryset,
+            queries = {
+                "total": lambda q, s, e: q.filter(
+                    created_date__gt=s,
+                    created_date__lte=e,
+                ).count()
+            }
+        )
+
         data = {
             "start": start.strftime("%Y-%m-%d"),
             "end": end.strftime("%Y-%m-%d"),
@@ -79,6 +89,7 @@ class Dashboard(View):
             ).count(),
             "user_stats": user_chart.get_chart(start, end, interval),
             "status_stats": status_chart.get_chart(start, end, interval),
+            "register_stats": register_chart.get_chart(start, end, interval),
         }
         return TemplateResponse(request, "settings/dashboard/dashboard.html", data)
 

From 37cd7e684cb8b4f9d0ba4256043a15932b9315a7 Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Mon, 4 Oct 2021 10:53:22 -0700
Subject: [PATCH 3/6] Updates chart markup

---
 .../settings/dashboard/dashboard.html         |  8 ++---
 .../dashboard/registration_chart.html         | 35 ++++++++-----------
 .../settings/dashboard/status_chart.html      | 31 +++++++---------
 3 files changed, 32 insertions(+), 42 deletions(-)

diff --git a/bookwyrm/templates/settings/dashboard/dashboard.html b/bookwyrm/templates/settings/dashboard/dashboard.html
index 863df40d9..cd0ddc842 100644
--- a/bookwyrm/templates/settings/dashboard/dashboard.html
+++ b/bookwyrm/templates/settings/dashboard/dashboard.html
@@ -96,22 +96,22 @@
     </form>
 
     <div class="columns is-multiline">
-        <div class="column">
+        <div class="column is-half">
             <h3>{% trans "Total users" %}</h3>
             <div class="box">
                 <canvas id="user_stats"></canvas>
             </div>
         </div>
-        <div class="column">
+        <div class="column is-half">
             <h3>{% trans "Status activity" %}</h3>
             <div class="box">
                 <canvas id="status_stats"></canvas>
             </div>
         </div>
-        <div class="column">
+        <div class="column is-half">
             <h3>{% trans "User signup activity" %}</h3>
             <div class="box">
-                <canvas id="user_stats"></canvas>
+                <canvas id="register_stats"></canvas>
             </div>
         </div>
     </div>
diff --git a/bookwyrm/templates/settings/dashboard/registration_chart.html b/bookwyrm/templates/settings/dashboard/registration_chart.html
index eec909ed3..e98a0f18f 100644
--- a/bookwyrm/templates/settings/dashboard/registration_chart.html
+++ b/bookwyrm/templates/settings/dashboard/registration_chart.html
@@ -1,24 +1,19 @@
 {% load i18n %}
 <script>
-const labels = [{% for label in registration_stats.labels %}"{{ label }}",{% endfor %}];
-const data = {
-    labels: labels,
-    datasets: [{
-        label: '{% trans "Active this month" %}',
-        backgroundColor: 'rgb(75, 192, 192)',
-        borderColor: 'rgb(75, 192, 192)',
-        data: {{ register_stats.total }},
-    }]
-};
-
-const config = {
-    type: 'line',
-    data: data,
-    options: {}
-};
-
-var userStats = new Chart(
-    document.getElementById('user_stats'),
-    config
+var registerStats = new Chart(
+    document.getElementById('register_stats'),
+    {
+        type: 'bar',
+        data: {
+            labels: [{% for label in register_stats.labels %}"{{ label }}",{% endfor %}],
+            datasets: [{
+                label: '{% trans "Registrations" %}',
+                backgroundColor: 'rgb(75, 192, 192)',
+                borderColor: 'rgb(75, 192, 192)',
+                data: {{ register_stats.total }},
+            }]
+        },
+        options: {}
+    }
 );
 </script>
diff --git a/bookwyrm/templates/settings/dashboard/status_chart.html b/bookwyrm/templates/settings/dashboard/status_chart.html
index bbacf3f46..5e1045fce 100644
--- a/bookwyrm/templates/settings/dashboard/status_chart.html
+++ b/bookwyrm/templates/settings/dashboard/status_chart.html
@@ -1,26 +1,21 @@
 {% load i18n %}
 <script>
-const status_labels = [{% for label in status_stats.labels %}"{{ label }}",{% endfor %}];
-const status_data = {
-    labels: status_labels,
-    datasets: [{
-        label: '{% trans "Statuses posted" %}',
-        backgroundColor: 'rgb(255, 99, 132)',
-        borderColor: 'rgb(255, 99, 132)',
-        data: {{ status_stats.total }},
-    }]
-};
-// === include 'setup' then 'config' above ===
-
-const status_config = {
-    type: 'bar',
-    data: status_data,
-    options: {}
-};
 
 var statusStats = new Chart(
     document.getElementById('status_stats'),
-    status_config
+    {
+        type: 'bar',
+        data: {
+        labels: [{% for label in status_stats.labels %}"{{ label }}",{% endfor %}],
+        datasets: [{
+                label: '{% trans "Statuses posted" %}',
+                backgroundColor: 'rgb(255, 99, 132)',
+                borderColor: 'rgb(255, 99, 132)',
+                data: {{ status_stats.total }},
+            }]
+        },
+        options: {}
+    },
 );
 </script>
 

From 551b49b903cfdfe8e63de58de788b67b320aaf11 Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Mon, 4 Oct 2021 11:14:50 -0700
Subject: [PATCH 4/6] Adds works chart and updates colors

---
 .../settings/dashboard/dashboard.html         | 11 ++++-
 .../dashboard/registration_chart.html         |  4 +-
 .../settings/dashboard/status_chart.html      |  4 +-
 .../settings/dashboard/user_chart.html        | 40 +++++++++----------
 .../settings/dashboard/works_chart.html       | 21 ++++++++++
 bookwyrm/views/admin/dashboard.py             | 11 +++++
 6 files changed, 63 insertions(+), 28 deletions(-)
 create mode 100644 bookwyrm/templates/settings/dashboard/works_chart.html

diff --git a/bookwyrm/templates/settings/dashboard/dashboard.html b/bookwyrm/templates/settings/dashboard/dashboard.html
index cd0ddc842..445bf2992 100644
--- a/bookwyrm/templates/settings/dashboard/dashboard.html
+++ b/bookwyrm/templates/settings/dashboard/dashboard.html
@@ -102,6 +102,12 @@
                 <canvas id="user_stats"></canvas>
             </div>
         </div>
+        <div class="column is-half">
+            <h3>{% trans "User signup activity" %}</h3>
+            <div class="box">
+                <canvas id="register_stats"></canvas>
+            </div>
+        </div>
         <div class="column is-half">
             <h3>{% trans "Status activity" %}</h3>
             <div class="box">
@@ -109,9 +115,9 @@
             </div>
         </div>
         <div class="column is-half">
-            <h3>{% trans "User signup activity" %}</h3>
+            <h3>{% trans "Works created" %}</h3>
             <div class="box">
-                <canvas id="register_stats"></canvas>
+                <canvas id="works_stats"></canvas>
             </div>
         </div>
     </div>
@@ -124,4 +130,5 @@
 {% include 'settings/dashboard/user_chart.html' %}
 {% include 'settings/dashboard/status_chart.html' %}
 {% include 'settings/dashboard/registration_chart.html' %}
+{% include 'settings/dashboard/works_chart.html' %}
 {% endblock %}
diff --git a/bookwyrm/templates/settings/dashboard/registration_chart.html b/bookwyrm/templates/settings/dashboard/registration_chart.html
index e98a0f18f..3b258fec8 100644
--- a/bookwyrm/templates/settings/dashboard/registration_chart.html
+++ b/bookwyrm/templates/settings/dashboard/registration_chart.html
@@ -8,8 +8,8 @@ var registerStats = new Chart(
             labels: [{% for label in register_stats.labels %}"{{ label }}",{% endfor %}],
             datasets: [{
                 label: '{% trans "Registrations" %}',
-                backgroundColor: 'rgb(75, 192, 192)',
-                borderColor: 'rgb(75, 192, 192)',
+                backgroundColor: 'hsl(171, 100%, 41%)',
+                borderColor: 'hsl(171, 100%, 41%)',
                 data: {{ register_stats.total }},
             }]
         },
diff --git a/bookwyrm/templates/settings/dashboard/status_chart.html b/bookwyrm/templates/settings/dashboard/status_chart.html
index 5e1045fce..a59036a51 100644
--- a/bookwyrm/templates/settings/dashboard/status_chart.html
+++ b/bookwyrm/templates/settings/dashboard/status_chart.html
@@ -9,8 +9,8 @@ var statusStats = new Chart(
         labels: [{% for label in status_stats.labels %}"{{ label }}",{% endfor %}],
         datasets: [{
                 label: '{% trans "Statuses posted" %}',
-                backgroundColor: 'rgb(255, 99, 132)',
-                borderColor: 'rgb(255, 99, 132)',
+                backgroundColor: 'hsl(141, 71%, 48%)',
+                borderColor: 'hsl(141, 71%, 48%)',
                 data: {{ status_stats.total }},
             }]
         },
diff --git a/bookwyrm/templates/settings/dashboard/user_chart.html b/bookwyrm/templates/settings/dashboard/user_chart.html
index 33be28f7e..a8d356bb8 100644
--- a/bookwyrm/templates/settings/dashboard/user_chart.html
+++ b/bookwyrm/templates/settings/dashboard/user_chart.html
@@ -1,29 +1,25 @@
 {% load i18n %}
 <script>
-const labels = [{% for label in user_stats.labels %}"{{ label }}",{% endfor %}];
-const data = {
-    labels: labels,
-    datasets: [{
-        label: '{% trans "Total" %}',
-        backgroundColor: 'rgb(255, 99, 132)',
-        borderColor: 'rgb(255, 99, 132)',
-        data: {{ user_stats.total }},
-    }, {
-        label: '{% trans "Active this month" %}',
-        backgroundColor: 'rgb(75, 192, 192)',
-        borderColor: 'rgb(75, 192, 192)',
-        data: {{ user_stats.active }},
-    }]
-};
-
-const config = {
-    type: 'line',
-    data: data,
-    options: {}
-};
 
 var userStats = new Chart(
     document.getElementById('user_stats'),
-    config
+    {
+        type: 'line',
+        data: {
+            labels: [{% for label in user_stats.labels %}"{{ label }}",{% endfor %}],
+            datasets: [{
+                label: '{% trans "Total" %}',
+                backgroundColor: 'hsl(217, 71%, 53%)',
+                borderColor: 'hsl(217, 71%, 53%)',
+                data: {{ user_stats.total }},
+            }, {
+                label: '{% trans "Active this month" %}',
+                backgroundColor: 'hsl(171, 100%, 41%)',
+                borderColor: 'hsl(171, 100%, 41%)',
+                data: {{ user_stats.active }},
+            }]
+        },
+        options: {}
+    }
 );
 </script>
diff --git a/bookwyrm/templates/settings/dashboard/works_chart.html b/bookwyrm/templates/settings/dashboard/works_chart.html
new file mode 100644
index 000000000..c65014e98
--- /dev/null
+++ b/bookwyrm/templates/settings/dashboard/works_chart.html
@@ -0,0 +1,21 @@
+{% load i18n %}
+<script>
+
+var worksStats = new Chart(
+    document.getElementById('works_stats'),
+    {
+        type: 'bar',
+        data: {
+            labels: [{% for label in works_stats.labels %}"{{ label }}",{% endfor %}],
+            datasets: [{
+                label: '{% trans "Works" %}',
+                backgroundColor: 'hsl(204, 86%, 53%)',
+                borderColor: 'hsl(204, 86%, 53%)',
+                data: {{ works_stats.total }},
+            }]
+        },
+        options: {}
+    }
+);
+</script>
+
diff --git a/bookwyrm/views/admin/dashboard.py b/bookwyrm/views/admin/dashboard.py
index 27edc3438..b1aedecf7 100644
--- a/bookwyrm/views/admin/dashboard.py
+++ b/bookwyrm/views/admin/dashboard.py
@@ -73,6 +73,16 @@ class Dashboard(View):
             }
         )
 
+        works_chart = Chart(
+            queryset=models.Work.objects,
+            queries = {
+                "total": lambda q, s, e: q.filter(
+                    created_date__gt=s,
+                    created_date__lte=e,
+                ).count()
+            }
+        )
+
         data = {
             "start": start.strftime("%Y-%m-%d"),
             "end": end.strftime("%Y-%m-%d"),
@@ -90,6 +100,7 @@ class Dashboard(View):
             "user_stats": user_chart.get_chart(start, end, interval),
             "status_stats": status_chart.get_chart(start, end, interval),
             "register_stats": register_chart.get_chart(start, end, interval),
+            "works_stats": works_chart.get_chart(start, end, interval),
         }
         return TemplateResponse(request, "settings/dashboard/dashboard.html", data)
 

From 2335945a501949c81f6a40c85216f0428a7889c3 Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Mon, 4 Oct 2021 11:16:02 -0700
Subject: [PATCH 5/6] Python formatting

---
 bookwyrm/views/admin/dashboard.py | 24 +++++++++++++-----------
 1 file changed, 13 insertions(+), 11 deletions(-)

diff --git a/bookwyrm/views/admin/dashboard.py b/bookwyrm/views/admin/dashboard.py
index b1aedecf7..2766eeebb 100644
--- a/bookwyrm/views/admin/dashboard.py
+++ b/bookwyrm/views/admin/dashboard.py
@@ -46,41 +46,43 @@ class Dashboard(View):
                 "active": lambda q, s, e: q.filter(
                     Q(is_active=True) | Q(deactivation_date__gt=e),
                     created_date__lte=e,
-                ).filter(
+                )
+                .filter(
                     last_active_date__gt=e - timedelta(days=31),
-                ).count()
-            }
+                )
+                .count(),
+            },
         )
 
         status_queryset = models.Status.objects.filter(user__local=True, deleted=False)
         status_chart = Chart(
             queryset=status_queryset,
-            queries = {
+            queries={
                 "total": lambda q, s, e: q.filter(
                     created_date__gt=s,
                     created_date__lte=e,
                 ).count()
-            }
+            },
         )
 
         register_chart = Chart(
             queryset=user_queryset,
-            queries = {
+            queries={
                 "total": lambda q, s, e: q.filter(
                     created_date__gt=s,
                     created_date__lte=e,
                 ).count()
-            }
+            },
         )
 
         works_chart = Chart(
             queryset=models.Work.objects,
-            queries = {
+            queries={
                 "total": lambda q, s, e: q.filter(
                     created_date__gt=s,
                     created_date__lte=e,
                 ).count()
-            }
+            },
         )
 
         data = {
@@ -106,14 +108,14 @@ class Dashboard(View):
 
 
 class Chart:
-    """ Data for a chart """
+    """Data for a chart"""
 
     def __init__(self, queryset, queries: dict):
         self.queryset = queryset
         self.queries = queries
 
     def get_chart(self, start, end, interval):
-        """ load the data for the chart given a time scale and interval """
+        """load the data for the chart given a time scale and interval"""
         interval_start = start
         interval_end = interval_start + timedelta(days=interval)
 

From 636eca97cb121be6a454df9f1734b748c1565040 Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Mon, 4 Oct 2021 11:22:14 -0700
Subject: [PATCH 6/6] Better mobile display

---
 bookwyrm/templates/settings/dashboard/dashboard.html | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/bookwyrm/templates/settings/dashboard/dashboard.html b/bookwyrm/templates/settings/dashboard/dashboard.html
index 445bf2992..f320028b7 100644
--- a/bookwyrm/templates/settings/dashboard/dashboard.html
+++ b/bookwyrm/templates/settings/dashboard/dashboard.html
@@ -9,26 +9,26 @@
 
 {% block panel %}
 
-<div class="columns block has-text-centered">
-    <div class="column is-3">
+<div class="columns block has-text-centered is-mobile is-multiline">
+    <div class="column is-3-desktop is-6-mobile">
         <div class="notification">
             <h3>{% trans "Total users" %}</h3>
             <p class="title is-5">{{ users|intcomma }}</p>
         </div>
     </div>
-    <div class="column is-3">
+    <div class="column is-3-desktop is-6-mobile">
         <div class="notification">
             <h3>{% trans "Active this month" %}</h3>
             <p class="title is-5">{{ active_users|intcomma }}</p>
         </div>
     </div>
-    <div class="column is-3">
+    <div class="column is-3-desktop is-6-mobile">
         <div class="notification">
             <h3>{% trans "Statuses" %}</h3>
             <p class="title is-5">{{ statuses|intcomma }}</p>
         </div>
     </div>
-    <div class="column is-3">
+    <div class="column is-3-desktop is-6-mobile">
         <div class="notification">
             <h3>{% trans "Works" %}</h3>
             <p class="title is-5">{{ works|intcomma }}</p>
@@ -64,7 +64,7 @@
 <div class="block content">
     <h2>{% trans "Instance Activity" %}</h2>
 
-    <form method="get" action="{% url 'settings-dashboard' %}" class="notification has-background-white-bis">
+    <form method="get" action="{% url 'settings-dashboard' %}" class="notification has-background-white-bis scroll-x">
         <div class="is-flex is-align-items-flex-end">
             <div class="ml-1 mr-1">
                 <label class="label" for="id_start">