Project Overviewlink

Gridx is a personal portfolio HTML template based on the Bootstrap grid system, featuring both dark and light themes. It is suitable for freelancers, designers, or developers to showcase resumes, project works, and contact information.

Tech Stacklink

• Bootstrap 5 (grid layout & components)
• jQuery (interaction logic)
• AOS (scroll animations)
• Native CSS (custom styles & theme variables)

Project Structurelink

gridx-html/
├── index.html          # Homepage (dark theme)
├── about.html          # About Me
├── works.html          # Works List
├── work-details.html   # Work Details
├── blog.html           # Blog List
├── blog-details.html   # Blog Details
├── contact.html        # Contact Page (with form)
├── service.html        # Services
├── credentials.html    # Credentials/Resume
├── mailer.php          # Email sending backend
├── light/              # Light theme version (same structure)
└── assets/
    ├── css/
    │   ├── style.css       # Dark theme styles
    │   ├── style-light.css # Light theme styles
    │   ├── bootstrap.min.css
    │   └── aos.css
    └── js/
        ├── main.js         # Navigation & preloader logic
        ├── aos.js
        └── ajax-form.js    # Form AJAX submission

Key Files Descriptionlink

• index.html — Homepage with personal introduction, credential cards, and project preview links
• light/index.html — Light theme homepage, same structure as the main version
• assets/css/style.css — Main stylesheet defining dark background, rounded cards (shadow-box), and theme color variables
• assets/js/main.js — Top navigation toggle and preloader animation logic
• contact.html — Contact page with built-in form that submits to mailer.php
• mailer.php — PHP email sending script that receives frontend form data

Quick Startlink

Simply open index.html in your browser to preview. The light theme entry point is at light/index.html. The form functionality requires deployment to a PHP-enabled server.

Usage Suggestionslink

The template is primarily designed for single-page display, with pages linked via card layouts for easy expansion. For production use, remove or replace the demo directory's redirect pages.