Commit a9e79978 authored by Konrad Mohrfeldt's avatar Konrad Mohrfeldt

fix avatar-group list in sidebar. refs #535

parent ba6c1de5
Pipeline #1206 failed with stage
in 54 seconds
......@@ -9,13 +9,11 @@
</h2>
</header>
<div class="box-content">
<ul class="avatars">
<div class="avatars avatars-grouped">
{% for group in groups %}
<li>
{% include 'groups/_avatar.html' with group=group link=True %}
</li>
{% include 'groups/_avatar.html' with group=group link=True %}
{% endfor %}
</ul>
</div>
</div>
<div class="btn-toolbar btn-toolbar-right">
<a href="{% url 'group-index' %}" class="btn btn-link">
......
......@@ -140,6 +140,40 @@
overflow: hidden;
}
.avatars-grouped {
display: flex;
align-items: flex-start;
justify-content: space-between;
margin-bottom: 0 -.25rem -.5rem -2.5rem;
flex-wrap: wrap;
.avatar {
margin: 0 .25rem .5rem .25rem;
}
&::after {
content: ' ';
flex: auto;
}
@supports not (display: grid) {
& {
display: grid;
// todo: this rule is specific to 64px avatars, maybe there’s something dynamic?
grid-template-columns: repeat(auto-fill, minmax(64px, 1fr));
grid-gap: .5rem;
grid-auto-flow: dense;
margin: 0;
.avatar-wrap {
display: flex;
align-items: flex-start;
justify-content: center;
}
}
}
}
.avatar-edit-inline {
position: relative;
display: inline-block;
......
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