title | layout | permalink | people | |||||
---|---|---|---|---|---|---|---|---|
People |
splash |
/people/ |
|
{% include feature_row %} {% include feature_row id= "people" type = "center" %} {% assign sorted_people = site.people | sort: 'last_name' %}
{% assign sorted_interests = site.data.research_interests | sort: 'name' %} {% assign sorted_groups = site.data.groups | sort: 'name' %}
All
{% for tag in sorted_groups %}
{{ tag.name }}
{% endfor %}
All
{% for tag in sorted_interests %}
{{ tag.name }}
{% endfor %}
{% for person in sorted_people %}
{% include people.html %}
{% endfor %}
<style type="text/css">
a.button.active {
background: #F76B48;
color: #fff;
}
body {
height: 100%;
cursor: default;
}
#card {
float: left;
width: 350px;
height: 350px;
margin: 10% auto;
border-radius: 8px;
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2), 0px 2px 6px rgba(0, 0, 0, 0.4);
}
#profile {
cursor: grabbing;
width: 330px;
height: 350px;
position: relative;
top: 30px;
border-radius: 8px;
}
img {
width: 100px;
height: 100px;
border-radius: 100px;
top: 32px;
display: block;
margin: 0 auto;
}
.card1 {
color: rgba(38, 50, 56, 1);
font-family: 'Roboto Condensed', sans-serif !important;
font-size: 30px !important;
font-weight: 700;
text-align: center;
position: relative;
top: 10px;
padding-bottom: 20px;
}
.icons {
text-align: center;
position: relative;
top: 10spx;
}
.card2 {
color: rgba(38, 50, 56, .87);
font-family: 'Roboto Condensed', sans-serif !important;
font-size: 14px !important;
font-weight: 400;
text-align: center;
position: relative;
top: 10px;
}
.card3 {
color: rgba(38, 50, 56, .87);
font-family: 'Roboto Condensed', sans-serif !important;
font-size: 12px !important;
font-weight: 400;
text-align: center;
position: relative;
top: 10px;
}
</style>
<script>
// init Isotope
var $container = $(".grid__wrapper").imagesLoaded(function(){
$container.isotope({
itemSelector: '.card',
sortBy: 'random'
// options
});
});
// filter items on button click
$('.filter-button-group').on( 'click', 'a', function() {
var filterValue = $(this).attr('data-filter');
$container.isotope({ filter: filterValue });
});
$('.button-group a.button').on('click', function(){
$('.button-group a.button').removeClass('active');
$(this).addClass('active');
});
</script>