-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
60 lines (60 loc) · 3.63 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
<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WiviWonderWoman</title>
<!--Links to Google Fonts, style sheet and font awsome-->
<link href="https://fonts.googleapis.com/css2?family=Amatic+SC:wght@700&family=Tangerine:wght@700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Amatic+SC:wght@700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./style.css">
<script src="https://kit.fontawesome.com/fd54308f64.js" crossorigin="anonymous"></script>
</head>
<body>
<header>
<h1>WiviWonderWoman</h1>
</header>
<!--Navigation, flexbox, unordered list, buttons with links on my page-->
<nav class="flex-container">
<ul>
<li><button id="Presentation">Presentation</button></li>
<li><button id="cv">mitt cv</button></li>
<li><button id="ideellt">ideellt</button></li>
<li><button id="hobbies">intressen</button></li>
<li><button id="sum">summering</button></li>
<li><button id="portfolio">portfolio</button></li>
<li><button id="contact">kontakt</button></li>
</ul>
</nav>
<!--Content-->
<article>
<!--Div for content, id can be used in future uppgrades with JavaScript-->
<div id="content">
<h2>Välkommen!</h2>
<div id="profilPic">
<img src="./Profilbild-200.jpg" alt="photo of me" >
</div>
<p>Kul att du hittade hit. Mitt namn är Wivianne Grapenholt. Jag är född 1975, uppvuxen i Helsingborg, numera bosatt i Höganäs. Här nedanför försöker jag ge en bild av vem jag är och mot slutet ska jag summera och förklarar mitt smått kaxiga användarnamn WiviWonderWoman.</p>
<p>Efter många år av att lägga all min energi och tid på att som ensamstående få min och mina fem barns neurodivergenta vardag att gå runt så är jag nu framme vid en milstolpe i mitt liv.</p>
<p><em>Äntligen</em> vet jag vad jag vill bli när jag blir stor, eller i alla fall inom vilken bransch.</p>
<p>Jag får ofta höra att jag är bra på att: tänka utanför boxen, se detaljer, tydliggörande layout, formulera mig i skrift och vara kreativ.</p>
</div>
</article>
<!--Footer-->
<footer>
<!--Div, flexbox, unordered list, icons that are links-->
<div class="flex-container">
<ul>
<li><button><a href="mailto:w.grapenholt@gmail.com" target=":_blank"><i class="fas fa-at"></i></a></button></li>
<li><button><a href="https://github.com/WiviWonderWoman" target="_blank"><i class="fab fa-github-alt"></i></a></button></li>
<li><button><a href="https://www.linkedin.com/in/wivianne-grapenholt-673b701b6/" target="_blank"><i class="fab fa-linkedin"></i></a></button></li>
<li><button><a href="https://www.instagram.com/wivianne_grapenholt/" target="_blank"><i class="fab fa-instagram"></i></a></button></li>
<li><button><a href="https://www.facebook.com/wivi.grapenholt" target="_blank"><i class="fab fa-facebook"></i></a></button></li>
</ul>
</div>
<!--Copyright info-->
<p id="copy"><span> "WiviWonderWoman" </span><br/>© Wivianne Grapenholt</p>
</footer>
<script src="./script.js"></script>
</body>
</html>