-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
154 lines (133 loc) · 6.84 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
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<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=Dosis&family=Noto+Sans+JP&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style/index.css">
</head>
<body>
<header>
<div>
<h1>Marie Kirton-Daike</h1>
<h2>大家 マリー</h2>
</div>
<div class="nav">
<nav>
<a class="pink" href="1.html">Home</a>
<a class="purple" href="2.html">About</a>
<a class="blue" href="#contact">Contact</a>
<a class="green" href="#kawaii">Projects</a>
</nav>
</div>
<div class="music">
<audio controls autoplay muted>
<source src="nature-restores-full.wav" type="audio/wav">
Your browser does not support the audio tag.
</audio>
</div>
</header>
<main>
<div class="intro">
<img class="profilepic"
src="https://lh3.googleusercontent.com/QPm2RmT34Wt8BiEAvRnZjMkc4DbyiS9h04IF7zk_BY-NGPPkSeKwLChqEd17GxRjCQZvGzbkgAMisPAp_YMKucagy8FRz3d90_XudhZ5c1kU2GC83nSyhdA60o-e5Tza5QSjktmN=w2400"
alt="a picture of myself">
<div class="myname">
<h2>Marie</h2>
<a href="">My Project<br>
プロジェクト
</a>
<p>Hi! My name is Marie and I love to solve problems and be creative. That's why I love programming! With <br> programming I was able to show my kawaii (cute in Japanese) side by making this pretty website. At <br>the same time I was able to solve problems in my code like in the NASA App. That one was hard to <br>make and I found bugs in my code, but with a lot of help from my teachers and trying to solve the <br>problems on my own, I was able to make the app! Cool, right? On this website you can see that I <br>display some other projects I’ve worked on that have nothing to do with coding, but this shows my <br>diversity. I love writing and wrote some books. I also like music and made a song. Hope you enjoy <br>the variety. Thank you for visiting my website! </p>
<p>私の可愛いポートフォリオへようこそ <br> (Welcome to My Cute Portfolio)</p>
</div>
</div>
</main>
<section id="kawaii" class="pictures">
<div class="thestuff">
<div class="container">
<img class="image" src="https://wallpapercave.com/wp/wp4588148.png" alt="city night">
<div class="overlay">
<a href="https://www.amazon.com/Elephant-Room-Tamashi-D-ebook/dp/B0BS9ZRKQW/ref=sr_1_1?crid=2O37GQONH1MNX&keywords=the+elephant+in+the+room+tamashi+d&qid=1677118214&sprefix=the+elephant+in+the+room+tamashi+d%2Caps%2C76&sr=8-1" target="_blank">
<div class="text">A Book I've Written</div>
</a>
</div>
</div>
<div class="container">
<img class="image"
src="https://wallpapers.com/images/featured-small/kawaii-purple-vzc13pjmegmxt2ny.webp"
alt="two girls walking with kawaii accessories">
<div class="overlay">
<a
href="https://www.amazon.com/Bitter-Sweet-Book-Short-Anthology-ebook/dp/B09B1X8TC3/ref=sr_1_1?crid=1454HM4NBLWYM&keywords=the+bitter+sweet+book+sam+shorts&qid=1677118273&sprefix=the+bitter+sweet+book+sam+short%2Caps%2C98&sr=8-1" target="_blank">
<div class="text">A Book I've Co-Authored</div>
</a>
</div>
</div>
<div class="container">
<img class="image"
src="https://wallpapers.com/images/high/kawaii-purple-and-pink-houses-0prrj2z7aq9dnrmu.webp"
alt="nighttime in kyoto">
<div class="overlay">
<a href="https://music.apple.com/me/album/black-vans-single/1638736962"target="_blank" >
<div class="text">Music I've Made</div>
</a>
</div>
</div>
<div class="container">
<img class="image"
src="https://wallpapers.com/images/high/kawaii-purple-sky-with-hearts-i6yehd52o4oqu757.webp"
alt="moon in the sky with hearts">
<div class="overlay">
<a href="https://nasa-photo-of-the-day-woad.vercel.app/" target="_blank"><div class="text">MY NASA APP</div></a>
</div>
</div>
</div>
</section>
<!-- -->
<section id="kawaii2">
<div class="thestuff2">
<div class="container">
<img class="image"
src="https://wallpapers.com/images/high/kawaii-purple-dreamy-no-face-4pkvowyla4gcl2j2.webp"
alt="kaonashi from sen to chihiro walking through japan town">
<div class="overlay">
<a href=""><div class="text">TEXT HERE IN CENTER</div></a>
</div>
</div>
<div class="container">
<img class="image"
src="https://wallpapers.com/images/high/kawaii-purple-strips-with-fruit-icons-59e4oeldk5ja5kvu.webp"
alt="cute straps with illustrated smily faces on carrots">
<div class="overlay">
<a href=""><div class="text">TEXT HERE IN CENTER</div></a>
</div>
</div>
<div class="container">
<img class="image"
src="https://wallpapers.com/images/high/kawaii-purple-angel-girl-en8nd0uiaqo4zpg2.webp"
alt="illustrated girl with cute backpack in the night with the moon over her">
<div class="overlay">
<a href=""><div class="text">TEXT HERE IN CENTER</div></a>
</div>
</div>
<div class="container">
<img class="image"
src="https://wallpapers.com/images/high/kawaii-purple-sky-over-city-erl7uao2lnrcedup.webp"
alt="moonlight in the night illustrated">
<div class="overlay">
<a href=""><div class="text">TEXT HERE IN CENTER</div></a>
</div>
</div>
</div>
</section>
<footer>
<div>
<h3 class="ending">Like What You See?</h3>
<button id="contact">Contact Me</button>
</div>
</footer>
</body>
</html>