Skip to content

Commit c86e3db

Browse files
AnnaEngel98AnnaEngel98
authored
Merge branch 'master' into powerfit_updates
2 parents 26e1bad + 32a670a commit c86e3db

3 files changed

Lines changed: 200 additions & 57 deletions

File tree

‎_data/members.yml‎

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,15 @@
1+
# Example entry — all fields are optional except `name` and `position`
2+
# - name: Capitaine Haddock
3+
# position: Ph.D Candidate # used for role colour: Professor, Engineer/Manager,
4+
# # Postdoc, Ph.D/PhD, M.Sc/MSc, Visiting
5+
# url: https://example.com # personal website (makes the name a link)
6+
# avatar: /images/people/capitaine-haddock.jpg
7+
# orcid: https://orcid.org/0000-0000-0000-0000
8+
# github: https://github.com/capitainehaddock
9+
# linkedin: https://www.linkedin.com/in/capitainehaddock/
10+
# bluesky: https://bsky.app/profile/haddock.bsky.social
11+
# x: https://x.com/capitainehaddock
12+
113
- name: Alexandre Bonvin
214
position: Full Professor
315
url: http://www.uu.nl/staff/amjjbonvin
@@ -9,6 +21,7 @@
921

1022
- name: Rodrigo Vargas Honorato
1123
position: Engineering and Application Manager
24+
url: https://rvhonorato.me
1225
avatar: /images/people/Rodrigo.jpg
1326
github: https://github.com/rvhonorato
1427
orcid: https://orcid.org/0000-0001-5267-3002
@@ -34,15 +47,18 @@
3447
github: https://github.com/AnnaKravchenko
3548
orcid: https://orcid.org/0000-0002-2332-4206
3649
linkedin: https://www.linkedin.com/in/kravchenko-anna-d/
37-
50+
3851
- name: Danai Kotzampasi
3952
position: Postdoctoral Researcher
4053
avatar: /images/people/Danai-Kotzampasi.png
41-
54+
4255
- name: Shantanu Khatri
4356
position: Postdoctoral Researcher
4457
avatar: /images/people/Shantanu-Khatri.jpg
45-
58+
linkedin: https://www.linkedin.com/in/shantanukhatri/
59+
github: https://github.com/Comp-era
60+
x: https://x.com/Shantanu_khtri
61+
4662
- name: Xiaotong Xu
4763
position: Ph.D Candidate
4864
avatar: /images/people/Xiaotong-Xu.jpg
@@ -66,23 +82,24 @@
6682
- name: Han Kurt
6783
position: Visiting Ph.D Candidate
6884
avatar: /images/people/Han-Kurt.png
85+
linkedin: https://www.linkedin.com/in/hankurt/
6986

7087
- name: Luca Gazolla
7188
position: Visiting Ph.D Candidate
7289
avatar: /images/people/Luca-Gazolla.png
73-
90+
7491
- name: Jahaciel Villaverde Nogues
7592
position: M.Sc Student
7693
avatar: /images/people/Jahaciel-Villaverde.jpg
77-
94+
7895
- name: Robert Romijn
7996
position: M.Sc Student
8097
avatar: /images/people/Robert-Romijn.png
81-
98+
8299
- name: Felix Maas
83100
position: M.Sc Student
84101
avatar: /images/people/Felix-Maas.jpg
85102

86103
- name: Viktoria Vodilovska
87104
position: M.Sc Student
88-
avatar: /images/people/Viktoria-Vodilovska.jpg
105+
avatar: /images/people/Viktoria-Vodilovska.jpg

‎_layouts/people.html‎

Lines changed: 175 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -32,56 +32,181 @@ <h3>Group picture, July 2025</h3>
3232
<img width=75% src="/images/people/CSB-group-2025.png"><br><br>
3333
</center>
3434
<hr />
35-
<div id="main" role="main">
36-
<article class="people">
37-
<h3>Current members</h3>
38-
<ul class="rig columns-4">
39-
{% for member in site.data.members %}
40-
<li>
41-
{% if member.avatar %}
42-
{% assign avatar = member.avatar %}
43-
{% else %}
44-
{% assign avatar = '/images/people/bio-photo.jpg' %}
45-
{% endif %}
46-
47-
{% if member.url %}
48-
<a href="{{ member.url }}" target="_blank">
49-
<img src="{{ avatar }}" />
50-
</a>
51-
{% else %}
52-
<img src="{{ avatar }}" />
53-
{% endif %}
54-
<h3>{{ member.name }}</h3>
55-
<span class='mem-position'>{{ member.position }}</span>
56-
<br />
57-
{% if member.orcid %}
58-
<a target="_blank" href={{ member.orcid }}>
59-
<img width="10%" src="/assets/icons/orcid.svg">
60-
</a>
61-
{% endif %}
62-
{% if member.github %}
63-
<a target="_blank" href={{ member.github }}>
64-
<img width="10%" src="/assets/icons/github.svg">
65-
</a>
66-
{% endif %}
67-
{% if member.linkedin %}
68-
<a target="_blank" href={{ member.linkedin }}>
69-
<img width="10%" src="/assets/icons/linkedin.svg">
70-
</a>
71-
{% endif %}
72-
{% if member.bluesky %}
73-
<a target="_blank" href={{ member.bluesky }}>
74-
<img width="10%" src="/assets/icons/bluesky.svg">
75-
</a>
76-
{% endif %}
77-
{% if member.bio %}
78-
<p class='mem-bio'>{{ member.bio }}</p>
79-
{% endif %}
80-
</li>
81-
{% endfor %}
82-
</ul>
83-
</article>
84-
</div><!-- /#index -->
35+
<style>
36+
.team-section {
37+
width: 82%;
38+
margin: 2rem auto 3rem;
39+
}
40+
.team-grid {
41+
display: grid;
42+
grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
43+
gap: 1.25rem;
44+
list-style: none;
45+
margin: 0;
46+
padding: 0;
47+
}
48+
.member-card {
49+
background: #fff;
50+
border: 1px solid #e8e8e8;
51+
border-radius: 3px;
52+
padding: 1.25rem 0.9rem 0.9rem;
53+
display: flex;
54+
flex-direction: column;
55+
align-items: center;
56+
text-align: center;
57+
position: relative;
58+
overflow: hidden;
59+
}
60+
.member-card::before {
61+
content: '';
62+
position: absolute;
63+
top: 0; left: 0; right: 0;
64+
height: 3px;
65+
}
66+
.member-card[data-role="professor"]::before { background: #C64537; }
67+
.member-card[data-role="engineer"]::before { background: #343434; }
68+
.member-card[data-role="postdoc"]::before { background: #308cbc; }
69+
.member-card[data-role="phd"]::before { background: #5cb85c; }
70+
.member-card[data-role="msc"]::before { background: #dd8338; }
71+
.member-card[data-role="visiting"]::before { background: #9b59b6; }
72+
.member-card[data-role="other"]::before { background: #ccc; }
73+
.member-photo {
74+
width: 100px;
75+
height: 100px;
76+
overflow: hidden;
77+
margin-bottom: 0.85rem;
78+
flex-shrink: 0;
79+
border: 3px solid #f0f0f0;
80+
}
81+
.member-photo img {
82+
width: 100%;
83+
height: 100%;
84+
object-fit: cover;
85+
display: block;
86+
}
87+
.member-name {
88+
font-family: 'PT Sans Narrow', sans-serif;
89+
font-size: 1.15rem;
90+
font-weight: 700;
91+
color: #222;
92+
margin: 0 0 0.3rem;
93+
line-height: 1.25;
94+
}
95+
.member-name a {
96+
color: inherit;
97+
text-decoration: none;
98+
}
99+
.member-name a:hover {
100+
color: #C64537;
101+
}
102+
.member-position {
103+
font-family: 'PT Serif', serif;
104+
font-size: 0.85rem;
105+
color: #999;
106+
line-height: 1.45;
107+
margin: 0;
108+
flex-grow: 1;
109+
}
110+
.member-links {
111+
display: flex;
112+
gap: 0.35rem;
113+
justify-content: center;
114+
margin-top: 0.85rem;
115+
padding-top: 0.75rem;
116+
border-top: 1px solid #f0f0f0;
117+
width: 100%;
118+
}
119+
.member-links a {
120+
display: flex;
121+
align-items: center;
122+
justify-content: center;
123+
width: 26px;
124+
height: 26px;
125+
border-radius: 50%;
126+
background: #f4f4f4;
127+
transition: background 0.15s ease;
128+
text-decoration: none;
129+
}
130+
.member-links a:hover {
131+
background: #343434;
132+
}
133+
.member-links a img {
134+
width: 13px;
135+
height: 13px;
136+
display: block;
137+
transition: filter 0.15s ease;
138+
}
139+
.member-links a:hover img {
140+
filter: brightness(0) invert(1);
141+
}
142+
</style>
143+
144+
<div class="team-section">
145+
<h3>Current members</h3>
146+
<ul class="team-grid">
147+
{% for member in site.data.members %}
148+
{% assign avatar = member.avatar | default: '/images/people/bio-photo.jpg' %}
149+
150+
{% assign role = 'other' %}
151+
{% if member.position contains 'Professor' %}
152+
{% assign role = 'professor' %}
153+
{% elsif member.position contains 'Engineer' or member.position contains 'Manager' %}
154+
{% assign role = 'engineer' %}
155+
{% elsif member.position contains 'Postdoc' %}
156+
{% assign role = 'postdoc' %}
157+
{% elsif member.position contains 'Visiting' %}
158+
{% assign role = 'visiting' %}
159+
{% elsif member.position contains 'Ph.D' or member.position contains 'PhD' %}
160+
{% assign role = 'phd' %}
161+
{% elsif member.position contains 'M.Sc' or member.position contains 'MSc' %}
162+
{% assign role = 'msc' %}
163+
{% endif %}
164+
165+
<li class="member-card" data-role="{{ role }}">
166+
<div class="member-photo">
167+
<img src="{{ avatar }}" alt="{{ member.name }}" />
168+
</div>
169+
<p class="member-name">
170+
{% if member.url %}
171+
<a href="{{ member.url }}" target="_blank">{{ member.name }}</a>
172+
{% else %}
173+
{{ member.name }}
174+
{% endif %}
175+
</p>
176+
<p class="member-position">{{ member.position }}</p>
177+
{% if member.orcid or member.github or member.linkedin or member.bluesky or member.x %}
178+
<div class="member-links">
179+
{% if member.orcid %}
180+
<a href="{{ member.orcid }}" target="_blank" title="ORCID">
181+
<img src="/assets/icons/orcid.svg" alt="ORCID">
182+
</a>
183+
{% endif %}
184+
{% if member.github %}
185+
<a href="{{ member.github }}" target="_blank" title="GitHub">
186+
<img src="/assets/icons/github.svg" alt="GitHub">
187+
</a>
188+
{% endif %}
189+
{% if member.linkedin %}
190+
<a href="{{ member.linkedin }}" target="_blank" title="LinkedIn">
191+
<img src="/assets/icons/linkedin.svg" alt="LinkedIn">
192+
</a>
193+
{% endif %}
194+
{% if member.bluesky %}
195+
<a href="{{ member.bluesky }}" target="_blank" title="Bluesky">
196+
<img src="/assets/icons/bluesky.svg" alt="Bluesky">
197+
</a>
198+
{% endif %}
199+
{% if member.x %}
200+
<a href="{{ member.x }}" target="_blank" title="X">
201+
<img src="/assets/icons/x.svg" alt="X">
202+
</a>
203+
{% endif %}
204+
</div>
205+
{% endif %}
206+
</li>
207+
{% endfor %}
208+
</ul>
209+
</div>
85210
<hr />
86211
<center>
87212
<h3>Previous group pictures</h3>

‎assets/icons/x.svg‎

Lines changed: 1 addition & 0 deletions
Loading

0 commit comments

Comments
 (0)