diff options
| author | philw <contact@philw.dev> | 2025-08-18 17:36:57 +0200 |
|---|---|---|
| committer | philw <contact@philw.dev> | 2025-08-18 17:36:57 +0200 |
| commit | 335ce2c66508e90d61fa468e8b12b3289f715a3e (patch) | |
| tree | c3fb87df0a553f2055fd7fb2de2e4c4c990401c2 | |
| download | philw.dev-335ce2c66508e90d61fa468e8b12b3289f715a3e.tar.gz philw.dev-335ce2c66508e90d61fa468e8b12b3289f715a3e.zip | |
Initialize the repository
Signed-off-by: philw <contact@philw.dev>
| -rw-r--r-- | .gitignore | 4 | ||||
| -rw-r--r-- | index.css | 138 | ||||
| -rw-r--r-- | index.html | 95 | ||||
| -rwxr-xr-x | public/favicon.ico | bin | 0 -> 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/ | ||
| 2 | package | ||
| 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 | |||
