I'm currently working on a simple web application using Django and Bootstrap 4.5.
Within one of my models, there is a color attribute that I would like to visually represent using Bootstrap's badge. My goal is to dynamically set the badge's color based on the object's color attribute.
While reviewing the documentation, it appears that I can only select from the predetermined colors such as primary, secondary, etc. Most online resources focus on completely changing the primary color for all badges or applying a specific color through a new CSS class.
What I aim to achieve is the ability to automatically adjust the badge's color according to the color attribute within the Django object by leveraging Django's HTML templates.
This snippet shows my current implementation:
{% block content %}
<h1>{{ tag.name }}</h1>
<p>Description: {{ tag.description }}</p>
<p>Color: <span class="badge badge-secondary">{{ tag.color }}</span></p>
{% endblock %}
Currently, the badge consistently displays the "secondary" color, but my objective is to have it reflect the value of {{ tag.color }}
, which could be something like #FF0000
.