aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--.gitignore4
-rw-r--r--index.css138
-rw-r--r--index.html95
-rwxr-xr-xpublic/favicon.icobin0 -> 1979 bytes
4 files changed, 237 insertions, 0 deletions
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..cdc376c
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,4 @@
1.svelte-kit/
2package
3.env
4.env.production
diff --git a/index.css b/index.css
new file mode 100644
index 0000000..256e2fc
--- /dev/null
+++ b/index.css
@@ -0,0 +1,138 @@
1 * {
2 box-sizing: border-box;
3 }
4
5 body {
6 margin: 0;
7 background: #fcfdfe; /* base07 - light background */
8 color: #000c18; /* base00 - dark text */
9 line-height: 1.75;
10 font-size: 1rem;
11 display: flex;
12 flex-direction: column;
13 min-height: 100vh;
14 overflow-x: hidden;
15 font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
16 Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
17 }
18
19 header, footer {
20 padding: 2em;
21 text-align: center;
22 }
23
24 main {
25 flex-grow: 1;
26 padding: 2em;
27 width: 100%;
28 box-sizing: border-box;
29 max-width: 900px;
30 margin: 0 auto;
31 }
32
33 footer {
34 border-top: 1px solid #000c18; /* base00 */
35 color: #000c18; /* base00 */
36 }
37
38 h1, h2 {
39 font-weight: normal;
40 margin: 0;
41 font-size: 2.25rem;
42 color: inherit; /* inherit from body */
43 }
44
45 section {
46 margin-bottom: 3em;
47 color: inherit; /* inherit from body */
48 width: 100%;
49 padding: 0 2%;
50 }
51
52 a {
53 color: #22aa44; /* base0B - green */
54 text-decoration: underline;
55 font-weight: 700;
56 transition: color 0.3s ease, text-decoration-color 0.3s ease;
57 text-underline-offset: 3px;
58 text-decoration-thickness: 2px;
59 text-decoration-color: transparent;
60 }
61
62 a:hover,
63 a:focus {
64 color: #9966b8; /* base08 - purple */
65 text-decoration-color: currentColor;
66 outline-offset: 3px;
67 outline: 2px solid #22aa44;
68 outline-radius: 3px;
69 }
70
71 a:focus-visible {
72 outline-offset: 4px;
73 outline: 3px solid #22aa44; /* base0B */
74 outline-radius: 3px;
75 }
76
77 .links a {
78 color: #22aa44; /* base0B */
79 }
80
81 .links a:hover {
82 color: #e6550d; /* base09 */
83 }
84
85 @media (max-width: 768px) {
86 h1 {
87 font-size: 1.8rem;
88 }
89
90 h2 {
91 font-size: 1.6rem;
92 }
93
94 footer {
95 font-size: 0.9em;
96 }
97
98 .privacy {
99 font-size: 0.8em;
100 }
101
102 main {
103 padding: 1.5em;
104 }
105 }
106
107 @media (prefers-color-scheme: dark) {
108 body {
109 background: #000c18; /* base00 */
110 color: #b7b8b9; /* base05 */
111 }
112
113 footer {
114 border-color: #fcfdfe; /* base07 */
115 color: #fcfdfe; /* base07 */
116 }
117
118 a {
119 color: #22aa44; /* keep green links in dark mode */
120 text-decoration-color: transparent;
121 }
122
123 a:hover,
124 a:focus {
125 color: #9966b8; /* base08 */
126 text-decoration-color: currentColor;
127 }
128 }
129
130 .high-contrast {
131 background-color: #fcfdfe; /* base07 */
132 color: #000c18; /* base00 */
133 }
134
135 .highlight {
136 background-color: #9966b8; /* base08 */
137 color: #fcfdfe; /* base07 */
138 }
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..eed0839
--- /dev/null
+++ b/index.html
@@ -0,0 +1,95 @@
1<!doctype html>
2<html lang="en">
3
4<head>
5 <meta charset="UTF-8" />
6 <meta name="viewport" content="width=device-width, initial-scale=1" />
7 <title>Filip Wandzio</title>
8 <meta name="description" content="Filip Wandzio — Software Engineer specializing in web technologies, mobile apps, and software design. Discover projects, research, presentations, and blog posts." />
9 <meta name="keywords" content="Software Engineer, Web Technologies, Mobile Apps, Presentations, Blog, Filip Wandzio" />
10 <link rel="icon" type="image/x-icon" href="./public/favicon.ico" />
11 <link rel="stylesheet" href="./index.css">
12 <link rel="canonical" href="https://philw.dev" />
13
14 <!-- Open Graph -->
15 <meta property="og:title" content="Filip Wandzio - Software Engineer" />
16 <meta property="og:description" content="Software engineer specializing in web technologies, mobile apps, and software design." />
17 <meta property="og:type" content="website" />
18 <meta property="og:url" content="https://philw.dev" />
19 <meta property="og:image" content="https://philw.dev/preview.webp" />
20
21 <!-- Twitter Card -->
22 <meta name="twitter:card" content="summary_large_image" />
23 <meta name="twitter:title" content="Filip Wandzio - Software Engineer" />
24 <meta name="twitter:description" content="Software engineer specializing in web technologies, mobile apps, and software design." />
25 <meta name="twitter:image" content="https://philw.dev/public/preview.webp" />
26
27 <meta name="theme-color" content="#22aa44" />
28
29 <!-- Structured data for upcoming event -->
30 <script type="application/ld+json">
31 {
32 "@context": "https://schema.org",
33 "@type": "Event",
34 "name": "Enter The Matrix",
35 "startDate": "2025-11-11",
36 "location": {
37 "@type": "Place",
38 "name": "MacMeeting"
39 },
40 "organizer": {
41 "@type": "Person",
42 "name": "Filip Wandzio"
43 }
44 }
45 </script>
46</head>
47<body>
48 <header aria-label="Website header">
49 <h1>Filip Wandzio</h1>
50 </header>
51 <main>
52 <section id="about" aria-labelledby="about">
53 <h2>About Me</h2>
54 <p>Software engineer focused on practical tools and solving real-world problems with minimal overhead. Currently working with web technologies, mobile applications, and software design.</p>
55 <p>In my free time, I enjoy music — both listening and producing my own pieces.</p>
56 </section>
57
58 <section id="projects" aria-labelledby="projects">
59 <h2>Projects</h2>
60 <p>Personal projects are available on <a href="https://git.philw.dev" target="_blank" rel="noopener noreferrer" aria-label="Visit Filip Wandzio's GitHub projects">GitHub</a>.</p>
61 </section>
62
63 <section id="presentations" aria-labelledby="presentations">
64 <h2>Upcoming Presentations</h2>
65 <ul>
66 <li><strong>Enter The Matrix</strong> — <em>MacMeeting</em> — 11.11.2025</li>
67 </ul>
68 </section>
69
70 <section id="research" aria-labelledby="research">
71 <h2>Research</h2>
72 <ul>
73 <li><a href="#" aria-label="Bachelor's thesis details">Bachelor's thesis</a></li>
74 <li><a href="#" aria-label="Master's thesis details">Master's thesis</a> — work in progress</li>
75 </ul>
76 </section>
77
78 <section id="blog" aria-labelledby="blog">
79 <h2>Blog</h2>
80 <ul>
81 <li><a href="#" aria-label="My approach to web technologies article">Web Technologies</a> — work in progress</li>
82 <li><a href="#" aria-label="My experience with music production article">Music production and GNU/Linux</a> — work in progress</li>
83 </ul>
84 </section>
85
86 <section id="contact" aria-labelledby="contact">
87 <h2>Contact</h2>
88 <p>Reach out via <a href="mailto:contact@philw.dev" aria-label="Email Filip Wandzio">contact@philw.dev</a>.</p>
89 </section>
90 </main>
91 <footer aria-label="Footer with privacy statement">
92 <p class="privacy">This website does not collect any data or track visitors.</p>
93 </footer>
94</body>
95</html>
diff --git a/public/favicon.ico b/public/favicon.ico
new file mode 100755
index 0000000..373846c
--- /dev/null
+++ b/public/favicon.ico
Binary files differ
generated by cgit v1.2.3 (git 2.39.1) at 2025-12-17 17:11:39 +0000