<div class="profile-list__wrapper">
<h1 class="profile-list__title">Growers</h1>
<div class="profile__wrapper">
<div class="profile">
<h3 class="profile__name">
<a class="profile__name-link" href="/profile/">
John Doe
</a>
</h3>
<img class="profile__image" src="http://lorempixel.com/people/400/400" alt="">
</div>
<div class="profile">
<h3 class="profile__name">
<a class="profile__name-link" href="/profile/">
Jane Doe
</a>
</h3>
<img class="profile__image" src="http://lorempixel.com/people/400/400" alt="">
</div>
</div>
</div>
<div class="profile-list__wrapper">
<h1 class="profile-list__title">{{ title }}</h1>
<div class="profile__wrapper">
{% for person in people %}
<div class="profile">
<h3 class="profile__name">
<a class="profile__name-link" href="/profile/{{person.ID}}">
{{ person.first_name }} {{ person.last_name }}
</a>
</h3>
{% if person.image %}
{% set img = TimberImage(person.image) %}
<img class="profile__image" src="{{ img.src('profile') }}" alt="">
{% endif %}
</div>
{% endfor %}
</div>
</div>
{
"title": "Growers",
"people": [
{
"first_name": "John",
"last_name": "Doe",
"image": "http://lorempixel.com/people/400/400"
},
{
"first_name": "Jane",
"last_name": "Doe",
"image": "http://lorempixel.com/people/400/400"
}
]
}
.profile-list {
&__wrapper {
background: $white;
padding: 2% 2.4% 5%;
}
&__title {
}
}
.profile {
@media $desktop {
lost-column: 4/12;
}
text-align: center;
background: #EFEFEF;
padding: 0 2% 2%;
&__name-link {
color: $olive;
}
&__wrapper {
clear: fix;
}
&__image {
border-radius: 50%;
}
}
There are no notes for this item.