Welcome to my personal portfolio website! This site showcases my academic journey, research work, and professional experience in the field of cryptography and information security.
I am a PhD Student in the Department of Computer Science and Automation at the Indian Institute of Science (IISc), Bangalore, working under the supervision of Prof. Arpita Patra in the Cryptography and Information Security (CrIS) lab.
My research focuses on:
- Multi-Party Computation (MPC)
- Zero Knowledge Proof (ZKP)
- Fully Homomorphic Encryption (FHE)
- Security and Privacy-preserving Technologies
- Responsive Design: Fully optimized for all devices and screen resolutions
- Modern UI/UX: Clean, professional design with smooth animations and hover effects
- Interactive Navigation: Smooth scrolling with mobile-friendly hamburger menu
- Academic Portfolio: Comprehensive sections covering education, experience, and research
- Contact Integration: Multiple ways to connect and download CV
- SEO Optimized: Complete meta tags for social media sharing
- Accessibility: Proper ARIA labels and semantic HTML structure
- Frontend: HTML5, CSS3, JavaScript (Vanilla)
- Typography: Inter font family (Google Fonts)
- Icons: Font Awesome 6.0
- Hosting: GitHub Pages
- Version Control: Git & GitHub
- Features: CSS Grid, Flexbox, CSS Custom Properties, Responsive Design
pabitramandal.github.io/
├── index.html # Main HTML file with all sections
├── styles.css # Comprehensive CSS with responsive design
├── script.js # JavaScript for interactions and animations
├── favicon.svg # Custom SVG favicon
├── PM.jpg # Profile photo
├── PABITRA_CV.pdf # Latest CV (downloadable)
└── README.md # Project documentation
- Responsive navigation bar with profile picture
- Smooth scrolling to sections
- Mobile hamburger menu with animations
- Active section highlighting
- Sticky navigation with transparency effects
- Hero Section: Professional introduction with profile photo and action buttons
- Experience: Research internship and professional background
- Education: Complete academic timeline with degrees and institutions
- Research Interests: Focus areas with detailed descriptions
- Publications: Research publications (updated as work progresses)
- Contact: Multiple contact methods and interactive form
- Footer: Organized three-column layout with social links and updates
- Scroll-to-top button: Smooth return to top functionality with responsive positioning
- Circular buttons: Modern button design with uniform sizing and hover effects
- Gradient backgrounds: Professional visual depth with consistent color schemes
- Form handling: Contact form with validation and autofill styling consistency
- SEO optimization: Complete Open Graph and Twitter meta tags
- Favicon integration: Custom SVG favicon for branding
- Responsive Grid Layout: CSS Grid with clamp() functions for optimal scaling
- Mobile-First Navigation: Hamburger menu with proper vertical alignment
- Social Media Integration: Comprehensive social links with platform-specific styling
- 7 breakpoints: Optimized for all screen sizes (320px to 1200px+)
- Mobile-first approach: Progressive enhancement for larger screens
- Touch-friendly: Appropriate sizing for mobile interactions
- Cross-device compatibility: Consistent experience across all devices
- A modern web browser
- Basic knowledge of HTML, CSS, and JavaScript (for modifications)
-
Clone the repository
git clone https://github.com/pabitramandal/pabitramandal.github.io.git cd pabitramandal.github.io -
Open locally
- Simply open
index.htmlin your web browser - Or use a local server like Live Server in VS Code
- Simply open
-
Make changes
- Edit
index.htmlfor content changes - Modify
styles.cssfor styling updates - Update
script.jsfor functionality changes
- Edit
-
Deploy
- Push changes to the
mainbranch - GitHub Pages will automatically deploy your changes
- Push changes to the
The website is tested and compatible with:
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
- Mobile browsers (iOS Safari, Chrome Mobile)
The website uses a cohesive design system with:
- Orange gradient theme: Consistent branding throughout
- Inter font family: Professional typography
- CSS custom properties: Easy theme customization
- 25px border-radius: Circular button design
- Backdrop blur effects: Modern glass-morphism elements
Update your information in index.html:
- Personal details and professional title
- Research interests and descriptions
- Education timeline and institutions
- Experience and internships
- Contact information and social links
- CV file and download links
Customize the appearance in styles.css:
- Color scheme and gradients
- Typography and font weights
- Layout spacing and grid systems
- Animation timing and effects
- Responsive breakpoints
- Optimized assets: Compressed images and efficient CSS
- CDN integration: Fast loading of external fonts and icons
- Semantic HTML: Proper structure for accessibility and SEO
- Modern CSS: Flexbox and Grid for efficient layouts
- Email: pabitram@iisc.ac.in
- LinkedIn: linkedin.com/in/mpabitra
- GitHub: github.com/pabitramandal
- Institution: Indian Institute of Science (IISc), Bangalore
- Department: Computer Science and Automation
- Lab: Cryptography and Information Security (CrIS)
- ✅ Navbar Optimization: Right-aligned menu items with responsive behavior
- ✅ Header/Footer Height Reduction: Optimized vertical spacing for better content density
- ✅ Footer Layout Enhancement: Three-column grid with left-aligned updates, centered copyright, right-aligned social links
- ✅ Scroll-to-top Button: Positioned above footer area with responsive sizing across all devices
- ✅ Mobile Navigation Fix: Resolved vertical alignment issues with proper content fitting
- ✅ Autofill Styling: Consistent form field appearance between normal and autofilled states
- ✅ Social Media Integration: Added Facebook and Instagram links with hover effects
- ✅ Button Uniformity: Standardized button sizing and alignment throughout the site
- ✅ Responsive Design: Comprehensive clamp() functions for viewport-based scaling
- ✅ Cross-device Testing: Verified functionality across desktop, tablet, and mobile devices
While this is a personal portfolio, suggestions and improvements are welcome! Feel free to:
- Fork the repository
- Create a feature branch
- Make your changes
- Submit a pull request
- Performance: Optimized loading times with efficient CSS and JavaScript
- Accessibility: WCAG compliant with proper semantic markup
- SEO Score: Enhanced with comprehensive meta tags and structured data
- Mobile Score: Fully responsive with touch-friendly interactions
Last updated: July 26, 2025 | Version: 2.0 | Status: Live at pabitramandal.github.io