Commit c32a9424 authored by cynddl's avatar cynddl

Add tentative style for tag badges

parent b1372aa1
...@@ -21,8 +21,9 @@ ...@@ -21,8 +21,9 @@
<div class="row"> <div class="row">
<div class="col-md-10 offset-1"> <div class="col-md-10 offset-1">
<header class="my-4">
<ul class="nav nav-compressed my-4"> <ul class="nav nav-compressed">
{% if view.filter_lang == 'EN' %} {% if view.filter_lang == 'EN' %}
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="{% url 'rp:public-article-list' %}"> <a class="nav-link" href="{% url 'rp:public-article-list' %}">
...@@ -96,13 +97,14 @@ ...@@ -96,13 +97,14 @@
<div class="collapse" id="collapseTags"> <div class="collapse" id="collapseTags">
{% for t in tags %} {% for t in tags %}
<a class="badge badge-pill badge-primary" href="{% url 'rp:public-article-list-tag' filter_tag=t.name %}"> <a class="badge badge-tag" href="{% url 'rp:public-article-list-tag' filter_tag=t.name %}">
{{t}} {{t.num_times}} <span>{{t}}</span>
</a> </a>
{% endfor %} {% endfor %}
</div> </div>
</header>
{% for article in object_list %} {% for article in object_list %}
<article class="article-card d-flex"> <article class="article-card d-flex">
<div class="article-card-img"> <div class="article-card-img">
......
...@@ -5,3 +5,31 @@ ...@@ -5,3 +5,31 @@
.badge.badge-info { .badge.badge-info {
background-color: var(--color-light-blue); background-color: var(--color-light-blue);
} }
.badge.badge-tag {
border: 1px solid var(--color-light-blue);
color: var(--color-dark-blue);
font-weight: 300;
font-size: 0.9rem;
display: inline-flex;
margin: 0.25rem 0;
padding: 0;
& span {
padding: 0.50em 0.4em;
}
& span.badge-count {
border-left: 1px solid var(--color-light-blue);
}
&:hover, &:active, &:focus {
color: var(--color-black);
border-color: var(--color-dark-blue);
& span.badge-count {
border-color: var(--color-dark-blue);
}
}
}
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment