Stefan Rautner – Personal Portfolio

A modern, highly performant, and responsive personal portfolio website showcasing projects, skills, certificates, and voluntary experiences. Built with a futuristic, dark-themed aesthetic featuring smooth scroll animations, dynamic particle backgrounds, and full internationalization (i18n) support.

🚀 Features

• Dynamic Localization: Multi-language support (English and German) with on-the-fly language switching without reloading.
• Modern UI/UX: Clean cyber-inspired dark theme with dynamic cursor-glow tracking and custom interactive elements.
• Animated Elements: Canvas-based particle backgrounds and custom interaction/reveal animations on scroll.
• Live GitHub Integration: Stat cards tracking repositories, language distribution, and contributions — rebuilt nightly by a GitHub Action, so the visitor's browser never contacts an external service.
• Fully Responsive: Optimized across a multitude of breakpoints from large desktop monitors down to mobile devices.

📁 Project Structure

• index.html — Main structural markup optimized with semantic elements.
• style.css — Custom CSS featuring advanced flex/grid layouts, tokenized color variables, and fine-tuned responsive media queries.
• script.js — Client-side interaction logic handling the canvas, scroll intersection observers, theme variables, and localization logic.
• en.json / de.json — Localization language dictionary assets.
• fonts/ — Self-hosted WOFF2 webfonts plus their OFL licence texts.
• stats/ — Pre-built GitHub stat cards (SVG), regenerated by tools/generate-stats.py.
• tools/generate-stats.py — Build-time script that refreshes the stat cards.
• tools/generate-og-image.py — Rebuilds og-image.png, the 1200x630 social preview.
• 404.html, robots.txt, sitemap.xml — Error page and crawler hints.
• impressum.html / datenschutz.html — Legal pages (Austrian MedienG / GDPR).

🛠️ Built With

• HTML5 & CSS3 (Custom Properties, Grid & Flexbox)
• Vanilla JavaScript (ES6+, Intersection Observer API, HTML5 Canvas)
• Self-hosted assets: No third-party requests at runtime. Fonts (Space Grotesk, JetBrains Mono, both OFL-1.1) are served from fonts/, and the GitHub stat cards are pre-built SVGs in stats/.

💻 Getting Started

1. Clone the repository:

   git clone https://github.com/StefanRautner/stefanrautner.github.io.git

2. Open the project: Simply open the index.html file in any modern web browser, or serve it using a local server extension (like Live Server in VS Code) for the best development experience.

3. Refresh the GitHub stat cards (optional):

   python tools/generate-stats.py

   Runs automatically every night via .github/workflows/refresh-stats.yml.

⚖️ Copyright

© 2026 Stefan Rautner. All rights reserved.

The source code, design, text and images of this portfolio are not licensed for reuse. The bundled webfonts are the exception: Space Grotesk and JetBrains Mono are licensed under the SIL Open Font License 1.1, and their licence texts ship alongside them in fonts/.