From 008d6934d2ee5dfc5e2aabae8b39c92364634d5e Mon Sep 17 00:00:00 2001
From: Leon Sandøy <leon.haland@gmail.com>
Date: Thu, 27 Jan 2022 10:17:32 +0100
Subject: Add a template tag for css-classifying things.

---
 pydis_site/apps/resources/templatetags/as_css_class.py | 18 ++++++++++++++++++
 pydis_site/templates/resources/resource_box.html       |  7 ++++---
 2 files changed, 22 insertions(+), 3 deletions(-)
 create mode 100644 pydis_site/apps/resources/templatetags/as_css_class.py

(limited to 'pydis_site')

diff --git a/pydis_site/apps/resources/templatetags/as_css_class.py b/pydis_site/apps/resources/templatetags/as_css_class.py
new file mode 100644
index 00000000..8b628dc9
--- /dev/null
+++ b/pydis_site/apps/resources/templatetags/as_css_class.py
@@ -0,0 +1,18 @@
+from django import template
+
+register = template.Library()
+
+
+@register.filter
+def as_css_class(class_name: str) -> str:
+    """
+    Convert any string to a css-class name.
+
+    For example, convert
+    "Favorite FROOT_is_LEMON" to
+    "favorite-froot-is-lemon"
+    """
+    class_name = class_name.lower()
+    class_name = class_name.replace(" ", "-")
+    class_name = class_name.replace("_", "-")
+    return class_name
diff --git a/pydis_site/templates/resources/resource_box.html b/pydis_site/templates/resources/resource_box.html
index 7de9ca18..09256751 100644
--- a/pydis_site/templates/resources/resource_box.html
+++ b/pydis_site/templates/resources/resource_box.html
@@ -1,7 +1,7 @@
 {% load as_icon %}
 {% load get_category_icon %}
 
-<div class="box">
+<div class="box resource-box {{ resource.css_classes }}">
     {% if 'title_url' in resource %}
         <a href="{{ resource.title_url }}">
             {% include "resources/resource_box_header.html" %}
@@ -13,7 +13,7 @@
     <p class="is-italic">{{ resource.description|safe }}</p>
 
     <div class="is-flex is-align-items-center">
-        {# Add primary link #}
+        {#  Add primary link #}
         {% if 'title_url' in resource %}
             <span class="icon is-size-4 is-medium" style="margin: 5px;">
                 <a href="{{ resource.title_url }}">
@@ -21,7 +21,8 @@
                 </a>
             </span>
         {% endif %}
-        {# Add all additional icon #}
+
+        {#Add all additional icon #}
         {% for icon in resource.urls %}
             <span class="icon is-size-4 is-medium" style="margin: 5px;">
                 <a href="{{ icon.url }}">
-- 
cgit v1.2.3