update projects page

This commit is contained in:
SowinskiBraeden committed 2025-01-21 20:55:03 -08:00
1 parent bebc1ad510
commit fc81cf40a3
6 files changed
+709 -739

No files matched your search

+131 -135
View File
@@ -1,145 +1,132 @@
<!DOCTYPE html>
<html lang='en'>
<head>
<title>Braeden Sowinski</title>
<meta name='description' content="Web portfolio of Braeden Sowinski (McDazzzled)" />
<meta name='author' content="Braeden Sowinski" />
<meta name='keywords' content="Braeden Sowinski, McDazzzled" />
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<!-- Load CSS -->
<link rel="stylesheet" href="./public/css/style.css">
</head>
<body class="js-stop-transition">
<header class=header>
<nav class=nav>
<div class=logo>
<a href="/" title="McDazzzled (Alt + H)">
<img src="https://avatars.githubusercontent.com/u/48144618?v=4" alt=logo style="border-radius:50%;" aria-label=logo height=32>McDazzzled
</a>
<span class="logo-switches">
<button id=theme-toggle accesskey=t title="(Alt + T)">
<svg id="sun" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"/>
</svg>
<svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="5"/>
<line x1="12" y1="1" x2="12" y2="3"/>
<line x1="12" y1="21" x2="12" y2="23"/>
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/>
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/>
<line x1="1" y1="12" x2="3" y2="12"/>
<line x1="21" y1="12" x2="23" y2="12"/>
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/>
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/>
</svg>
</button>
</span>
</div>
<ul id="menu" class="nav__links">
<li id="home-link">
<a href="/" title="Home">
<span class="active">Home</span>
</a>
</li>
<li id="about-link">
<a href="/about" title="about">
<span class="active">About</span>
</a>
</li>
<li id="projects-link">
<a href="/projects" title="projects">
<span class="active">Projects</span>
</a>
</li>
</ul>
<p class="menu cta">Menu</p>
</nav>
<head>
<title>Braeden Sowinski</title>
<meta name='description' content="Web portfolio of Braeden Sowinski (McDazzzled)" />
<meta name='author' content="Braeden Sowinski" />
<meta name='keywords' content="Braeden Sowinski, McDazzzled" />
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<!-- Moble Nav Menu -->
<div id="mobile__menu" class="overlay">
<a class="close">&times;</a>
<div class="overlay__content">
<!-- Load CSS -->
<link rel="stylesheet" href="./public/css/style.css">
</head>
<body class="js-stop-transition">
<header class=header>
<nav class=nav>
<div class=logo>
<a href="/" title="McDazzzled (Alt + H)">
<img src="https://avatars.githubusercontent.com/u/48144618?v=4" alt=logo style="border-radius:50%;"
aria-label=logo height=32>McDazzzled
</a>
<span class="logo-switches">
<button id=theme-toggle accesskey=t title="(Alt + T)">
<svg id="sun" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z" />
</svg>
<svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="5" />
<line x1="12" y1="1" x2="12" y2="3" />
<line x1="12" y1="21" x2="12" y2="23" />
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64" />
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78" />
<line x1="1" y1="12" x2="3" y2="12" />
<line x1="21" y1="12" x2="23" y2="12" />
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36" />
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22" />
</svg>
</button>
</span>
</div>
<ul id="menu" class="nav__links">
<li id="home-link">
<a href="/" title="Home">
<span class="active">Home</span>
</a>
</li>
<li id="about-link">
<a href="/about" title="about">
<span class="active">About</span>
</a>
</li>
<li id="projects-link">
<a href="/projects" title="projects">
<span class="active">Projects</span>
</a>
</li>
</ul>
<p class="menu cta">Menu</p>
</nav>
<!-- Moble Nav Menu -->
<div id="mobile__menu" class="overlay">
<a class="close">&times;</a>
<div class="overlay__content">
<a href="/" title="Home">
<span class="active">Home</span>
</a>
<a href="/about" title="about">
<span class="active">About</span>
</a>
<a href="/projects" title="projects">
<span class="active">Projects</span>
</a>
</div>
</header>
</header>
<!-- About Body -->
<div class="about-section">
<div class="inner-container">
<h1 id="about-me">About Me</h1>
<p class="text">
Hello there,
I am Braeden Sowinski, you may also know me by my pseudonym McDazzzled. I am an avid software developer; adaptable and driven with a
strong work ethic, with the motivation to thrive in any setting, team-based or individually motivated. Aiming to set the bar high,
and leave good impressions to any employer.
<!-- About Body -->
<div class="about-section">
<div class="inner-container">
<h1 id="about-me">About Me</h1>
<p class="text">
Hello there,
I am Braeden Sowinski, you may also know me by my pseudonym McDazzzled. I am an avid software engineer, actively
pursuing a Diploma in Computer System Technologies at BCIT. I am adaptable and driven with a strong work ethic;
possessing the ability to thrive in both a team-based or individualy motivated setting.
I am ambitious to learn more in Software, IT, and System Administration, and am actively expanding my horizons. I am experienced in API
development, web applications serving hundreds of thousands of users, simple desktop applications and more. With the advanced knowledge
of Python and the Node.js framework, intermediate knowledge with GoLang, and a basic understanding of C/C++ and Java. I can bring and
expand on many skill sets you may desire. With my ability to learn quickly, and adapt to any work environment; I can be a valuable
asset to any team. I can also bring excellent IT support, with the ability to investigate and resolve computer issues within Windows
and Linux operating systems. With System Administration being a key part in my journey, I run and manage several Linux servers for
personal and or professional projects.
</p>
<div class="skills">
I am eager to expand my knowledge in Software Engineering, IT, System Administration and related fields.
Approaching more than 5 years of continuous learning and programming, I have learned many valuable languages and
frameworks such as C, Go, Node.js, and Python 3+. However, there is always more to learn and experience that I
will accomplish by quickly adapting to a new setting.
</p>
<span>
<img
style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/python-black?style=for-the-badge&logo=python"
width="24"
height="24"
>
Python
</span>
<span>
<img
style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/javascript-black?style=for-the-badge&logo=javascript"
width="24"
height="24"
>
Node.js
</span>
<span>
<img
style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/go-black?style=for-the-badge&logo=go"
width="24"
height="24"
>
Go
</span>
<span>
<img
style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/mongodb-black?style=for-the-badge&logo=mongodb"
width="24"
height="24"
>
MongoDB
</span>
<span>
<img
style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/git-black?style=for-the-badge&logo=git"
width="24"
height="24"
>
Git
</span>
</div>
<div class="skills">
<span>
<img style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/python-black?style=for-the-badge&logo=python" width="24" height="24">
Python
</span>
<span>
<img style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/javascript-black?style=for-the-badge&logo=javascript" width="24"
height="24">
Node.js
</span>
<span>
<img style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/go-black?style=for-the-badge&logo=go" width="24" height="24">
Go
</span>
<span>
<img style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/mongodb-black?style=for-the-badge&logo=mongodb" width="24" height="24">
MongoDB
</span>
<span>
<img style="transform: translate(0, 8px);"
src="https://img.shields.io/badge/git-black?style=for-the-badge&logo=git" width="24" height="24">
Git
</span>
</div>
</div>
</div>
<!-- Import Mobile.js for mobile nav menu -->
<script src="./public/scripts/mobile.js"></script>
@@ -150,22 +137,31 @@
<!-- Change Theme Scripts -->
<script type="text/javascript">
document.getElementById("theme-toggle").addEventListener("click", () => {
document.body.className.includes("dark")?(document.body.classList.remove('dark'),
localStorage.setItem("pref-theme",'light')):(document.body.classList.add('dark'),
localStorage.setItem("pref-theme",'dark')),
"dark"==sessionStorage.getItem("theme")?sessionStorage.setItem("theme","light"):sessionStorage.setItem("theme","dark");
document.body.className.includes("light") ? (
document.body.classList.remove('light'),
localStorage.setItem("pref-theme",'dark')
) : (
document.body.classList.add('light'),
localStorage.setItem("pref-theme",'light')
),
"dark" == sessionStorage.getItem("theme") ? sessionStorage.setItem("theme", "light") : sessionStorage.setItem("theme", "dark");
});
</script>
<script>
// If storage is supported set theme to dark by default
// If storage is supported set theme to light by default
if (typeof(Storage) !== "undefined") {
if (sessionStorage.getItem("theme")==null||sessionStorage.getItem("theme")==undefined) sessionStorage.setItem("theme", "dark");
if (sessionStorage.getItem("theme")=='light') {
document.body.className.includes("dark")?(document.body.classList.remove('dark'),
localStorage.setItem("pref-theme",'light')):(document.body.classList.add('dark'),
localStorage.setItem("pref-theme",'dark'));
if (sessionStorage.getItem("theme") == null || sessionStorage.getItem("theme") == undefined) sessionStorage.setItem("theme", "dark");
if (sessionStorage.getItem("theme") == 'dark') {
document.body.className.includes("dark") ? (
document.body.classList.remove('dark'),
localStorage.setItem("pref-theme",'light')
) : (
document.body.classList.add('dark'),
localStorage.setItem("pref-theme",'dark')
);
}
}
</script>
</body>
</html>
</body>
</html>