amélioration du rendu bouton

src/agenda_culturel/static/style.scss

@@ -38,21 +38,23 @@ $primary-700: #008080;
     width: 1.2em;
     border-radius: 0.6em;
     display: inline-block;
-    color: $primary-500;
-    background: var(--secondary-inverse);
     vertical-align: middle;
     text-align: center;
     font-size: 80%;
 }
 
+
+.action {
+    color: $primary-500;
+    background: var(--secondary-inverse);
+}
+
 .cat {
     margin-left: 0;
     margin-right: .2em;   
 }
 
-a:hover>.cat,
 a:hover>.action,
-span:hover>.cat,
 span:hover>.action {
     transition: color var(--transition);
     color: $primary-600;

src/agenda_culturel/templates/agenda_culturel/event-inc.html

@@ -26,8 +26,12 @@
     </header>
     {% endif %}
 
-
-
+    {% comment %}
+    manque encore: 
+    * location,
+    * image, image_alt
+    * reference_urls
+    {% endcomment %}
 
     {% comment %}
     On affiche le corps du message avec plus ou moins de longueur

src/agenda_culturel/templates/agenda_culturel/page-event.html

@@ -3,6 +3,11 @@
 {% block title %}{{ object.title }}{% endblock %}
 
 
+{% block entete_header %}
+    {% css_categories %}
+{% endblock %}
+
+
 {% block content %}
 
 {% include "agenda_culturel/event-inc.html" with event=event %}

src/agenda_culturel/templates/agenda_culturel/tag.html

@@ -5,12 +5,15 @@
 {% load cat_extra %}
 
 
-{% block content %}
+{% block entete_header %}
+    {% css_categories %}
+{% endblock %}
 
+
+{% block content %}
 <h1>Étiquette <em>{{ tag }}</em></h1>
 
 {% for event in events %}
 {% include "agenda_culturel/event-inc.html" with event=event display="in list" %}
 {% endfor %}
-
 {% endblock %}

src/agenda_culturel/templates/agenda_culturel/tags.html

@@ -4,9 +4,7 @@
 
 {% load cat_extra %}
 
-
 {% block content %}
-
 <h1>Toutes les étiquettes</h1>
 <p>Liste de toutes les étiquettes utilisées par les événements référencés&nbsp;:</p>
 <div>
@@ -14,5 +12,4 @@
     <a href="{% url 'view_tag' tag %}" role="button" class="small-cat">{{ tag }}</a>    
     {% endfor %}
 </div>
-
 {% endblock %}

src/agenda_culturel/templatetags/cat_extra.py

@@ -64,7 +64,8 @@ def css_categories():
 
     for c in cats:
 
-        result += "a ." + c.css_class() + " {"
+        result += "a ." + c.css_class() + ","
+        result += "span ." + c.css_class() + " {"
         result += background_color_adjust_color(adjust_lightness_saturation(c.color, .2, 0.8), 0.8)
         result += "}"
 
@@ -76,7 +77,7 @@ def css_categories():
         result += background_color_adjust_color(c.color)
         result += "}"
 
-        result += ".selected:hover ." + c.css_class() + " {"
+        result += "a.selected:hover ." + c.css_class() + " {"
         result += background_color_adjust_color(adjust_lightness_saturation(c.color, 0.2, 1.2))
         result += "}"
 
@@ -88,6 +89,6 @@ def small_cat(category, url=None, contrast=True):
 
     class_contrast = " contrast" if contrast else ""
     if url is None:
-        return mark_safe('<span class="small-cat' + class_contrast +'" role="button"><span class="cat ' + category.css_class() + '"></span> ' + category.name + "</span>")
+        return mark_safe('<span class="small-cat' + class_contrast +' selected" role="button"><span class="cat ' + category.css_class() + '"></span> ' + category.name + "</span>")
     else:
-        return mark_safe('<a class="small-cat' + class_contrast +'" role="button" href="' + url + '"><span class="cat ' + category.css_class() + '"></span> ' + category.name + "</a>")
+        return mark_safe('<a class="small-cat' + class_contrast +' selected" role="button" href="' + url + '"><span class="cat ' + category.css_class() + '"></span> ' + category.name + "</a>")