-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathsoftware_dev.html
More file actions
296 lines (265 loc) · 23.9 KB
/
software_dev.html
File metadata and controls
296 lines (265 loc) · 23.9 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
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
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
<!DOCTYPE html>
<html data-bs-theme="auto" lang="en">
<head>
<meta charset="utf-8">
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-K6TVV7PE2C"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-K6TVV7PE2C');
</script>
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Software Development | sooraj.dev</title>
<link rel="canonical" href="https://sooraj.dev/software_dev.html">
<meta property="og:url" content="https://sooraj.dev/software_dev.html">
<meta property="og:description" content="My personal website, portfolio, place to contact, and everything in between.">
<meta name="twitter:image" content="others/profile_photo_blank_bg.jpg">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary">
<meta property="og:title" content="sooraj.dev">
<meta property="og:image" content="others/profile_photo_blank_bg.jpg">
<meta name="twitter:description" content="All the software I've created in one place for easy access.">
<meta name="description" content="All the software I've created in one place for easy access.">
<meta name="twitter:title" content="Software Development">
<script>
(function() {
// JavaScript snippet handling Dark/Light mode switching
const getStoredTheme = () => localStorage.getItem('theme');
const setStoredTheme = theme => localStorage.setItem('theme', theme);
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
const getPreferredTheme = () => {
if (forcedTheme) return forcedTheme;
const storedTheme = getStoredTheme();
if (storedTheme) {
return storedTheme;
}
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
if (pageTheme) {
return pageTheme;
}
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
}
const setTheme = theme => {
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.documentElement.setAttribute('data-bs-theme', 'dark');
} else {
document.documentElement.setAttribute('data-bs-theme', theme);
}
}
setTheme(getPreferredTheme());
const showActiveTheme = (theme, focus = false) => {
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
if (!themeSwitchers.length) return;
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
element.classList.remove('active');
element.setAttribute('aria-pressed', 'false');
});
const iconTheme = theme === 'auto' ? (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light') : theme;
for (const themeSwitcher of themeSwitchers) {
const adaptIcon = !!themeSwitcher.dataset.bsAdaptIcon;
if (adaptIcon) {
const btnIcon = themeSwitcher.querySelector('[data-bss-adaptable]');
try {
const themeIcons = JSON.parse(themeSwitcher.dataset.bssIcons || "{}");
const newIconMarkup = themeIcons[iconTheme];
const template = document.createElement("template");
template.innerHTML = newIconMarkup;
const newIconFragment = template.content.cloneNode(true);
if (newIconFragment?.children?.length) {
newIconFragment.children[0].dataset.bssAdaptable = true;
}
btnIcon.replaceWith(newIconFragment);
} catch (e) {}
}
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
if (btnToActivate) {
btnToActivate.classList.add('active');
btnToActivate.setAttribute('aria-pressed', 'true');
}
}
}
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
const storedTheme = getStoredTheme();
if (storedTheme !== 'light' && storedTheme !== 'dark') {
setTheme(getPreferredTheme());
}
});
window.addEventListener('DOMContentLoaded', () => {
showActiveTheme(getPreferredTheme());
document.querySelectorAll('[data-bs-theme-value]')
.forEach(toggle => {
toggle.addEventListener('click', (e) => {
e.preventDefault();
const theme = toggle.getAttribute('data-bs-theme-value');
setStoredTheme(theme);
setTheme(theme);
showActiveTheme(theme);
})
})
});
})();
</script>
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/JetBrains%20Mono.css">
<link rel="stylesheet" href="assets/css/bss-overrides.css">
<link rel="stylesheet" href="assets/css/./embed/animation/aos.min.css">
<link rel="stylesheet" href="assets/css/global-styles.css">
<link rel="stylesheet" href="assets/css/header-styles.css">
<link rel="stylesheet" href="assets/css/typing-animation.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.11.1/baguetteBox.min.css" integrity="sha512-NVt7pmp5f+3eWRPO1h4A1gCf4opn4r5z2wS1mi7AaVcTzE9wDJ6RzMqSygjDzYHLp+mAJ2/qzXXDHar6IQwddQ==" crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/footer-styles.css">
</head>
<body><!-- Start: Random Shapes --><div class="background-images"></div><!-- End: Random Shapes --><!-- Start: Header -->
<header class="header-dark" style="padding-bottom: 75px;"><!-- Start: Navigation Bar -->
<nav class="navbar navbar-expand-lg navigation-clean navbar-light">
<div class="container"><a class="navbar-brand" data-aos="fade" data-aos-once="true" href="/index.html">sooraj.dev</a><button class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#navcol-2"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
<div class="collapse navbar-collapse" id="navcol-2">
<ul class="navbar-nav ms-auto">
<li class="nav-item"><a class="nav-link" data-aos="fade" data-aos-once="true" href="/index.html">Home</a></li>
<li class="nav-item"><a class="nav-link" data-aos="fade" data-aos-once="true" href="/projects.html">Projects</a></li>
<li class="nav-item"><a class="nav-link" data-aos="fade" data-aos-once="true" href="/contact.html">Contact</a></li>
</ul>
</div>
</div>
</nav><!-- End: Navigation Bar --><!-- Start: Page Title -->
<div class="container d-flex justify-content-center hero">
<h1 class="text-center page-title typing-anim-27" data-aos="fade" data-aos-delay="50" data-aos-once="true">Software & Game Development</h1>
</div><!-- End: Page Title -->
</header><!-- End: Header --><!-- Start: Recent Projects -->
<section class="justify-content-center" style="padding-top: 50px;backdrop-filter: blur(50px);-webkit-backdrop-filter: blur(50px);background: linear-gradient(rgba(25, 25, 25, 0.85), rgba(25, 25, 25, 0.5) 10%);"><!-- Start: Project Cards -->
<section class="d-flex flex-row flex-grow-0 flex-fill justify-content-center align-items-center flex-wrap align-items-lg-center m-auto">
<div class="row gx-5 row-cols-1 row-cols-md-2 row-cols-lg-3 row-cols-xl-4 justify-content-center align-items-center" style="margin: 0px;">
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="1575" height="877" src="assets/img/software_dev/krismas_takeover.png">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">Krimas Takeover</h4>
<p class="card-text" style="color: black;">A 2D action-packed roguelike where players help Santa save his workshop from Krampus while figuring out Santa's wacky gifts.</p><a class="btn btn-outline-dark border-2" role="button" href="https://doubtrabbit.itch.io/krismas-takeover" style="font-weight: bold;" rel="external">itch.io Download</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="5184" height="3456" src="assets/img/photography/others/IMG_5376.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">Encryptext</h4>
<p class="card-text" style="color: black;">A small text editor that elevates your editing experience with large features.</p><a class="btn btn-outline-dark border-2" role="button" href="https://encryptext.sooraj.dev" style="font-weight: bold;">Learn More</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="1690" height="1360" src="assets/img/software_dev/boids.png">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">Algorithm Playgrounds</h4>
<p class="card-text" style="color: black;">A website to play around with different algorithms and see them in action.</p><a class="btn btn-outline-dark border-2" role="button" href="algorithm_playgrounds.html" style="font-weight: bold;">Visit</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="2360" height="1640" src="assets/img/software_dev/fish_n_chimps.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">Fish 'n Chimps</h4>
<p class="card-text" style="color: black;">An action-packed aquatic adventure where players control a monkey navigating through dangerous waters.</p><a class="btn btn-outline-dark border-2" role="button" href="https://banana-byte-entertainment.itch.io/fish-n-chimps" rel="external" style="font-weight: bold;">itch.io Download</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="512" height="512" src="assets/img/software_dev/fastcalc_app_icon.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">FastCalc</h4>
<p class="card-text" style="color: black;">A small, simple, and light calculator app. Now available on the Google Play Store.</p><a class="btn btn-outline-dark border-2" role="button" href="https://play.google.com/store/apps/details?id=com.soorajdev.fast_calc" rel="external" style="font-weight: bold;">Google Play Store Download</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="960" height="540" src="assets/img/vfx/stylised/IMG_8552.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">LED Light Wall</h4>
<p class="card-text" style="color: black;">A passion project, made independently, and exclusively by two high school students.</p><a class="btn btn-outline-dark border-2" role="button" href="https://whenlifehandsyoulemons.github.io/LED-Light-Wall/" style="font-weight: bold;">Learn More</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="160" height="160" src="assets/img/software_dev/male_cook_emoji.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">Chef Chat</h4>
<p class="card-text" style="color: black;">An AI-powered personal chef right in your browser. Make, adjust, save, and download custom recipes.</p><a class="btn btn-outline-dark border-2" role="button" href="https://ai-personal-chef.streamlit.app/" rel="external" style="font-weight: bold;">Visit</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="1617" height="906" src="assets/img/software_dev/mctdsisvi_game.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">My City Turned Dystopian</h4>
<p class="card-text" style="color: black;">An action-adventure game that combines skateboarding with urban exploration and creative expression.</p><a class="btn btn-outline-dark border-2" role="button" href="https://banana-byte-entertainment.itch.io/my-city-turned-dystopian-so-i-started-vandalising-it" rel="external" style="font-weight: bold;">itch.io Download</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" alt="a close up of a clock with different colored numbers" width="400" height="300" src="assets/img/software_dev/stock_tracker_unsplash.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">Stock Tracker</h4>
<p class="card-text" style="color: black;">A powerful, yet simple, app that helps track your stocks and shows you stock price history for your tracked stocks.</p><a class="btn btn-outline-dark border-2" role="button" href="https://github.com/WhenLifeHandsYouLemons/Stock-Tracker" style="font-weight: bold;" rel="external">Download</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-contain card-img-top w-100 d-block rounded-3 border-0" width="450" height="450" src="assets/img/software_dev/webprarie_logo.png">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">WebPrarie</h4>
<p class="card-text" style="color: black;">An extension designed to change PrarieLearn's progress bars to match WeBWorK more closely, and improve the UI to be more readable.</p><a class="btn btn-outline-dark border-2" role="button" href="https://github.com/WhenLifeHandsYouLemons/WebPrarie" rel="external" style="font-weight: bold;">Learn More</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-contain card-img-top w-100 d-block rounded-3 border-0" width="1024" height="1024" src="assets/img/software_dev/project_arch.png">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">Project Arch</h4>
<p class="card-text" style="color: black;">This is our solution for the discontent towards the current education system. Students can freely choose what they want to learn from a wide range of project- and practical-based tutorials.</p><a class="btn btn-outline-dark border-2" role="button" href="https://whenlifehandsyoulemons.github.io/Project-Arch/" style="font-weight: bold;">Visit</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="2104" height="984" src="assets/img/software_dev/sprig_pcb_wiring_diagram.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">sprig-essentials</h4>
<p class="card-text" style="color: black;">A useful PyPI package to simplify the process of creating games and apps with Sprig.</p><a class="btn btn-outline-dark border-2" role="button" href="https://github.com/WhenLifeHandsYouLemons/sprig-essentials" rel="external" style="font-weight: bold;">Learn More</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" width="488" height="465" src="assets/img/software_dev/chronocube_logo.png">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">ChronoCube</h4>
<p class="card-text" style="color: black;">A Rubik's Cube timer that gives you all the information you'll ever need. Right at your fingertips.</p><a class="btn btn-outline-dark border-2" role="button" href="https://chronocube.sooraj.dev" style="font-weight: bold;">Learn More</a>
</div>
</div>
</div>
<div class="col rounded-5 border-0 align-self-stretch" style="padding: 25px;">
<div class="card rounded-5 border-0 h-100" style="padding: 25px;background: rgba(255, 255, 255, 0.4);"><img class="img-fluid aspect-ratio-4x3 object-fit-cover card-img-top w-100 d-block rounded-3 border-0" alt="a blackboard with a bunch of diagrams on it" width="400" height="267" src="assets/img/software_dev/extramaths.jpg">
<div class="card-body p-4" style="padding: 0px !important;padding-top: 20px !important;">
<h4 class="card-title" style="color: black;">extramaths</h4>
<p class="card-text" style="color: black;">A PyPI package that simplifies the calculations for complex equations and formulas.</p><a class="btn btn-outline-dark border-2" role="button" href="https://github.com/WhenLifeHandsYouLemons/extramaths" rel="external" style="font-weight: bold;">Learn More</a>
</div>
</div>
</div>
</div>
</section><!-- End: Project Cards -->
</section><!-- End: Recent Projects --><!-- Start: Footer -->
<footer class="footer-basic" style="background: rgba(255, 255, 255, 0.75);backdrop-filter: blur(50px);-webkit-backdrop-filter: blur(50px);">
<h1 class="text-center" id="footer">sooraj.dev</h1><!-- Start: Links -->
<ul class="list-inline">
<li class="list-inline-item"><a href="/index.html">Home</a></li>
<li class="list-inline-item"><a href="/projects.html">Projects</a></li>
<li class="list-inline-item"><a href="/contact.html">Contact</a></li>
</ul><!-- End: Links -->
</footer><!-- End: Footer -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/js/./embed/animation/aos.min.js"></script>
<script src="assets/js/bs-init.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.11.1/baguetteBox.min.js" integrity="sha512-7KzSt4AJ9bLchXCRllnyYUDjfhO2IFEWSa+a5/3kPGQbr+swRTorHQfyADAhSlVHCs1bpFdB1447ZRzFyiiXsg==" crossorigin="anonymous"></script>
<script src="assets/js/background_randomiser.js"></script>
<script src="assets/js/vendor/typed.js/typed.min.js"></script>
</body>
</html>