Improve the style of multi-entry info. blocks (on profiles).
This commit is contained in:
parent
aa3b1689d4
commit
8501f07956
3 changed files with 76 additions and 20 deletions
|
@ -329,6 +329,24 @@ body {
|
|||
background-color: #3b1e31;
|
||||
box-shadow: 2px 2px 0 rgba(31, 14, 25, 0.3);
|
||||
}
|
||||
#content-view-profile .infos > *.multi-entry ul.value {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
#content-view-profile .infos > *.multi-entry ul.value li {
|
||||
padding: 0;
|
||||
}
|
||||
#content-view-profile .infos > *.multi-entry ul.value li .type {
|
||||
display: inline-block;
|
||||
margin: 0 1em 0 0;
|
||||
color: #DFDFDF;
|
||||
font-style: italic;
|
||||
}
|
||||
#content-view-profile .infos > *.multi-entry ul.value li .value {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
}
|
||||
#content-view-profile .free-text {
|
||||
grid-area: free-text;
|
||||
padding: 10px;
|
||||
|
|
|
@ -142,6 +142,28 @@
|
|||
padding: 10px;
|
||||
background-color: colors.$content-frame-background;
|
||||
box-shadow: 2px 2px 0 colors.$shadow;
|
||||
|
||||
&.multi-entry ul.value {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
|
||||
li {
|
||||
padding: 0;
|
||||
|
||||
.type {
|
||||
display: inline-block;
|
||||
margin: 0 1em 0 0;
|
||||
color: colors.$page-text-secondary;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.value {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -21,60 +21,76 @@
|
|||
|
||||
<div class="infos">
|
||||
{% if profile.pronoun %}
|
||||
<p class="pronouns">
|
||||
<div class="pronouns">
|
||||
<span class="label">{% trans "Pronom(s) utilisé(s)" %}</span>
|
||||
<span class="separator"></span>
|
||||
<span class="value">{{ profile.pronoun }}</span>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if profile.department.exists %}
|
||||
<p class="department">
|
||||
<div class="department">
|
||||
<span class="label">{% trans "Département" %}{{ profile.department.count|pluralize }}</span>
|
||||
<span class="separator"></span>
|
||||
<span class="value">{% for dep in profile.department.all %}{{ dep }}{% if not forloop.last %}, {% endif %}{% endfor %}</span>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if profile.birth_date %}
|
||||
<p class="birthdate">
|
||||
<div class="birthdate">
|
||||
<span class="label">{% trans "Date de naissance" %}</span>
|
||||
<span class="separator"></span>
|
||||
<span class="value">{{ profile.birth_date }}</span>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if profile.thurne %}
|
||||
<p class="room">
|
||||
<div class="room">
|
||||
<span class="label">{% trans "Thurne" %}</span>
|
||||
<span class="separator"></span>
|
||||
<span class="value">{{ profile.thurne }}</span>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if profile.phone_set.exists %}
|
||||
<p class="phone">
|
||||
<div class="phone multi-entry">
|
||||
<span class="label">{% trans "Téléphone" %}{{ profile.phone_set.count|pluralize }}</span>
|
||||
<span class="separator"></span>
|
||||
<span class="value">{% for p in profile.phone_set.all %}{{ p }}{% if not forloop.last %},<br>{% endif %}{% endfor %}</span>
|
||||
</p>
|
||||
<ul class="value">
|
||||
{% for p in profile.phone_set.all %}
|
||||
<li><span class="type">{{ p.name }}</span><span class="value">{{ p.number }}</span></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if profile.social_set.exists %}
|
||||
<p class="social">
|
||||
<div class="social multi-entry">
|
||||
<span class="label">{{ profile.social_set.count|pluralize:_("Réseau social,Réseaux sociaux") }}</span>
|
||||
<span class="separator"></span>
|
||||
<span class="value">{% for p in profile.social_set.all %}{{ p }}{% if not forloop.last %},<br>{% endif %}{% endfor %}</span>
|
||||
</p>
|
||||
<ul class="value">
|
||||
{% for p in profile.social_set.all %}
|
||||
<li><span class="type">{{ p.name }}</span><span class="value">{{ p.content }}</span></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if profile.mail_set.exists %}
|
||||
<p class="mail">
|
||||
<div class="mail multi-entry">
|
||||
<span class="label">{{ profile.mail_set.count|pluralize:_("Mail,Mails") }}</span>
|
||||
<span class="separator"></span>
|
||||
<span class="value">{% for p in profile.mail_set.all %}{{ p }}{% if not forloop.last %},<br>{% endif %}{% endfor %}</span>
|
||||
</p>
|
||||
<ul class="value">
|
||||
{% for p in profile.mail_set.all %}
|
||||
<li><span class="type">{{ p.name }}</span><span class="value">{{ p.mail }}</span></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if profile.address_set.exists %}
|
||||
<p class="address">
|
||||
<div class="address multi-entry">
|
||||
<span class="label">{{ profile.address_set.count|pluralize:_("Adresse,Adresses") }}</span>
|
||||
<span class="separator"></span>
|
||||
<span class="value">{% for p in profile.address_set.all %}{{ p }}{% if not forloop.last %},<br>{% endif %}{% endfor %}</span>
|
||||
</p>
|
||||
<ul class="value">
|
||||
{% for p in profile.address_set.all %}
|
||||
<li><span class="type">{{ p.name }}</span><span class="value">{{ p.content }}</span></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in a new issue