Welcome to the New Design

I recently updated this portfolio to reflect a modern, engineering-focused aesthetic. The goal was to move away from standard templates and create something that feels like a developer tool—clean, dark, and precise.

1. Interactive Code Blocks

One of the biggest improvements is the code highlighting. We now use a “VS Code” style window with a working copy button.

Here is an example of a Python script for system monitoring:

import psutil
import time

def monitor_cpu(threshold=80):
    """
    Monitors CPU usage and alerts if it exceeds the threshold.
    """
    print("Starting System Monitor...")
    
    while True:
        cpu_usage = psutil.cpu_percent(interval=1)
        
        if cpu_usage > threshold:
            print(f"[ALERT] High CPU Usage detected: {cpu_usage}%")
        else:
            print(f"[OK] Current CPU: {cpu_usage}%")

if __name__ == "__main__":
    monitor_cpu()
  1. Infrastructure as Code

The site also handles YAML beautifully for Ansible playbooks. Notice how the syntax highlighting makes the configuration easy to read.

---
- name: Update Web Servers
  hosts: webservers
  become: yes

  tasks:
    - name: Ensure Nginx is at the latest version
      apt:
        name: nginx
        state: latest

    - name: Copy index.html
      copy:
        src: /local/site/index.html
        dest: /var/www/html/index.html
        mode: '0644'
      notify: Restart Nginx

  handlers:
    - name: Restart Nginx
      service:
        name: nginx
        state: restarted
  1. Dynamic Tech Badges

If you look at the top of this post (or the card on the homepage), you will see colorful badges. These aren’t just images—they are CSS-styled text elements that automatically assign colors based on the technology:

Ansible gets Red.

Python gets Blue.

DevOps gets a Blue/Cyan Gradient.

This redesign allows me to share knowledge in a format that is easy for other engineers to consume.

Key Fixes Made:

  1. Closed the Python Block: Added ``` after monitor_cpu().
  2. Fixed the YAML Block: Changed the plain text “YAML” to a proper code fence start ```yaml and added the closing ``` at the end.