diff options
| author | Matthew Lemon <y@yulqen.org> | 2024-07-28 16:31:21 +0100 |
|---|---|---|
| committer | Matthew Lemon <y@yulqen.org> | 2024-07-28 16:31:21 +0100 |
| commit | dcefb7dfc5b171fcc18fb0adf11a49cb39ff2c6b (patch) | |
| tree | 30ab7f61b83eec73c2195b2b1c7fa99f9e32adea /pyblackbird_cc/templates | |
| parent | 2c7dc01e289d39dcaac6761ff59870accc7575a8 (diff) | |
Added border and badge colour based on category
- You have to define them on the ResourceCategory model in the database
Diffstat (limited to '')
| -rw-r--r-- | pyblackbird_cc/templates/resources/resource_list.html | 9 |
1 files changed, 5 insertions, 4 deletions
diff --git a/pyblackbird_cc/templates/resources/resource_list.html b/pyblackbird_cc/templates/resources/resource_list.html index 6f9edef..454ba45 100644 --- a/pyblackbird_cc/templates/resources/resource_list.html +++ b/pyblackbird_cc/templates/resources/resource_list.html @@ -46,7 +46,7 @@ <div class="d-flex flex-row justify-content-between flex-wrap"> {% for resource in featured_resources %} <!-- <div class="card mx-2 mt-2 shadow-sm ey_literacy_border" style="width: 24rem;"> --> - <div class="card mx-2 mt-2 shadow-sm ey_literacy_border" style="width: 24rem;"> + <div class="card mx-2 mt-2 shadow-sm" style="width: 24rem; border-color: {{ resource.main_resource_category_colour_css_class }}; border-width: 8px;"> <img class="card-img-top" src="{{ resource.thumbnail_urls|first }}" alt="{{ resource.thumbnail_filename }}" /> @@ -54,7 +54,7 @@ <h5 class="card-title"><a href="{% url 'resources:resource_detail' resource_id=resource.id %}">{{ resource.name }}</a></h5> <div class="d-flex flex-row justify-content-start align-content-center"> <div> - <span class="badge {{ resource.main_resource_category_colour_css_class }} me-2">{{ resource.main_resource_category_name }}</span> + <span class="badge me-2" style="background-color: {{ resource.main_resource_category_colour_css_class }}; color: {{ resource.main_resource_badge_foreground_colour }}">{{ resource.main_resource_category_name }}</span> </div> <div> <span class="badge bg-secondary me-2">{{ resource.age_range }}</span> @@ -94,7 +94,8 @@ </div> <div class="d-flex flex-row justify-content-start flex-wrap"> {% for resource in resource_list %} - <div class="card mx-4 mt-4 border border-width-1" style="width: 17rem;"> +{# <div class="card mx-4 mt-4 border border-width-1" style="width: 17rem;">#} + <div class="card mx-2 mt-2 shadow-sm border-width-1" style="width: 17rem; border-color: {{ resource.main_resource_category_colour_css_class }}; border-width: 8px;"> <img class="card-img-top" src="{{ resource.thumbnail_urls|first }}" alt="{{ resource.thumbnail_filename }}" /> @@ -102,7 +103,7 @@ <h5 class="card-title"><a href="{% url 'resources:resource_detail' resource_id=resource.id %}">{{ resource.name }}</a></h5> <div class="d-flex flex-row justify-content-start align-content-center"> <div> - <span class="badge {{ resource.main_resource_category_colour_css_class }} me-2">{{ resource.main_resource_category_name }}</span> + <span class="badge me-2" style="background-color: {{ resource.main_resource_category_colour_css_class }}; color: {{ resource.main_resource_badge_foreground_colour }}">{{ resource.main_resource_category_name }}</span> </div> <div> <span class="badge bg-secondary me-2">{{ resource.age_range }}</span> |