-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
131 lines (99 loc) · 6.54 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
<html>
<head>
<title>Mya Schroder</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="icon" href="static/favicon.ico">
</head>
<body class="m-0">
<!---------------------------------------- Navbar ---------------------------------------->
<nav class="content-spread">
<span class="text-bold text-lg text-gray p-2"> Mya Schroder </span>
<div class="p-2">
<a href="mailto:[email protected]" target="_blank"> <img src="static/EmailLogo.png" class="img-sm img-gray"></a>
<a href="https://github.com/schromya" target="_blank"> <img src="static/GithubLogo.png" class="img-sm img-gray"></a>
<a href="https://linkedin.com/in/schromya" target="_blank"> <img src="static/LinkedinLogo.png" class="img-sm img-gray"></a>
</div>
</nav>
<!---------------------------------------- BODY ---------------------------------------->
<div class='text-white content-scroll static-height'>
<!---------------------------------------- ABOUT ME ---------------------------------------->
<div class=" m-2 min-static-height">
<div class="speech-bubble-box speech-bubble-triangle">
<div class="text-2xl text-bold"> Hey there!</div>
<div class="text-lg">
Welcome to Mya's personal website, where you can hop around, just like me, your friendly webpage frog!
Mya is a <b>software engineer</b> who is currently working on <span class="text-yellow">robot dexterity</span> in the <span class="text-yellow">People and Robots Lab</span> at the UW-Madison.
Before you go, be sure to play a game with me at the bottom of the page.
</div>
</div>
<div class=" content-right">
<img src="assets/FrogTalk.png" class="pb-2">
</div>
</div>
<!---------------------------------------- PORTFOLIO ---------------------------------------->
<div class="bg-gray ml-20-md mr-20-md text-md border-rounded-sm-md">
<!---------------------------------------- NAV ---------------------------------------->
<div class=" content-center content-stick-top pt-2 pb-1 border-rounded-sm-md">
<!-- <a href="#overviewSection" class="text-white">Overview</a> • -->
<a href="#experienceSection" class="text-white">Experience</a> •
<a href="#projectsSection" class="text-white">Projects</a> •
<a href="#educationSection" class="text-white">Education</a> •
<a href="#awardsSection" class="text-white">Awards</a>
</div>
<br><br>
<!---------------------------------------- CONTENT ---------------------------------------->
<!---------------------------------------- GRAPHS ---------------------------------------->
<span class=" text-2xl text-bold pt-4 pl-2 " id="overviewSection"> Overview </span>
<div class=" content-flex pl-4 pb-5">
<!-- <div class="bg-white ml-2 mt-2 border-rounded-sm">
<table class="text-gray " id="timeTable"></table>
<div class="content-center text-white text-md pb-1 pt-1">
<span class="bg-green p-05 border-rounded-sm">Experience</span>
<span class="bg-pink p-05 border-rounded-sm">Projects</span>
<span class="bg-light-pink p-05 border-rounded-sm">Education</span>
<span class="bg-teal p-05 border-rounded-sm">Awards</span>
</div>
</div> -->
<div class="bg-white mt-2 border-rounded-sm">
<table class="text-gray" id="skillsTable"></table>
<!--Axis-->
<div class="content-center pb-1">
<span class="text-gray pb-1">Project Count</span>
</div>
</div>
</div>
<div class=" pl-2 pr-2">
<!---------------------------------------- EXPERIENCE ---------------------------------------->
<span class=" text-2xl text-bold pt-5" id="experienceSection"> Experience </span>
<ul id="experience" class="text-sm p-0"></ul>
<!---------------------------------------- PROJECTS ---------------------------------------->
<span class=" text-2xl text-bold pt-4" id="projectsSection"> Projects & Leadership </span>
<ul id="projects" class="text-sm p-0"></ul>
<!---------------------------------------- EDUCATION ---------------------------------------->
<span class="text-2xl text-bold pt-4" id="educationSection"> Education </span>
<ul id="education" class="text-sm p-0"></ul>
<!---------------------------------------- ACHIEVEMENTS ---------------------------------------->
<span class="text-2xl text-bold pt-4" id="awardsSection"> Awards & Competitions</span>
<ul id="awards" class="text-sm p-0"></ul>
</div>
</div>
<!---------------------------------------- GAME ---------------------------------------->
<div class>
<!-- Game sprites controlled in javascript -->
<div id="gameText" class="text-bold text-md text-gray"></div>
<img id="frog" class="img-lg">
<img id="shroom" class="img-lg">
<img id="gameOver" class="img-xl">
<div id="score" class="text-bold text-md text-gray"></div>
</div>
<!---------------------------------------- FOOTER ---------------------------------------->
<!-- <footer class="text-sm text-center content-stick-bottom p-2 ">
Website designed and <a href="https://github.com/schromya/Mya" target="_blank">programmed</a> by Mya Schroder | 2024
</footer> -->
</body>
</html>
<script src="gameLogic.js"></script>
<script src="data.js"></script> <!-- Holds Resume Data -->
<script src="dataInjest.js"></script>