-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathabout.html
More file actions
99 lines (88 loc) · 5.41 KB
/
about.html
File metadata and controls
99 lines (88 loc) · 5.41 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>About - Meter Games</title>
<link rel="icon" href="images/favicon-light.ico" type="image/x-icon" />
<link rel="icon" href="images/favicon-light.ico" type="image/x-icon" media="(prefers-color-scheme: light)" />
<link rel="icon" href="images/favicon-dark.ico" type="image/x-icon" media="(prefers-color-scheme: dark)" />
<script>
const savedTheme = localStorage.getItem("theme") || "dark";
document.documentElement.setAttribute("data-theme", savedTheme);
</script>
<link rel="stylesheet" href="style.css" />
</head>
<body class="about-theme">
<div class="container">
<site-header page="about"></site-header>
<section class="hero">
<h1>Ryan Morov</h1>
<p>Software Engineer & Game Developer based in Quebec.</p>
<div style="display: flex; gap: 15px; justify-content: center; flex-wrap: wrap; margin-top: 20px;">
<a href="https://www.linkedin.com/in/ryan-morov" target="_blank" rel="noreferrer" class="btn">
Connect on LinkedIn
</a>
<a href="https://github.com/metergames" target="_blank" rel="noreferrer" class="btn">
GitHub Profile
</a>
<a href="ryan-morov-resume.pdf" download="Ryan_Morov_Resume.pdf" class="btn">
Download CV
</a>
</div>
</section>
<div class="grid">
<div class="card">
<h3>The Developer</h3>
<p>I am a Computer Science student at John Abbott College with a passion for building systems that just <em>feel</em> good to use.</p>
<p>Whether it's the physics of a drift in <strong>Parker</strong>, the data persistence in <strong>StudySnap</strong>, or the real-time API routing of <strong>Pit Wall</strong>, I obsess over the details that bridge the gap between code and user experience.</p>
</div>
<div class="card" style="border-color: var(--about-accent);">
<h3 style="color: var(--about-accent)">Latest Update</h3>
<p>I shared the refactor story of Pit Wall, an F1 data dashboard I originally built for school, now completely rewritten from scratch using React, TypeScript, and Vite.</p>
<a href="https://www.linkedin.com/posts/ryan-morov_%F0%9D%97%AA%F0%9D%97%B5%F0%9D%98%86-%F0%9D%97%9C-%F0%9D%97%B0%F0%9D%97%BC%F0%9D%97%BA%F0%9D%97%BD%F0%9D%97%B9%F0%9D%97%B2%F0%9D%98%81%F0%9D%97%B2%F0%9D%97%B9%F0%9D%98%86-%F0%9D%97%BF%F0%9D%97%B2%F0%9D%98%84%F0%9D%97%BF%F0%9D%97%BC-activity-7437358936749510656-wybW" target="_blank" rel="noreferrer" style="color: var(--about-accent); font-weight: bold; text-decoration: underline;">Read the full breakdown on LinkedIn</a>
</div>
</div>
<section class="tech-showcase" style="margin-top: 60px;">
<h2>Technical Toolkit</h2>
<div class="grid" style="grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); text-align: left;">
<div class="card">
<h3 style="font-size: 1.2rem;">Languages</h3>
<div class="skill-container">
<span class="skill-badge">C#</span>
<span class="skill-badge">Python</span>
<span class="skill-badge">JavaScript</span>
<span class="skill-badge">TypeScript</span>
<span class="skill-badge">SQL (MSSQL)</span>
<span class="skill-badge">HTML / CSS</span>
<span class="skill-badge">Swift</span>
</div>
</div>
<div class="card">
<h3 style="font-size: 1.2rem;">Frameworks & Tools</h3>
<div class="skill-container">
<span class="skill-badge">.NET & WPF</span>
<span class="skill-badge">Unity 3D</span>
<span class="skill-badge">React</span>
<span class="skill-badge">Vite</span> <span class="skill-badge">Git</span>
<span class="skill-badge">REST APIs</span>
<span class="skill-badge">Unit Testing</span>
<span class="skill-badge">AI Integration</span>
</div>
</div>
</div>
</section>
<section class="open-source-section">
<h2>Open Source Contributions</h2>
<div id="oss-contrib-list" class="open-source-grid" aria-live="polite">
<div class="card open-source-card">
<h3>Loading contributions...</h3>
<p>This updates automatically once the GitHub requests finish.</p>
</div>
</div>
</section>
<site-footer></site-footer>
</div>
<script src="script.js"></script>
</body>
</html>