Switch to remixicon

nummi/main/forms.py

@@ -21,7 +21,7 @@ class AccountForm(NummiForm):
         model = Account
         fields = [
             "name",
-            "uicon",
+            "icon",
             "default",
         ]
 
@@ -31,7 +31,7 @@ class CategoryForm(NummiForm):
         model = Category
         fields = [
             "name",
-            "uicon",
+            "icon",
             "budget",
         ]
 

nummi/main/migrations/0027_remove_account_uicon_remove_category_uicon_and_more.py

@@ -0,0 +1,32 @@
+# Generated by Django 4.1.4 on 2023-04-19 13:10
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+    dependencies = [
+        ("main", "0026_alter_account_uicon_alter_category_uicon"),
+    ]
+
+    operations = [
+        migrations.RemoveField(
+            model_name="account",
+            name="uicon",
+        ),
+        migrations.RemoveField(
+            model_name="category",
+            name="uicon",
+        ),
+        migrations.AddField(
+            model_name="account",
+            name="icon",
+            field=models.SlugField(default="bank", max_length=16, verbose_name="Icon"),
+        ),
+        migrations.AddField(
+            model_name="category",
+            name="icon",
+            field=models.SlugField(
+                default="folder", max_length=16, verbose_name="Icon"
+            ),
+        ),
+    ]

nummi/main/models.py

@@ -43,9 +43,9 @@ def get_path(instance, filename):
 class Account(CustomModel):
     id = models.UUIDField(primary_key=True, default=uuid.uuid4, editable=False)
     name = models.CharField(max_length=64, default=_("Account"), verbose_name=_("Name"))
-    uicon = models.CharField(
+    icon = models.SlugField(
-        max_length=2,
+        max_length=16,
-        default="🏦",
+        default="bank",
         verbose_name=_("Icon"),
     )
     default = models.BooleanField(default=False, verbose_name=_("Default"))
@@ -96,9 +96,9 @@ class Category(CustomModel):
     name = models.CharField(
         max_length=64, default=_("Category"), verbose_name=_("Name")
     )
-    uicon = models.CharField(
+    icon = models.SlugField(
-        max_length=2,
+        max_length=16,
-        default="📂",
+        default="folder",
         verbose_name=_("Icon"),
     )
     budget = models.BooleanField(default=True, verbose_name=_("Budget"))

nummi/main/static/main/css/index.css

@@ -1,6 +0,0 @@
-a.big-link {
-  margin-right: 1em;
-}
-a.big-link > i {
-  margin-right: 0.5rem;
-}

nummi/main/static/main/css/main.css

@@ -159,6 +159,11 @@ footer {
     height: initial;
   }
 }
-svg {
+
-  height: 1em;
+a.big-link {
+  margin-right: 1em;
+}
+[class^="ri-"] {
+  margin-right: 0.5em;
+  font-weight: normal;
 }

nummi/main/templates/main/form/account.html

@@ -16,7 +16,7 @@
           type="text/css" />
 {% endblock %}
 {% block body %}
-    <h1>{{ form.instance.uicon }} {{ form.instance }}</h1>
+    <h1>{{ form.instance.icon|remix }}{{ form.instance }}</h1>
     <form method="post">
         {% csrf_token %}
         {{ form }}

nummi/main/templates/main/form/category.html

@@ -16,7 +16,7 @@
           type="text/css" />
 {% endblock %}
 {% block body %}
-    <h1>{{ form.instance.uicon }} {{ form.instance }}</h1>
+    <h1>{{ form.instance.icon|remix }}{{ form.instance }}</h1>
     <form method="post">
         {% csrf_token %}
         {{ form }}

nummi/main/templates/main/icons/checkmark.svg

@@ -1,11 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: none;
-      }
-    </style>
-  </defs>
-  <polygon class="green" points="13 24 4 15 5.414 13.586 13 21.171 26.586 7.586 28 9 13 24"/>
-  <rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32"/>
-</svg>

nummi/main/templates/main/icons/error.svg

@@ -1 +0,0 @@
-<svg id="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><defs><style>.cls-1{fill:none;}</style></defs><title>error</title><g id="Icon-2" data-name="Icon"><path class="red" d="M2,16H2A14,14,0,1,0,16,2,14,14,0,0,0,2,16Zm23.15,7.75L8.25,6.85a12,12,0,0,1,16.9,16.9ZM8.24,25.16A12,12,0,0,1,6.84,8.27L23.73,25.16a12,12,0,0,1-15.49,0Z" transform="translate(0)"/></g><g id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;"><rect class="cls-1" width="32" height="32"/></g></svg>

nummi/main/templates/main/index.html

@@ -4,9 +4,6 @@
 {% load i18n %}
 {% block link %}
     {{ block.super }}
-    <link rel="stylesheet"
-          href="{% static 'main/css/index.css' %}"
-          type="text/css" />
     <link rel="stylesheet"
           href="{% static 'main/css/table.css' %}"
           type="text/css" />
@@ -20,7 +17,7 @@
         {% spaceless %}
             <p>
                 {% for acc in accounts %}
-                    <a class="big-link" href="{% url 'account' acc.id %}">{{ acc.uicon }} {{ acc }}</a>
+                    <a class="big-link" href="{% url 'account' acc.id %}">{{ acc.icon|remix }}{{ acc }}</a>
                 {% endfor %}
             </p>
         {% endspaceless %}
@@ -36,7 +33,7 @@
         {% spaceless %}
             <p>
                 {% for cat in categories %}
-                    <a class="big-link" href="{% url 'category' cat.id %}">{{ cat.uicon }} {{ cat }}</a>
+                    <a class="big-link" href="{% url 'category' cat.id %}">{{ cat.icon|remix }}{{ cat }}</a>
                 {% endfor %}
             </p>
         {% endspaceless %}

nummi/main/templates/main/plot/category.html

@@ -24,7 +24,7 @@
                             {% if cat.category %}{{ cat.category__name }}{% endif %}
                         </th>
                         <td class="c">
-                            {% if cat.category %}{{ cat.category__uicon }}{% endif %}
+                            {% if cat.category %}{{ cat.category__icon|remix }}{% endif %}
                         </td>
                         <td class="value">{{ cat.sum_m|pmrvalue }}</td>
                         <td class="bar m">

nummi/main/templates/main/table/snapshot.html

@@ -17,8 +17,8 @@
             <col class="value" span="3">
         </colgroup>
         <thead>
-            <th class="ri ri-check"></th>
+            <th>{{ "check"|remix }}</th>
-            <th class="ri ri-attachement"></th>
+            <th>{{ "attachment"|remix }}</th>
             <th>{% translate "Date" %}</th>
             {% if not account %}
                 <th colspan="2">{% translate "Account" %}</th>
@@ -31,18 +31,18 @@
             {% for snap in snapshots %}
                 <tr>
                     {% if snap.sum == snap.diff %}
-                        <td class="ri ri-check green"></td>
+                        <td class="c green">{{ "check"|remix }}</td>
                     {% else %}
-                        <td class="ri ri-close red"></td>
+                        <td class="c red">{{ "close"|remix }}</td>
                     {% endif %}
                     <td class="c">
-                        {% if snap.file %}<a href="{{ snap.file.url }}" class="ri ri-attachement"></a>{% endif %}
+                        {% if snap.file %}<a href="{{ snap.file.url }}">{{ "attachment"|remix }}</a>{% endif %}
                     </td>
                     <th class="date" scope="row">
                         <a href="{% url "snapshot" pk=snap.id %}">{{ snap.date|date:"Y-m-d" }}</a>
                     </th>
                     {% if not account %}
-                        <td class="r">{{ snap.account.uicon }}</td>
+                        <td class="r">{{ snap.account.icon|remix }}</td>
                         <td>
                             <a href="{% url "account" pk=snap.account.id %}">{{ snap.account }}</a>
                         </td>

nummi/main/templates/main/table/transaction.html

@@ -23,7 +23,7 @@
             {% endif %}
         </colgroup>
         <thead>
-            <th class="ri ri-attachement"></th>
+            <th>{{ "attachment"|remix }}</th>
             <th>{% translate "Date" %}</th>
             <th>{% translate "Name" %}</th>
             <th>{% translate "Value" %}</th>
@@ -39,26 +39,26 @@
             {% for trans in transactions %}
                 <tr>
                     <td class="c">
-                        {% for invoice in trans.invoices %}<a href="{{ invoice.file.url }}" class="ri ri-attachement"></a>{% endfor %}
+                        {% for invoice in trans.invoices %}<a href="{{ invoice.file.url }}">{{ "attachment"|remix }}</a>{% endfor %}
                     </td>
                     <td class="date">{{ trans.date|date:"Y-m-d" }}</td>
                     <th scope="row" class="l">
                         <a href="{% url "transaction" pk=trans.id %}">{{ trans.name }}</a>
                     </th>
                     <td class="value">{{ trans.value|pmvalue }}</td>
-                    <td>{{ trans.trader|default_if_none:"–" }}</td>
+                    <td>{{ trans.trader|default_if_none:"" }}</td>
                     {% if not category %}
                         {% if trans.category %}
-                            <td class="r">{{ trans.category.uicon }}</td>
+                            <td class="r">{{ trans.category.icon|remix }}</td>
                             <td>
                                 <a href="{% url "category" pk=trans.category.id %}">{{ trans.category }}</a>
                             </td>
                         {% else %}
-                            <td class="c" colspan="2">–</td>
+                            <td colspan="2"></td>
                         {% endif %}
                     {% endif %}
                     {% if not account %}
-                        <td class="r">{{ trans.account.uicon }}</td>
+                        <td class="r">{{ trans.account.icon|remix }}</td>
                         <td>
                             <a href="{% url "account" pk=trans.account.id %}">{{ trans.account }}</a>
                         </td>

nummi/main/templatetags/main_extras.py

@@ -40,3 +40,8 @@ def form_buttons(instance):
         "adding": instance._state.adding,
         "del_url": f"del_{instance.__class__.__name__.lower()}",
     }
+
+
+@register.filter
+def remix(icon):
+    return mark_safe(f"""<span class="ri-{icon}-line"></span>""")

nummi/main/views.py

@@ -295,7 +295,7 @@ class SnapshotUpdateView(NummiUpdateView):
         _transactions = snapshot.transaction_set.all()
         if _transactions:
             _categories = (
-                _transactions.values("category", "category__name", "category__uicon")
+                _transactions.values("category", "category__name", "category__icon")
                 .annotate(
                     sum=models.Sum("value"),
                     sum_m=models.Sum("value", filter=models.Q(value__lt=0)),