Compare commits

...

5 Commits

Author SHA1 Message Date
6a864ef8ec feat: big page performance optimizations 2025-07-26 14:55:06 +02:00
1f265df89c fix: invalid path still 2025-07-26 14:06:48 +02:00
13b5516e72 fix: tags path fix 2025-07-26 14:04:24 +02:00
82f70bdc43 fix: minor title and meta changes 2025-07-26 13:58:50 +02:00
1cad16ee38 feat: SEO 2025-07-26 13:45:45 +02:00
8 changed files with 77 additions and 46 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 264 KiB

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

Before

Width:  |  Height:  |  Size: 144 KiB

After

Width:  |  Height:  |  Size: 12 KiB

View File

@@ -3,45 +3,66 @@
<head>
<meta charset="utf-8" />
<link rel="icon" href="./assets/favicon.ico" />
<link rel="icon" href="/assets/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#8aadf4" />
<meta name="description"
content="Michał Czyż is a student and a software developer." />
content="Welcome to the official website of Michał Czyż, a student and a software developer. Explore projects, skills, and contact details." />
<meta name="author" content="Michał Czyż" />
<meta name="copyright" content="Michał Czyż, 2024 All Rights Reserved" />
<meta name="copyright" content="Michał Czyż, 2025 All Rights Reserved" />
<meta name="keywords" lang="en"
content="Michał Czyż, Michael Czyż, Mike Czyż, tsi, developer, crypto, web, angular, react, javascript" />
<meta name="date" content="" />
<meta name="page-topic" content="" />
content="Michał Czyż, Michael Czyż, Mike Czyż, ai, llm, python, developer, crypto, web, angular, react, javascript" />
<meta name="language" content="en" />
<meta name="robots" content="index, follow" />
<meta name="date" content="2025-07-26" />
<meta name="page-topic" content="Personal Website, Software Developer, Michał Czyż, Mike Czyż" />
<!--Facebook Open Graph-->
<meta property="og:url" content="https://c2yz.com" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Michał Czyż" />
<meta property="og:title" content="Michał Czyż - Software Developer" />
<meta property="og:site_name" content="Michał Czyż" />
<meta property="og:locale" content="en_US" />
<meta property="og:description"
content="Michał Czyż is a student and a software developer." />
<meta property="og:image" content="./assets/card.png" />
content="Michał Czyż is a student and software developer. Explore projects, skills, and contact details." />
<meta property="og:image" content="/assets/card.png" />
<!--Twitter card metadata-->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@Mike_Czyz_" />
<meta name="twitter:creator" content="@Mike_Czyz_" />
<meta name="twitter:title" content="Michał Czyż" />
<meta name="twitter:title" content="Michał Czyż - Software Developer" />
<meta name="twitter:description"
content="Michał Czyż is a student and a software developer." />
<meta name="twitter:image" content="./assets/card.png">
content="Michał Czyż is a student and software developer. Explore projects, skills, and contact details." />
<meta name="twitter:image" content="/assets/card.png">
<link rel="apple-touch-icon" href="./assets/logo192.png" />
<link rel="apple-touch-icon" href="/assets/logo192.png" />
<link rel="manifest" href="/manifest.json" />
<link rel="stylesheet" href="/styles.css" />
<link rel="manifest" href="manifest.json" />
<link rel="stylesheet" href="styles.css" />
<script src="/main.js" defer></script>
<script src="main.js" defer></script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Person",
"name": "Michał Czyż",
"alternateName": "Mike",
"url": "https://c2yz.com/",
"jobTitle": "Software Developer, Student",
"alumniOf": {
"@type": "CollegeOrUniversity",
"name": "Silesian University of Technology"
},
"sameAs": [
"https://github.com/eRgo35",
"https://www.linkedin.com/in/mike-czyz",
"https://www.youtube.com/@eRgo35"
]
}
</script>
<title>Michał Czyż</title>
<title>Michał Czyż - Student, Software Developer | Official Website</title>
</head>
<body>
@@ -83,7 +104,7 @@
<div class="world">
<!-- <p>Also, checkout <a href="https://scientia.c2yz.com">this site</a>. You might find it interesting. 👀</p> -->
<span>[📎 <a href="assets/Michał_Czyż_CV.pdf"">cv</a>]</span>
<span>[📎 <a href="/assets/Michał_Czyż_CV.pdf"">cv</a>]</span>
<span>[📧 <a href=" mailto:mike@c2yz.com?subject=Hi">contact</a>]</span>
<!-- <p>[📧 <a href=" mailto:mike@c2yz.com?subject=Hi">contact</a>]</p> -->
@@ -92,9 +113,9 @@
<div class="aside">
<div class="avatar-wrapper">
<img src="assets/mike-czyz.webp" class="avatar" width="2.5in" height="2.5in" />
<div class="theme">
<i class="material-icons">&#xe51c</i>
<img src="/assets/mike-czyz.webp" class="avatar" alt="Michał Czyż" class="avatar" width="2.5in" height="2.5in" />
<div class="theme" aria-label="Toggle dark/light mode" role="button" tabindex="0">
<i class="material-icons">🌙</i>
<span class="theme-text">Dark Mode</span>
</div>
</div>
@@ -102,10 +123,10 @@
<div class="footer">
<div class="copyright">
&copy; <span id="year">2024</span>
&copy; <span id="year">2025</span>
</div>
<div class="gpg">
<a href="assets/mike-czyz-public.gpg" target="_blank" class="gpg-key">
<a href="/assets/mike-czyz-public.gpg" target="_blank" class="gpg-key">
🔑
<span>GPG</span>
</a>

36
main.js
View File

@@ -1,39 +1,41 @@
const root = document.documentElement;
const themeText = document.querySelector('.theme-text');
const themeIcon = document.querySelector('.material-icons');
const themeText = document.querySelector(".theme-text");
const themeIcon = document.querySelector(".material-icons");
const isDarkMode = () => root.classList.contains('dark');
const isDarkMode = () => root.classList.contains("dark");
const setDarkMode = () => {
root.classList.add('dark');
themeText.textContent = 'Dark Mode';
themeIcon.innerHTML = '&#xe51c';
root.classList.add("dark");
themeText.textContent = "Dark Mode";
themeIcon.innerHTML = "🌙";
};
const setLightMode = () => {
root.classList.remove('dark');
themeText.textContent = 'Light Mode';
themeIcon.innerHTML = '&#xe518';
root.classList.remove("dark");
themeText.textContent = "Light Mode";
themeIcon.innerHTML = "☀️";
};
const toggleTheme = () => {
if (isDarkMode()) {
setLightMode();
localStorage.setItem('preferredTheme', 'light');
localStorage.setItem("preferredTheme", "light");
} else {
setDarkMode();
localStorage.setItem('preferredTheme', 'dark');
localStorage.setItem("preferredTheme", "dark");
}
};
const checkPreferredTheme = () => {
const preferredTheme = localStorage.getItem('preferredTheme');
if (preferredTheme === 'dark') {
const preferredTheme = localStorage.getItem("preferredTheme");
if (preferredTheme === "dark") {
setDarkMode();
} else if (preferredTheme === 'light') {
} else if (preferredTheme === "light") {
setLightMode();
} else {
const prefersDarkScheme = window.matchMedia("(prefers-color-scheme: dark)").matches;
const prefersDarkScheme = window.matchMedia(
"(prefers-color-scheme: dark)"
).matches;
if (prefersDarkScheme) {
setDarkMode();
} else {
@@ -46,5 +48,5 @@ document.querySelector("#year").innerHTML = new Date().getFullYear();
checkPreferredTheme();
const themeButton = document.querySelector('.theme');
themeButton.addEventListener('click', toggleTheme);
const themeButton = document.querySelector(".theme");
themeButton.addEventListener("click", toggleTheme);

View File

@@ -1,6 +1,7 @@
{
"short_name": "Mike Czyż",
"name": "Michał Czyż's Website",
"description": "Michał Czyż - software developer, student, and creator.",
"icons": [
{
"src": "assets/favicon.ico",

View File

@@ -1,6 +1,12 @@
@import url("https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:ital,wght@0,400;0,500;1,400&display=swap");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
@import url('https://fonts.googleapis.com/css2?family=Coiny&display=swap');
/* Coiny Regular */
@font-face {
font-family: 'Coiny';
src: url('/assets/fonts/Coiny-Regular-subset.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
* {
transition: background-color 0.15s ease-in-out;
@@ -75,11 +81,11 @@ body {
width: 100%;
min-height: 100vh;
/* height: 100vh; */
font-family: system-ui, sans-serif;
background-color: var(--base);
color: var(--text);
display: grid;
place-items: center;
font-family: "Schibsted Grotesk", sans-serif;
overflow: auto;
overflow-anchor: none;
}
@@ -112,7 +118,7 @@ body {
}
a {
color: var(--pine);
color: var(--foam);
transition:
0.1s color ease-in-out,
0.1s text-decoration ease-in-out;
@@ -264,7 +270,8 @@ a:focus {
}
.material-icons {
font-family: "Material Icons";
font-size: 1.25em;
font-style: normal;
}
.theme-text {