-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
84 lines (72 loc) · 4.44 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!DOCTYPE html>
<html>
<head>
<title>Benjamin Garcés C. - Scientific Communications Portfolio</title>
<title>Scientific Communications Portfolio</title>
<link rel="icon" href="images/favicon.ico" type="image/x-icon" width="32" height="32">
<link rel="stylesheet" href="Style1.css"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Helvetica+Neue:wght@400;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
</head>
<body>
<header>
<h1>Benjamin Garcés C. - Scientific Communications Portfolio</h1>
</header>
<hr class="separator">
<div class="container">
<div class="column" id="intro">
<section id="home">
<h2>Introduction</h2>
<img src="images/324a.jpg" alt="Benjamin" class="profile-image">
<p>Biochemistry engineer with background in molecular & cellular biology and bioinformatics. Currently working as IB science teacher. I possess skills in statistical analysis in R, genetics and I have a special interest in genetics & neurosciences. I'm consistently improving my knownledge and skills in the fields of my main academic interests. I've been into scientific communication lately due to my genuine passion for science and sort of learned to code in html for the fun of building my personal portfolio. I also love dinosaurs.</p>
</section>
<section id="about">
<h2>About this webpage</h2>
<p>I've built this webpage to showcase my skills in science communciation oriented to the general public. Here you'll find some articles about practical science curiosities and news about some topics of interest. You're welcome to reach out in case you need services in scientific communication, language translation, scientific research or just to chat about science. </p>
</section>
<section id="contact">
<h2>Contact</h2>
<div class="contact-images">
<a href="https://www.linkedin.com/in/abgc2381" target="_blank">
<img src="images/linkedin.png" alt="LinkedIn">
</a>
<a href="https://twitter.com/agarces2381" target="_blank">
<img src="images/x.png" alt="Twitter">
</a>
<a href="mailto:[email protected]">
<img src="images/mail.png" alt="Email">
</a>
</div>
</section>
</div>
<div class="column" id="news">
<section id="news">
<h2>News Articles Portfolio</h2>
<div class="news-gallery" id="news-container">
<script type="text/javascript">
const articleFiles = ['article1.html', 'article2.html', 'article4.html'];
const newsContainer = document.getElementById('news-container');
articleFiles.forEach(filename => {
fetch(filename)
.then(response => response.text())
.then(html => {
const articleElement = document.createElement('article');
articleElement.innerHTML = html;
newsContainer.appendChild(articleElement);
});
});
</script>
<div data-article-file="article1.html"></div>
<div data-article-file="article2.html"></div>
<div data-article-file="article4.html"></div>
</div>
</section>
</div>
</div>
<section id="Statement">
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by-nc-sa/4.0/88x31.png" /></a>
<p>Unless otherwise stated, all content on this website is licensed under a Creative Commons Attribution 4.0 International License (CC BY 4.0).</p>
<ul>
</ul>
</body>
</html>