-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.html
178 lines (160 loc) · 9.11 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
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
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
<!DOCTYPE html>
<html lang="en-us">
<head>
<title>Katlin Scott: About</title>
<link rel="icon" type="image/x-icon" href="KS.ico"> <!-- Make a custom favicon -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<!-- Linked CSS Files-->
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="text-roller.css">
<link rel="stylesheet" href="TypingEffect.css">
<!-- Fonts Here -->
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Audiowide">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Rubik Iso">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Bagel Fat One">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Bungee Inline">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Tilt+Neon&display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Josefin+Sans">
<!-- JS Files -->
<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>-->
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="scrambling-text.js"></script>
<!-- Word Scrambler Code -->
<script>
const TEXTS = [
'things',
'mobile apps',
'websites',
'games',
'webapps',
'ui/ux',
];
const scrambler = new window.Scrambler();
const handleScramble = (text) => {
document.getElementById('text').innerHTML = text;
}
let i = 0;
function printText() {
const targetText = TEXTS[i % TEXTS.length];
if (i++ % 3 == 2) {
scrambler.scramble(targetText, handleScramble, {
characters: Scrambler.CHARACTERS.ALPHABET,
});
} else {
scrambler.scramble(targetText, handleScramble);
}
setTimeout(printText, 3000);
}
printText();
</script>
</head>
<!-- Create separate pages for everything once index gets sorted -->
<body style="margin-top: 49px;" id="home">
<div class="topnav">
<a href="index.html">Home</a>
<a href="about.html">About</a> <!--The actual about.html page is not going to be used until more is added-->
<a href="ClassProjects.html">Class Projects</a>
<!--<a href="">Personal Projects</a>-->
<a href="index.html#Contact">Contact</a>
<!--
<a href="">Community Work</a>
<a href="">Competitive Events</a>
<a href="">Activities</a>
-->
<div style="float:right">
<a href="mailto:[email protected]" target="_blank" class="bodylinks" style="padding-left: 5px; padding-right: 5px">
<img src="Images/gmail.png" alt="Gmail Icon by Pixel perfect" style="width:20px;height:20px;">
</a>
<a href="https://www.linkedin.com/in/Katsco" target="_blank" class="bodylinks" style="padding-left: 5px; padding-right: 5px">
<img src="Images/linkedin.png" alt="LinkedIn Icon by riajulislam" style="width:20px;height:20px;">
</a>
<a href="https://github.com/Katsco" target="_blank" class="bodylinks" style="padding-left: 5px; padding-right: 5px">
<img src="Images/github.png" alt="GitHub Icon by riajulislam" style="width:20px;height:20px;">
</a>
</div>
</div>
<div class="animBaseRoller" style="color: #EDF2F6; font-family: monospace;">
<!--<h2 style="font-size: 35px"></h2>-->
<h1>System<span style="color:white;">.<span style="color:#e06c75;">out</span>.</span><span style="color:#61afef;">println</span>("</h1>
<div class="string">
<h1 class="greeting en" style="margin-top:0px;margin-bottom:0px;">Hello World!</h1>
<h1 class="greeting fr" style="margin-top:0px;margin-bottom:0px;">Bonjour Monde!</h1>
<h1 class="greeting es" style="margin-top:0px;margin-bottom:0px;">¡Hola Mundo!</h1>
<h1 class="greeting it" style="margin-top:0px;margin-bottom:0px;">Ciao Mondo!</h1>
</div>
<h1 class="closure">");</h1> <!--class="closure"-->
</div>
<div class="intro" style="text-align:center;">
<!--<div class="word"></div>-->
<!-- Want to do type animation for my name -->
<h1 class="typing" style="color:white;font-family:monospace;">Hi, my name is Katlin Scott</h1>
<h2 style="color:white;">I <span style="font-size:25px;font-family: serif;"><em>design</em></span> and <span style="font-size:25px;font-family: monospace;">develop</span>
<span id="text" style="font-family: 'Courier New', Courier, monospace;"></span></h2>
</div>
<div class="Title">
<hr width="84%" color="#6F8A53" size="3px">
<h1>About Me</h1>
<hr width="84%" color="#6F8A53" size="3px">
</div>
<div class="Body" style="text-align: justify; font-family: 'Courier New', Courier, monospace; padding: 50px">
<p>
My name is Katlin Scott, and simply, I have a passion for learning about the ever-growing field of technology.
<br>
<br>I am a recent graduate from Kennesaw State University with a Bachelor of Science in Computer Science. My passion and interest in technology have driven me to pursue a Computer Science degree and constantly learn about the ever-changing world of the technology around us.
<br>
<br>My journey in Computer Science began with my interest in computers and technology when I was a young kid with my family’s home computer and other technology we had around the house. I discovered that I enjoyed using this technology, and as more and more technology was introduced, I wanted to be a part of the process of learning how to create and produce such technology. Since then, following me into my undergraduate studies, I discovered my knack for problem-solving and passion for technology and have had a drive to develop my own creations and have a drive to constantly learn about the new technology surrounding us.
<br>
<br>I thrive on solving complex problems and am constantly seeking new challenges to expand my skills and knowledge. Whether it's coding refined algorithms, designing efficient databases, or crafting intuitive user interfaces, I'm always eager to dive in and tackle projects head-on.
<br>
<br>When I’m not researching and learning new general and specific things about technology, you can find me listening to music, reading, writing, playing games, creating graphics, or messing with Photoshop or Premiere Pro. I believe that knowledge is power and that if you want to do or learn something, you should go for it and see where it takes you.
<br>
<br>I am passionate about the technology industry. However, I have a particular interest in software development, and I've enjoyed working on projects such as developing websites, desktop applications, and mobile applications for the Android platform. Additionally, I'm fascinated by artificial intelligence, machine learning, cybersecurity, and data science, and I've recently worked on a project where my group and I used AI to generate beat maps in our Dynamic Rhythm Game for our Senior Capstone Project.
</p>
</div>
<div class="Title">
<hr width="84%" color="#6F8A53" size="3px">
<h1>Technical Skills</h1>
<hr width="84%" color="#6F8A53" size="3px">
</div>
<div class="Body" style="text-align: left; font-family: 'Courier New', Courier, monospace; padding-left: 450px">
<p>
<ul>
<li>Programming (C, C++, Java, Python, SQL)</li>
<li>Web Development (HTML, CSS, JavaScript, JQuery)</li>
<li>Microsoft Office (Access, Excel, PowerPoint, Visio, Word)</li>
<li>Adobe Creative Cloud (Acrobat, Dreamweaver, Photoshop, Premiere Pro)</li>
<li>Conversational French (6+ years of experience)</li>
<li>Database Management (Adobe Access, SQL Server 2019)</li>
<li>Data Analysis</li>
<li>Technical Writing</li>
<li>Troubleshooting</li>
</ul>
</p>
</div>
<br>
<div class="Title">
<hr width="84%" color="#6F8A53" size="3px">
<h1>Resume</h1>
<hr width="84%" color="#6F8A53" size="3px">
</div>
<br>
<div style="margin-left:auto;margin-right:auto;text-align:center">
<object data="/Documents/KatlinScott-Resume-Redacted.pdf" type="application/pdf" width="75%" height="1000px">
<p>Unable to display PDF file. <a href="/Documents/KatlinScott-Resume-Redacted.pdf">Download</a> instead.</p>
</object>
</div>
<div class="Footer">
<p class="quoteHeader" style="font-size: 100%; line-height: 130%">
"Anything worth having is worth working for.
<br>
Anything worth doing is worth doing well."
<br>
- Reginald Ferguson
</p>
</div>
</body>
</html>