🚀 Paweł Trojański's Portfolio

Live Demo: envigit.github.io

⚡ Overview

Personal portfolio built from scratch — no frameworks, no jQuery, no bloat. A performance-first Vanilla JS application with a cyber aesthetic, interactive terminal, and polished UI details that most portfolios skip.

🛠 Tech Stack

• Core: HTML5, CSS3, Vanilla JavaScript (ES6+)
• Icons: Inline SVG sprite
• Tools: Git, Zed
• Philosophy: Zero dependencies. Every interaction hand-crafted.

🌟 Key Features

🖥️ Interactive Terminal

A simulated terminal with a real command parser and virtual file system. Not a gimmick — it actually works.

• Navigate directories, read files, switch themes, change accent colors
• Persistent accent color with per-theme preset resolution
• Drag to reposition, command history with arrow navigation

🎨 UI/UX & Animations

• 3D Project Slider: Scroll-driven on desktop, swipe-driven on mobile with gesture intent detection
• Text Scramble Effect: Cyberpunk-style character decoding on load
• Context-Aware Cursor: Reacts to hover states, blend modes, element types
• Direction-Aware Buttons: Hover fills that track mouse entry/exit angle
• Light/Dark Mode: CSS variable-based theming with LocalStorage persistence

⚡ Performance & Optimization

• Zero Dependencies: Pure Vanilla JS — no jQuery, no animation libraries, minimal footprint.
• Intersection Observer: Lazy-loaded animations, timeline progress tracking, and on-scroll triggers to keep the main thread lightweight.
• Frame-Budgeted Animations: Smooth interaction and 3D slider logic using requestAnimationFrame, minimizing layout thrashing.
• Resource Preloading: Strategic use of rel="preload" for critical assets (fonts, main CSS) to prevent FOIT/FOUT.
• Eco-Friendly Logic: Automatic animation pausing via VisibilityChange API when the tab is inactive to preserve CPU and battery.
• Optimized Asset Pipeline: WebP format for all imagery and inlined SVG sprites for instant icon rendering.
• Passive Event Listeners: Optimized scroll handling using { passive: true } to maximize scroll performance and responsiveness.

📂 Project Structure

The project utilizes a clean structure within the assets directory, organizing styles into modular components and sections for better maintainability.

/
├── assets/
│   ├── css/
│   │   ├── base/
│   │   │   ├── reset.min.css
│   │   │   ├── utils.min.css
│   │   │   └── variables.min.css
│   │   ├── components/
│   │   │   ├── buttons.min.css
│   │   │   ├── cursor.min.css
│   │   │   ├── navigation.min.css 
│   │   │   ├── scrollbar.min.css
│   │   │   ├── stats.min.css
│   │   │   ├── terminal.min.css
│   │   │   └── timeline.min.css
│   │   ├── sections/
│   │   │   ├── about.min.css
│   │   │   ├── contact.min.css
│   │   │   ├── footer.min.css
│   │   │   ├── home.min.css
│   │   │   └── projects.min.css
│   │   ├── main.min.css
│   ├── files/
│   │   └── cv.pdf
│   ├── fonts/
│   │   ├── JetBrainsMono-Bold.woff2
│   │   ├── Montserrat-Bold.woff2
│   │   ├── Montserrat-Italic.woff2
│   │   ├── Montserrat-Light.woff2
│   │   ├── Montserrat-Medium.woff2
│   │   ├── Montserrat-Regular.woff2
│   │   └── Montserrat-SemiBold.woff2
│   ├── img/
│   │   ├── me-large.webp
│   │   ├── me-medium.webp
│   │   ├── me-small.webp
│   │   ├── operationDeratization.webp
│   │   ├── pomodoroTimer.webp
│   │   ├── psCatch.webp
│   │   ├── vibrantIcons.webp
│   │   ├── weatherProphet.webp
│   │   └── wingetPortable.webp
│   └── js/
│       ├── main.min.js
│       ├── navigation.min.js
│       ├── slider.min.js
│       ├── terminal.min.js
│       ├── ui-effects.min.js
│       └── utils.min.js
├── .gitignore
├── 404.html
├── index.html
├── LICENSE.md
└── README.md

📬 Contact

If you have any questions or feedback, feel free to reach out:

• Email: paweltrojanski@gmail.com
• LinkedIn: Paweł Trojański

📄 License & Copyright

Dual license model — code is open, identity is not.

💻 Source Code — MIT

The HTML, CSS, and JS logic are open source. Use the structure, patterns, and techniques freely.

🎨 Design & Content — CC BY-NC-ND 4.0

Personal photos, visual design, resume, and autobiographical content are protected.

• ✅ View, learn, fork for educational purposes
• ❌ Don't clone as your own portfolio, use my assets, or sell the design

---

© 2023-2026 Paweł Trojański. Built with coffee and code.