run hooks, unify tag/button color classes, nicer program layout

shared/templates/styleguide2/includes/atoms/tags/tag.html

@@ -8,17 +8,15 @@
       {% if color_classes %}
         {{ color_classes }}
       {% else %}
-        text-black bg-yellow-500 {% if tags_are_selectable %}hover:bg-yellow-600{% endif %}
+        text-black {% if filtered_tag and filtered_tag.id == id and not is_outside_header %}
+          bg-pirati-yellow hover:bg-yellow-600
+        {% else %}
+          bg-white {% if tags_are_selectable %}hover:bg-pirati-yellow{% endif %}
+        {% endif %}
       {% endif %}
 
       px-4 py-2 duration-200 hover:no-underline
     "
-    style="
-      {% if filtered_tag and filtered_tag.id == id %}
-        background:white !important;
-        color:black !important;
-      {% endif %}
-    "
   >
     {{ text }}
 {% if tags_are_selectable %}

shared/templates/styleguide2/includes/molecules/blocks/icon_title_text_block.html

@@ -6,7 +6,7 @@
 {% else %}
   <div
 {% endif %}
-    class="hover:no-underline mb-12 flex gap-3 max-w-4xl items-start"
+    class="hover:no-underline mb-12 flex gap-3 items-start"
   >
 
     {% if icon %}
@@ -24,7 +24,7 @@
       <h3 class="font-alt mb-4 text-4xl">
         {{ title }}
       </h3>
-      <div class="prose [&>div.content-block>p:first-child]:mt-0">
+      <div class="prose max-w-none [&>div.content-block>p:first-child]:mt-0">
         {{ text|richtext }}
       </div>
     </div>

shared/templates/styleguide2/includes/molecules/program/program_block.html

@@ -12,7 +12,7 @@
   >
     {% if self.perex %}
       <div class="mb-12">
-        <div class="prose">
+        <div class="prose max-w-none">
           {{ self.perex|richtext }}
         </div>
       </div>
@@ -69,7 +69,7 @@
     </div>
   </div>
 {% elif block_type == "elections_program" %}
-  <div class="mb-12">
+  <div class="mt-6 mb-12 xl:mb-20 container--wide">
     {{ self.program_page.get_main_page_program_render|safe }}
   </div>
 {% elif block_type == "program_group_with_candidates" %}

shared/templates/styleguide2/includes/molecules/tags/inline_tags.html

 <div class="flex gap-3 flex-wrap {{ classes }}">
   {% for tag in tags %}
-    {% include 'styleguide2/includes/atoms/tags/tag.html' with text=tag.name id=tag.id %}
+    {% include 'styleguide2/includes/atoms/tags/tag.html' with text=tag.name id=tag.id is_outside_header=True %}
   {% endfor %}
 </div>

shared/templates/styleguide2/includes/organisms/header/elections/articles_header.html

@@ -15,7 +15,7 @@
 {% endblock %}
 
 {% block after_heading %}
-  {% include 'styleguide2/includes/molecules/tags/tags.html' with classes='mb-4' tag_color_classes='bg-black text-white' size_classes='' reset_classes='text-black' tags_are_selectable=True extra_tag=filtered_tag %}
+  {% include 'styleguide2/includes/molecules/tags/tags.html' with classes='mb-4' tag_color_classes='' size_classes='' reset_classes='text-black' tags_are_selectable=True extra_tag=filtered_tag %}
 
   <form
     class="flex justify-start"

shared/templates/styleguide2/includes/organisms/header/elections/simple_header_with_tags.html

 {% extends 'styleguide2/includes/organisms/header/elections/simple_header.html' %}
 
 {% block after_heading %}
-  {% include 'styleguide2/includes/molecules/tags/tags.html' with classes='mb-4' tag_color_classes='bg-black text-white' %}
+  {% include 'styleguide2/includes/molecules/tags/tags.html' with classes='mb-4' tag_color_classes='' %}
 {% endblock %}