-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.html
112 lines (102 loc) · 10.3 KB
/
about.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
<!DOCTYPE html>
<html lang="en">
<head>
<title>Ryan Frederich</title>
<meta charset="UTF-8">
<meta name="author" content="Ryan Frederich">
<!-- Gives browser instructions on how to control the page's dimensions and scaling -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie-edge">
<script src="js/script.js" type="text/javascript"></script>
<script src="js/vars.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/light.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/mobile-style.css">
<link rel="stylesheet" href="css/variables.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter">
<script src="https://kit.fontawesome.com/83640c69a1.js" crossorigin="anonymous"></script>
</head>
<body>
<div class="content">
<header>
<nav class="nav-bar">
<!-- play button svg -->
<div class="nav-bar-play" width="50px" viewBox="0 0 72 72" id="svgPlayID">
<path class="nav-bar-svg" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M19.5816,55.6062 c0.4848,0.1782,1.0303,0.297,1.5758,0.297c0.8485,0,1.697-0.297,2.4242-0.7722l30-15.9793l0.303-0.297 c0.7879-0.7722,1.2121-1.7227,1.2121-2.7919c0-1.0692-0.4242-2.0791-1.2121-2.7919l-0.303-0.297l-30-16.0981 c-1.0909-0.8316-2.6667-1.0098-4-0.4752c-1.5152,0.594-2.4848,2.0791-2.4848,3.683v31.8397 C17.0967,53.5272,18.0664,55.0122,19.5816,55.6062z"/>
</div>
<ul class="nav-menu">
<li class="nav-item">
<a href="/index.html" class="nav-link">Home</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">About</a>
</li>
<li class="nav-item">
<a href="/contact.html" class="nav-link">Contact</a>
</li>
<li class="nav-item" id="svgNav">
<a href="#" class="nav-link" id="svgContainer">
<span class="switch-color">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="50px" height="50px" id="svgID">
<path d="M 24.90625 3.96875 C 24.863281 3.976563 24.820313 3.988281 24.78125 4 C 24.316406 4.105469 23.988281 4.523438 24 5 L 24 11 C 23.996094 11.359375 24.183594 11.695313 24.496094 11.878906 C 24.808594 12.058594 25.191406 12.058594 25.503906 11.878906 C 25.816406 11.695313 26.003906 11.359375 26 11 L 26 5 C 26.011719 4.710938 25.894531 4.433594 25.6875 4.238281 C 25.476563 4.039063 25.191406 3.941406 24.90625 3.96875 Z M 10.65625 9.84375 C 10.28125 9.910156 9.980469 10.183594 9.875 10.546875 C 9.769531 10.914063 9.878906 11.304688 10.15625 11.5625 L 14.40625 15.8125 C 14.648438 16.109375 15.035156 16.246094 15.410156 16.160156 C 15.78125 16.074219 16.074219 15.78125 16.160156 15.410156 C 16.246094 15.035156 16.109375 14.648438 15.8125 14.40625 L 11.5625 10.15625 C 11.355469 9.933594 11.054688 9.820313 10.75 9.84375 C 10.71875 9.84375 10.6875 9.84375 10.65625 9.84375 Z M 39.03125 9.84375 C 38.804688 9.875 38.59375 9.988281 38.4375 10.15625 L 34.1875 14.40625 C 33.890625 14.648438 33.753906 15.035156 33.839844 15.410156 C 33.925781 15.78125 34.21875 16.074219 34.589844 16.160156 C 34.964844 16.246094 35.351563 16.109375 35.59375 15.8125 L 39.84375 11.5625 C 40.15625 11.265625 40.246094 10.800781 40.0625 10.410156 C 39.875 10.015625 39.460938 9.789063 39.03125 9.84375 Z M 24.90625 15 C 24.875 15.007813 24.84375 15.019531 24.8125 15.03125 C 24.75 15.035156 24.6875 15.046875 24.625 15.0625 C 24.613281 15.074219 24.605469 15.082031 24.59375 15.09375 C 19.289063 15.320313 15 19.640625 15 25 C 15 30.503906 19.496094 35 25 35 C 30.503906 35 35 30.503906 35 25 C 35 19.660156 30.746094 15.355469 25.46875 15.09375 C 25.433594 15.09375 25.410156 15.0625 25.375 15.0625 C 25.273438 15.023438 25.167969 15.003906 25.0625 15 C 25.042969 15 25.019531 15 25 15 C 24.96875 15 24.9375 15 24.90625 15 Z M 24.9375 17 C 24.957031 17 24.980469 17 25 17 C 25.03125 17 25.0625 17 25.09375 17 C 29.46875 17.050781 33 20.613281 33 25 C 33 29.421875 29.421875 33 25 33 C 20.582031 33 17 29.421875 17 25 C 17 20.601563 20.546875 17.035156 24.9375 17 Z M 4.71875 24 C 4.167969 24.078125 3.78125 24.589844 3.859375 25.140625 C 3.9375 25.691406 4.449219 26.078125 5 26 L 11 26 C 11.359375 26.003906 11.695313 25.816406 11.878906 25.503906 C 12.058594 25.191406 12.058594 24.808594 11.878906 24.496094 C 11.695313 24.183594 11.359375 23.996094 11 24 L 5 24 C 4.96875 24 4.9375 24 4.90625 24 C 4.875 24 4.84375 24 4.8125 24 C 4.78125 24 4.75 24 4.71875 24 Z M 38.71875 24 C 38.167969 24.078125 37.78125 24.589844 37.859375 25.140625 C 37.9375 25.691406 38.449219 26.078125 39 26 L 45 26 C 45.359375 26.003906 45.695313 25.816406 45.878906 25.503906 C 46.058594 25.191406 46.058594 24.808594 45.878906 24.496094 C 45.695313 24.183594 45.359375 23.996094 45 24 L 39 24 C 38.96875 24 38.9375 24 38.90625 24 C 38.875 24 38.84375 24 38.8125 24 C 38.78125 24 38.75 24 38.71875 24 Z M 15 33.875 C 14.773438 33.90625 14.5625 34.019531 14.40625 34.1875 L 10.15625 38.4375 C 9.859375 38.679688 9.722656 39.066406 9.808594 39.441406 C 9.894531 39.8125 10.1875 40.105469 10.558594 40.191406 C 10.933594 40.277344 11.320313 40.140625 11.5625 39.84375 L 15.8125 35.59375 C 16.109375 35.308594 16.199219 34.867188 16.039063 34.488281 C 15.882813 34.109375 15.503906 33.867188 15.09375 33.875 C 15.0625 33.875 15.03125 33.875 15 33.875 Z M 34.6875 33.875 C 34.3125 33.941406 34.011719 34.214844 33.90625 34.578125 C 33.800781 34.945313 33.910156 35.335938 34.1875 35.59375 L 38.4375 39.84375 C 38.679688 40.140625 39.066406 40.277344 39.441406 40.191406 C 39.8125 40.105469 40.105469 39.8125 40.191406 39.441406 C 40.277344 39.066406 40.140625 38.679688 39.84375 38.4375 L 35.59375 34.1875 C 35.40625 33.988281 35.148438 33.878906 34.875 33.875 C 34.84375 33.875 34.8125 33.875 34.78125 33.875 C 34.75 33.875 34.71875 33.875 34.6875 33.875 Z M 24.90625 37.96875 C 24.863281 37.976563 24.820313 37.988281 24.78125 38 C 24.316406 38.105469 23.988281 38.523438 24 39 L 24 45 C 23.996094 45.359375 24.183594 45.695313 24.496094 45.878906 C 24.808594 46.058594 25.191406 46.058594 25.503906 45.878906 C 25.816406 45.695313 26.003906 45.359375 26 45 L 26 39 C 26.011719 38.710938 25.894531 38.433594 25.6875 38.238281 C 25.476563 38.039063 25.191406 37.941406 24.90625 37.96875 Z"/>
</svg>
</span>
</a>
</li>
<!-- SVG -->
<li class="nav-item" id="playbutton">
<a href="#" class="nav-link" id="svgContainer">
<div class="nav-bar-play-mobile" id="svgPlayIDMobile">
<path class="nav-bar-svg" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M19.5816,55.6062 c0.4848,0.1782,1.0303,0.297,1.5758,0.297c0.8485,0,1.697-0.297,2.4242-0.7722l30-15.9793l0.303-0.297 c0.7879-0.7722,1.2121-1.7227,1.2121-2.7919c0-1.0692-0.4242-2.0791-1.2121-2.7919l-0.303-0.297l-30-16.0981 c-1.0909-0.8316-2.6667-1.0098-4-0.4752c-1.5152,0.594-2.4848,2.0791-2.4848,3.683v31.8397 C17.0967,53.5272,18.0664,55.0122,19.5816,55.6062z"/>
</div>
</a>
</li>
</ul>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</div>
</nav>
</header>
<div class="about-bio">
<h1 class="about-bio-h1">About</h1>
<div class="image-bio">
<div class="bio">
<p>I'm a recent graduate from the University of California, Santa Cruz with a bachelor's degree
in <a class="about-link" href="https://admissions.ucsc.edu/programs/technology-and-information-management">Technology and Information Managment</a>
and a minor in Computer Science.
</p>
<p>My interests are in <a class="about-link" href="./network_diagram.html">networking</a>, automation and web development.</p>
<p>Previously, I was a Web Development intern at <a class="about-link" href="https://www.callawaygolf.com/">Callaway Golf</a>
where I contributed to the development and maintenance of the <a class="about-link" href="https://www.travismathew.com/">Travis Mathew</a> eCommerce website.
</p>
<p>Outside of my work I enjoy surfing, camping, traveling and reading.</p>
</div>
<img class="selfie" src="./images/selfie.jpg"/>
</div>
<h1 class="skills-h1">Skills</h1>
<ul class="skills">
<li class="skills-item" id="python">Python</li>
<li class="skills-item" id="C">C/C++</li>
<li class="skills-item" id="js">Javascript</li>
<li class="skills-item" id="html">HTML/CSS</li>
<li class="skills-item" id="react">React</li>
<li class="skills-item" id="sql">SQL</li>
<li class="skills-item" id="networking">Networking</li>
<li class="skills-item" id="git">Git</li>
<li class="skills-item" id="bash">Bash</li>
</ul>
</div>
<footer>
<ul class="social-media-icons">
<li><a href="http://www.linkedin.com/in/ryanfreder"><i class="fa-brands fa-linkedin"></i></a></li>
<li><a href="http://www.github.com/ryansurf"><i class="fa-brands fa-github"></i></a></li>
<li><a href="/resume.pdf"><i class="fa-regular fa-file"></i></a></li>
<li><a href="mailto:[email protected]"><i class="fa-regular fa-envelope"></i></a></li>
</ul>
<h3 class="copyright">@ <script>document.write(new Date().getFullYear())</script> Ryan Frederich</h3>
</footer>
</div>
</body>
</html>