-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
65 lines (59 loc) · 2.91 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Axel Barck-Holst</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<button id="languageToggle">Swe 🌐</button>
<header>
<h1>Axel Barck-Holst</h1>
<nav>
<ul>
<li><a href="#projects" id="navProjects">Projects</a></li>
<li><a href="#about" id="navAbout">About</a></li>
<li><a href="#contact" id="navContact">Contact</a></li>
</ul>
</nav>
</header>
<section id="about">
<h2 id="aboutHeading">About Me</h2>
<img src="assets/images/profile.jpg" alt="A portrait of me" class="profile-image">
<p id="aboutText">Hi! My name is Axel and I'm studying my fourth year at the Degree Programme in Media Technology at KTH. Welcome to my portfolio website!</p>
</section>
<section id="projects">
<h2 id="projectsHeading">My Projects</h2>
<!-- Example Project -->
<a href="https://mtgn.nu/login" target="_blank" class="project-link">
<article class="project">
<img src="assets\images\mtgn23.png" alt="Media Technology Reception Project" class="project-image">
<div class="project-description">
<h3 id="MTGNprojectTitle">KTH Media Technology Reception Website</h3>
<p id="MTGNprojectDescription">I was the project manager for the development of the Media Technology Reception Website at KTH in 2023. The project involved working with React, Firebase, HTML, Javascript och CSS. We also used the CMS Contentful.</p>
</div>
</article>
</a>
<a href="https://canine-guessrd.web.app/" target="_blank" class="project-link">
<article class="project">
<img src="assets\images\CanIneGuessrd.png" alt="Media Technology Reception Project" class="project-image">
<div class="project-description">
<h3 id="DogProjectTitle">Canine Guessrd — A dog guessing game</h3>
<p id="DogProjectDescription">This was the final Project in the course “Interaction Programming and the Dynamic Web”. For this project we worked with React, Firebase, API’s, HTML, Javascript and CSS.</p>
</div>
</article>
</a>
<!-- Add more projects as needed -->
</section>
<section id="contact">
<h2 id="contactHeading">Contact Me</h2>
<p><a href="mailto:[email protected]" target="_blank" id="emailLink">[email protected]</a></p>
<p><a href="https://www.linkedin.com/in/axel-barck-holst-507103202/" target="_blank" id="linkedinLink">LinkedIn</a></p>
</section>
<footer>
<p>© 2023 Axel Barck-Holst</p>
</footer>
<script src="script.js"></script>
</body>
</html>