margin-right:2em;
}
-button.tag, a.tag {
+button.tag, a.tag{
font-size:0.9em;
background:white;
font-family: "RegloBold";
margin: 0.2em;
padding: 0.3em;
}
+.category{
+ font-family: "RegloBold";
+ text-transform: uppercase;
+}
#Nav .icon-check{background:#222;}
button.check:before, a.check:before {
display:inline-block;
<nav id="gridNav" class="checkable">
<ul class="by{{ categories.count }}">
{% if class = "emissions" or class = "archives" %}
- <li><button class="check icon-check-empty" data-about="#Main" data-toggle=".nocat">?</button></li>
+ <li><button class="check icon-check-empty" data-about="#Main" data-toggle=".nocat"><span class="category">?</span></button></li>
{% endif %}
{% for category in categories %}
{% if class = "grid" %}
- <li><button class="check icon-check-empty" data-about="#Main" data-highlight=".{{ category|slugify }}">{{ category }}<!-- <span class="icon-{{category|slugify}}"></span>--></button></li>
+ <li><button class="check icon-check-empty" data-about="#Main" data-highlight=".{{ category|slugify }}"><span class="category">{{ category }}</span><!-- <span class="icon-{{category|slugify}}"></span>--></button></li>
{% else %}
- <li><button class="check icon-check-empty" data-about="#Main" data-toggle=".{{ category|slugify }}">{{ category }}<!-- <span class="icon-{{category|slugify}}"></span>--></button></li>
+ <li><button class="check icon-check-empty" data-about="#Main" data-toggle=".{{ category|slugify }}"><span class="category">{{ category }}</span><!-- <span class="icon-{{category|slugify}}"></span>--></button></li>
{% endif %}
{% endfor %}
</ul>
{% if emission.categories %}
<div class="categories">
{% for category in emission.categories.all %}
- <a href="{% url 'emissions' %}?q={{category.slug}}"><!--<span class="icon-{{category|slugify}}"></span> --><span>{{category}}</span></a>
+ <a href="{% url 'emissions' %}?q={{category.slug}}"><!--<span class="icon-{{category|slugify}}"></span> --><span class="category">{{category}}</span></a>
{% endfor%}
</div>
{% endif %}