Skip to content

Commit 554c100

Browse files
angelphanthangelphanth
authored
Updated people page (#6)
* 🐛 fix div container * 🍱 add pics * adding person cards * 🔥 rm team name from all cards * fix top padding
1 parent 084e738 commit 554c100

File tree

9 files changed

+171
-98
lines changed

9 files changed

+171
-98
lines changed

‎3people.md‎

Lines changed: 171 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -3,209 +3,282 @@ layout: page
33
title: People
44
permalink: /people/
55
---
6-
<!DOCTYPE html>
6+
77
<html>
8+
89
<head>
10+
911
<meta name="viewport" content="width=device-width, initial-scale=1">
12+
1013
<style>
11-
html {
12-
box-sizing: border-box;
13-
}
14-
15-
*, *:before, *:after {
16-
box-sizing: inherit;
17-
}
18-
19-
.column {
20-
float: left;
21-
width: 33.3%;
22-
margin-bottom: 16px;
23-
padding: 0 8px;
24-
}
25-
26-
@media screen and (max-width: 650px) {
14+
html {
15+
box-sizing: border-box;
16+
}
17+
18+
h1 {
19+
padding-top: 50px;
20+
}
21+
22+
*, *:before, *:after {
23+
box-sizing: inherit;
24+
}
25+
2726
.column {
28-
width: 100%;
27+
float: left;
28+
width: 33.3%;
29+
margin-bottom: 16px;
30+
padding: 0 8px;
31+
}
32+
33+
h2 {
34+
font-size: 24px; /* Default font size */
35+
max-width: 100%; /* Ensure it doesn't exceed the container width */
36+
white-space: normal; /* Allow wrapping */
37+
overflow: hidden; /* Hide overflow */
38+
text-overflow: ellipsis; /* Add ellipsis for overflowing text */
39+
}
40+
41+
p {
42+
max-width: 100%; /* Ensure it doesn't exceed the container width */
43+
overflow-wrap: break-word; /* Break long words */
44+
word-wrap: break-word; /* For older browsers */
45+
white-space: normal; /* Allow wrapping */
46+
}
47+
48+
@media screen and (max-width: 650px) {
49+
.column {
50+
width: 100%;
51+
display: block;
52+
}
53+
h2 {
54+
font-size: 18px;
55+
}
56+
}
57+
58+
.card {
59+
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
60+
padding: 5px;
61+
}
62+
63+
.card img {
2964
display: block;
65+
margin: 0 auto;
3066
}
31-
}
32-
33-
.card {
34-
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
35-
}
36-
37-
.container {
38-
padding: 0 16px;
39-
}
40-
41-
.container::after, .row::after {
42-
content: "";
43-
clear: both;
44-
display: table;
45-
}
46-
47-
.title {
48-
color: grey;
49-
}
50-
51-
.button {
52-
border: none;
53-
outline: 0;
54-
display: inline-block;
55-
padding: 8px;
56-
color: white;
57-
background-color: #000;
58-
text-align: center;
59-
cursor: pointer;
60-
width: 100%;
61-
}
62-
63-
.button:hover {
64-
background-color: #555;
65-
}
67+
68+
.container {
69+
padding: 0 16px;
70+
}
71+
72+
.container::after, .row::after {
73+
content: "";
74+
clear: both;
75+
display: table;
76+
}
77+
78+
.title {
79+
color: grey;
80+
}
81+
82+
.button {
83+
border: none;
84+
outline: 0;
85+
display: inline-block;
86+
padding: 8px;
87+
color: white;
88+
background-color: #000;
89+
text-align: center;
90+
cursor: pointer;
91+
width: 100%;
92+
}
93+
94+
.button:hover {
95+
background-color: #555;
96+
}
97+
6698
</style>
99+
67100
</head>
101+
68102
<body>
69103

70104
<br>
105+
71106
<h1>Meet The Team</h1>
72107

73108
<div class="row">
74-
<h2>Multi-omics Network Analytics (MoNA)</h2>
109+
<h2>Multi-omics Network Analytics (MoNA)</h2>
110+
75111
<div class="column">
76112
<div class="card">
77113
<img src="{{ site.baseurl }}/public/assets/ASD.jpeg" alt="Alberto" style="width:45%">
78114
<div class="container">
79115
<h2>Alberto Santos</h2>
116+
<p class="title">Director, Informatics Platform</p>
80117
<p class="title">Group Lead</p>
81-
<p>Multi-omics Network Analytics &amp; Data Science Platform</p>
82118
<p>[email protected]</p>
83119
</div>
84120
</div>
85121
</div>
122+
86123
<div class="column">
87124
<div class="card">
88125
<img src="{{ site.baseurl }}/public/assets/ALP.jpeg" alt="Angel" style="width:45%">
89126
<div class="container">
90127
<h2>Angel L. Phanthanourak</h2>
91128
<p class="title">PhD Student</p>
92-
<p>Multi-omics Network Analytics</p>
93129
<p>[email protected]</p>
94130
</div>
95131
</div>
96132
</div>
133+
97134
<div class="column">
98135
<div class="card">
99-
<img src="{{ site.baseurl }}/public/assets/ALP.jpeg" alt="Angel" style="width:45%">
136+
<img src="{{ site.baseurl }}/public/assets/asar.jpeg" alt="Sebastian" style="width:45%">
100137
<div class="container">
101-
<h2>Test</h2>
138+
<h2>Sebastian Ayala Ruano</h2>
102139
<p class="title">Research Assistant</p>
103-
<p>Multi-omics Network Analytics</p>
104-
<p>[email protected]</p>
140+
<p>[email protected]</p>
105141
</div>
106142
</div>
107143
</div>
108144
</div>
145+
109146
<div class="row">
147+
110148
<div class="column">
111149
<div class="card">
112-
<img src="{{ site.baseurl }}/public/assets/ALP.jpeg" alt="Angel" style="width:45%">
150+
<img src="{{ site.baseurl }}/public/assets/txell.jpeg" alt="Txell" style="width:45%">
113151
<div class="container">
114-
<h2>Test</h2>
152+
<h2>Txell Amigo</h2>
115153
<p class="title">Research Assistant</p>
116-
<p>Multi-omics Network Analytics</p>
117-
<p>[email protected]</p>
154+
<p>[email protected]</p>
118155
</div>
119156
</div>
120157
</div>
158+
121159
<div class="column">
122160
<div class="card">
123-
<img src="{{ site.baseurl }}/public/assets/ALP.jpeg" alt="Angel" style="width:45%">
161+
<img src="{{ site.baseurl }}/public/assets/marco.jpeg" alt="Marco" style="width:45%">
124162
<div class="container">
125-
<h2>Test</h2>
126-
<p class="title">Research Assistant</p>
127-
<p>Multi-omics Network Analytics</p>
128-
<p>[email protected]</p>
163+
<h2>Marco Reverenna</h2>
164+
<p class="title">PhD Student</p>
165+
<p>[email protected]</p>
129166
</div>
130167
</div>
131168
</div>
169+
132170
<div class="column">
133171
<div class="card">
134-
<img src="{{ site.baseurl }}/public/assets/ALP.jpeg" alt="Angel" style="width:45%">
172+
<img src="{{ site.baseurl }}/public/assets/juik.jpeg" alt="Jui-Tse" style="width:45%">
135173
<div class="container">
136-
<h2>Testerrr</h2>
137-
<p class="title">Research Assistant</p>
138-
<p>Multi-omics Network Analytics</p>
139-
<p>[email protected]</p>
174+
<h2>Jui-Tse Ko</h2>
175+
<p class="title">PhD Student</p>
176+
<p>[email protected]</p>
140177
</div>
141178
</div>
142179
</div>
180+
143181
</div>
182+
144183
<div class="row">
145-
<h2>Data Science Platform</h2>
184+
146185
<div class="column">
147186
<div class="card">
148-
<img src="{{ site.baseurl }}/public/assets/APC.jpeg" alt="Albert" style="width:45%">
187+
<img src="{{ site.baseurl }}/public/assets/alzub.jpeg" alt="Alexander" style="width:45%">
149188
<div class="container">
150-
<h2>Albert Pallejà Caro</h2>
151-
<p class="title">Senior Data Scientist</p>
152-
<p>Data Science Platform</p>
153-
<p>[email protected]</p>
189+
<h2>Alexander Zubov</h2>
190+
<p class="title">PhD Student</p>
191+
<p>[email protected]</p>
154192
</div>
155193
</div>
156194
</div>
195+
157196
<div class="column">
158197
<div class="card">
159-
<img src="{{ site.baseurl }}/public/assets/JBJ.jpeg" alt="Jakob" style="width:45%">
198+
<img src="{{ site.baseurl }}/public/assets/binsun.jpeg" alt="Binhuan" style="width:45%">
160199
<div class="container">
161-
<h2>Jakob B. Jespersen</h2>
162-
<p class="title">Data Scientist</p>
163-
<p>Data Science Platform</p>
164-
<p>[email protected]</p>
200+
<h2>Binhuan Sun</h2>
201+
<p class="title">PhD Student</p>
202+
<p>[email protected]</p>
165203
</div>
166204
</div>
167205
</div>
206+
168207
<div class="column">
169208
<div class="card">
170-
<img src="{{ site.baseurl }}/public/assets/hw.jpeg" alt="Henry" style="width:45%">
209+
<img src="{{ site.baseurl }}/public/assets/edir.jpeg" alt="Edir" style="width:45%">
171210
<div class="container">
172-
<h2>JHenry Webel</h2>
173-
<p class="title">Senior Data Scientist</p>
174-
<p>Data Science Platform</p>
175-
<p>[email protected]</p>
211+
<h2>Edir Sebastian Vidal Castro</h2>
212+
<p class="title">MSc Student & Student Assistant</p>
213+
<p>[email protected]</p>
214+
</div>
215+
</div>
216+
</div>
217+
218+
</div>
219+
220+
<div class="row">
221+
<h2>Data Science Platform</h2>
222+
223+
<div class="column">
224+
<div class="card">
176225
<img src="{{ site.baseurl }}/public/assets/APC.jpeg" alt="Albert" style="width:45%">
177226
<div class="container">
178227
<h2>Albert Pallejà Caro</h2>
179-
<p class="title">Senior Data Scientist</p>
180-
<p>Data Science Platform</p>
228+
<p class="title">Team Lead Data Science Platform</p>
181229
<p>[email protected]</p>
182230
</div>
183231
</div>
184232
</div>
233+
185234
<div class="column">
186235
<div class="card">
187236
<img src="{{ site.baseurl }}/public/assets/JBJ.jpeg" alt="Jakob" style="width:45%">
188237
<div class="container">
189238
<h2>Jakob B. Jespersen</h2>
190239
<p class="title">Data Scientist</p>
191-
<p>Data Science Platform</p>
192240
<p>[email protected]</p>
193241
</div>
194242
</div>
195243
</div>
244+
196245
<div class="column">
197246
<div class="card">
198-
<img src="{{ site.baseurl }}/public/assets/JBJ.jpeg" alt="Jakob" style="width:45%">
247+
<img src="{{ site.baseurl }}/public/assets/hw.jpeg" alt="Henry" style="width:45%">
199248
<div class="container">
200-
<h2>testttt</h2>
201-
<p class="title">Data Scientist</p>
202-
<p>Data Science Platform</p>
203-
<p>[email protected]</p>
249+
<h2>Henry Webel</h2>
250+
<p class="title">Senior Data Scientist</p>
251+
<p>[email protected]</p>
204252
</div>
205253
</div>
206254
</div>
255+
207256
</div>
208257

258+
<div class="row">
209259

260+
<div class="column">
261+
<div class="card">
262+
<img src="{{ site.baseurl }}/public/assets/jasge.jpeg" alt="Juliana" style="width:45%">
263+
<div class="container">
264+
<h2>Juliana Assis</h2>
265+
<p class="title">Senior Data Scientist</p>
266+
<p>[email protected]</p>
267+
</div>
268+
</div>
269+
</div>
270+
271+
<div class="column">
272+
<div class="card">
273+
<img src="{{ site.baseurl }}/public/assets/sebschu.jpeg" alt="Sebastian" style="width:45%">
274+
<div class="container">
275+
<h2>Sebastian Schulz</h2>
276+
<p class="title">Senior Data Scientist</p>
277+
<p>[email protected]</p>
278+
</div>
279+
</div>
280+
</div>
281+
282+
</div>
210283
</body>
211284
</html>

‎public/assets/alzub.jpeg‎

7.99 KB
Loading

‎public/assets/asar.jpeg‎

7.52 KB
Loading

‎public/assets/binsun.jpeg‎

6.73 KB
Loading

‎public/assets/edir.jpeg‎

7.51 KB
Loading

‎public/assets/jasge.jpeg‎

7.56 KB
Loading

‎public/assets/juik.jpeg‎

7.81 KB
Loading

‎public/assets/sebschu.jpeg‎

6.77 KB
Loading

‎public/assets/txell.jpeg‎

7.54 KB
Loading

0 commit comments

Comments
 (0)