Use badge macros in the card header

bricktracker/rebrickable_part.py

@@ -119,11 +119,14 @@ class RebrickablePart(BrickRecord):
 
     # Compute the url for the original of the printed part
     def url_for_print(self, /) -> str:
+        if self.fields.print is not None:
             return url_for(
                 'part.details',
                 part=self.fields.print,
                 color=self.fields.color,
             )
+        else:
+            return ''
 
     # Compute the url for the rebrickable page
     def url_for_rebrickable(self, /) -> str:

templates/macro/badge.html

@@ -1,14 +1,15 @@
-{% macro badge(check=none, url=none, solo=false, last=false, color='primary', blank=none, icon=none, alt=none, collapsible=none, text=none, tooltip=none) %}
+{% macro badge(check=none, url=none, solo=false, last=false, header=false, color='primary', rgb=none, blank=none, icon=none, alt=none, collapsible=none, text=none, tooltip=none) %}
   {% if check or url %}
     {% if url %}
       <a href="{{ url }}" {% if blank %}target="_blank"{% endif %}
     {% else %}
       <span
     {% endif %}
-      class="badge text-bg-{{ color }} fw-normal mb-1 {% if solo %}fs-6{% endif %}" {% if alt %}alt="{{ alt }}"{% endif %}
+      class="badge text-bg-{{ color }} fw-normal {% if not header %}mb-1{% endif %} {% if solo and not header %}fs-6{% endif %}" {% if alt %}alt="{{ alt }}"{% endif %}
       {% if tooltip %} data-bs-toggle="tooltip" title="{{ tooltip }}"{% endif %}
     >
     {% if icon %}<i class="ri-{{ icon }}"></i>{% endif %}
+    {% if rgb %}<span class="color-rgb {% if rgb == 'any' %}color-any{% endif %} align-bottom border border-black" {% if rgb != 'any' %}style="background-color: #{{ rgb }};"{% endif %}></span>{% endif %}
     {% if collapsible and not last %}<span {% if not solo %}class="d-none d-md-inline"{% endif %}> {{ collapsible }} </span>{% endif %}
     {% if text %}{{ text }}{% endif %}
     {% if url %}
@@ -23,6 +24,20 @@
   {{ badge(url=item.url_for_bricklink(), solo=solo, last=last, blank=true, color='light border', icon='external-link-line', collapsible='Bricklink', alt='Bricklink') }}
 {% endmacro %}
 
+{% macro color(item, icon=none, solo=false, last=false, header=false) %}
+  {% if item.fields.color == 9999 %}
+    {% set rgb = 'any' %}
+  {% else %}
+      {% set rgb = item.fields.color_rgb %}
+  {% endif %}
+  {{ badge(check=item.fields.color_name, solo=solo, last=last, header=header, color=' bg-white text-black border', rgb=rgb, icon='palette-line', collapsible=item.fields.color_name) }}
+  {{ badge(check=item.fields.color_transparent, solo=solo, last=last, header=header, color='light border', icon='blur-off-line', collapsible='Transparent') }}
+{% endmacro %}
+
+{% macro identifier(id, icon=none, solo=false, last=false, header=false) %}
+  {{ badge(check=id, solo=solo, last=last, header=header, color='secondary', icon=icon, text=id) }}
+{% endmacro %}
+
 {% macro instructions(item, solo=false, last=false) %}
   {{ badge(url=item.url_for_instructions(), solo=solo, last=last, blank=true, color='light border', icon='file-line', collapsible='Instructions:', text=item.instructions | length, alt='Instructions') }}
 {% endmacro %}
@@ -35,6 +50,10 @@
   {{ badge(check=quantity, solo=solo, last=last, color='success', icon='close-line', collapsible='Quantity:', text=quantity, alt='Quantity') }}
 {% endmacro %}
 
+{% macro print(item, solo=false, last=false, header=false) %}
+  {{ badge(url=item.url_for_print(), solo=solo, last=last, color='light border', icon='paint-brush-line', collapsible='Print') }}
+{% endmacro %}
+
 {% macro set(set, solo=false, last=false, url=None, id=None) %}
   {% if id %}
       {% set url=url_for('set.details', id=id) %}

templates/macro/card.html

@@ -1,21 +1,15 @@
+{% import 'macro/badge.html' as badge %}
+
 {% macro header(item, name, solo=false, identifier=none, icon='hashtag') %}
   <div class="card-header">
     {% if not solo %}
       <a class="text-decoration-none text-reset" href="{{ item.url() }}" data-bs-toggle="tooltip" title="{{ name }}">
     {% endif %}
     <h5 class="mb-0 {% if not solo %}fs-6 text-nowrap overflow-x-hidden text-truncate{% endif %}">
-      {% if identifier %}<span class="badge text-bg-secondary fw-normal"><i class="ri-{{ icon }}"></i>{{ identifier }}</span>{% endif %}
+      {{ badge.identifier(identifier, icon=icon, solo=solo, header=true) }}
       {% if solo %}
-        {% if item.fields.color_name %}
+        {{ badge.color(item, header=true) }}
-          <span class="badge bg-white text-black fw-normal border"><i class="ri-palette-line"></i>
+        {{ badge.print(item, header=true) }}
-            {% if item.fields.color_rgb %}
-              <span class="color-rgb {% if item.fields.color == 9999 %}color-any{% endif %} align-bottom border border-black" {% if item.fields.color != 9999 %}style="background-color: #{{ item.fields.color_rgb }};"{% endif %}></span>
-            {% endif %}
-            {{ item.fields.color_name }}
-          </span>
-        {% endif %}
-        {% if item.fields.color_transparent %}<span class="badge text-bg-light fw-normal border"><i class="ri-blur-off-line"></i> Transparent</span>{% endif %}
-        {% if item.fields.print %}<span class="badge text-bg-light fw-normal border"><a class="text-reset" href="{{ item.url_for_print() }}"><i class="ri-paint-brush-line"></i> Print</a></span>{% endif %}
       {% endif %}
       {{ name }}
     </h5>