About voidR
A modern, flat-design portfolio theme built with cutting-edge technologies
voidR is a feature-rich, flat-design portfolio theme created by tesla1618. It combines clean aesthetics with powerful functionality, smooth animations, and optimal performance to create an immersive experience for showcasing your work.
The theme features a carefully crafted color palette with a dark background (#1a1a1a) and an accent blue (#4a9eff) that provides visual interest without overwhelming the content. The music player extends this with 10 additional theme options for personalization.
Beyond a simple portfolio, voidR includes an advanced music player with equalizer and visualizers, an interactive comment system with voting, engaging reaction mechanics with confetti effects, and extensive customization options. It's designed for developers, musicians, writers, and creators who want a powerful yet elegant platform to share their work.
Key Features
Advanced Music Player
Full-featured music player with 10 themes, 5 layouts, 10-band equalizer, visualizers, and extensive customization options. Supports Native Media Session API for system controls.
Interactive Comments
Reddit-style comment section with nested replies, voting system, admin highlighting, and collapsible threads. Each comment gets a unique 4-digit ID for easy referencing.
Engagement System
Article reactions with 8 emotion types and IP-based limiting. Beautiful confetti effects celebrate user interactions with animated count displays.
Modern Stack
Built with the latest Next.js 16, React 19, and cutting-edge technologies for optimal performance and developer experience.
Academic Publishing Features
BibTeX-powered citation system with autocomplete, automatic reference generation, LaTeX equation support, and publication management with DOI linking.
Enhanced Markdown Support
Write in Markdown with tables, LaTeX equations (inline & block), citations with BibTeX, syntax highlighting, and live preview for a professional writing experience.
Responsive Design
Beautiful, flat design that works seamlessly across all devices with touch-optimized controls and mobile-friendly interfaces.
Tech Stack
- Next.js 16.1.1 - React framework with Turbopack
- React 19 - Latest React with server components
- Prisma - Type-safe ORM for database
- Next-Auth - Authentication system
- Tailwind CSS 4 - Utility-first CSS framework
- Framer Motion - Animation library
- Tone.js - Web Audio API framework for equalizer
- Canvas Confetti - Celebration effects
- React Markdown - Markdown rendering with GFM, Math, Citations
- BibTeX Parse JS - Citation management and parsing
- KaTeX - LaTeX math equation rendering
- Highlight.js - Syntax highlighting for code blocks
- Lucide Icons - Icon library
How It Works
Content Management
The admin panel provides an intuitive interface to manage your profile, articles, projects, publications, awards, music, skills, experience, and education. All content can be edited through a clean, user-friendly dashboard with markdown editors, BibTeX support, and live preview.
Academic Citation System
Paste BibTeX entries into the citation panel, type [cite: key] in your markdown, and get instant autocomplete suggestions. References are automatically numbered and formatted at the end of your content. Supports DOI linking, tables, and LaTeX equations for professional academic writing.
Music Player Architecture
The music player uses Web Audio API with Tone.js for advanced audio processing. Features include a 10-band equalizer with custom presets, real-time visualizers, theme system with localStorage persistence, and Native Media Session API integration for system-level controls.
Comment System
Comments are stored with recursive relationships allowing unlimited nesting depth. The system tracks votes per user using a voterKey stored in localStorage, and admins can moderate comments through the admin panel. Each comment receives a unique 4-character alphanumeric ID for easy referencing.
Engagement Tracking
Article reactions and music likes are tracked server-side with IP-based limiting to ensure one interaction per user. The system uses canvas-confetti for celebration effects and Framer Motion for smooth animated transitions.
Dynamic Rendering
Built on Next.js 16 with React Server Components, the theme leverages server-side rendering for optimal performance and SEO. Pages are statically generated where possible and dynamically rendered when needed.
Changelog
- •Added BibTeX citation system with autocomplete for academic references
- •Implemented smart citation autocomplete (Ctrl+Shift+C) in markdown editors
- •Added automatic reference generation from BibTeX entries
- •Enhanced markdown support: tables, LaTeX equations (inline & block), and citations
- •Implemented Awards & Honors section with full CRUD and admin panel
- •Added Publications section with tags, DOI, citations count, and markdown support
- •Created public Awards listing page (/awards) and detail pages (/awards/[slug])
- •Created public Publications listing page (/publications) and detail pages (/publications/[slug])
- •Implemented citation links with smooth scrolling and highlight animations
- •Added comprehensive SEO metadata for awards and publications pages
- •Updated sitemap.xml to include awards and publications
- •Added Publications and Awards links to navbar navigation
- •Implemented theme export/import system for music player settings
- •Added 'Share' button for music player theme combos with JSON export/import
- •Created 15 'Surprise' volume control UIs with cryptic names and no hints
- •Made admin sidebar scrollable for better navigation with many menu items
- •Added toolbar buttons for tables (Ctrl+Shift+T), math, and citations
- •Integrated remark-gfm, remark-math, rehype-katex for advanced markdown
- •Fixed citation parsing to handle bold/italic text without [object Object] errors
- •Added custom scrollbar styling across the application
- •Added Reddit-style comment section with nested replies and voting system
- •Implemented 4-digit unique IDs for comments with clickable parent highlighting
- •Added confetti effects for article reactions and music likes
- •Implemented IP-based like/reaction limiting (one per IP)
- •Added advanced music player with 10 theme presets and extensive customization
- •Implemented 5 layout variants: Classic, Modern, Minimal, Immersive, and Compact
- •Added 6 album art shapes: Circle, Square, Rounded, Hexagon, Diamond, Octagon
- •Implemented 5 progress bar styles and 4 button style options
- •Added 5 visualizer types: Pulse, Wave, Circular, Bars, Frequency
- •Implemented animation speeds and particle effects customization
- •Added Native Media Session API for system media controls
- •Created dedicated settings page for music player customization
- •Added MiniPlayer minimize/collapse functionality with circular corner button
- •Improved mobile responsiveness for music player and settings
- •Fixed equalizer presets loading and mobile UI improvements
- •Enhanced comment section with collapsible replies and card-based design
- •Fixed touch support CSS to prevent breaking existing UI elements
- •Added comprehensive music player with Web Audio API support
- •Implemented 10-band equalizer with preset management
- •Added quote system with multiple display modes (specific, random, time-based rotation)
- •Fixed date serialization issues across all API endpoints
- •Improved equalizer preset persistence after page refresh
- •Enhanced markdown editor with live preview and keyboard shortcuts
- •Added view order support for projects and music
- •Fixed audio playback issues with proper CORS handling
- •Improved playlist and equalizer UI with accent color borders
- •Added Articles, Projects, and Music pages with full functionality
- •Implemented project details pages with slug-based routing
- •Added date range support for projects (start date, end date, ongoing)
- •Added date range support for work experience and education
- •Implemented logo URL fields for experience and education
- •Added slug generation and management for projects
- •Fixed inline code rendering in markdown content
- •Improved project card layout with equal heights
- •Added abbreviated month names (Jan, Feb, Mar, etc.)
- •Fixed infinite request loops in articles page
- •Enhanced markdown editor with formatting toolbar
- •Added keyboard shortcuts for markdown formatting
- •Improved date formatting utilities with centralized functions
- •Fixed hydration mismatch warnings
- •Added proper date serialization for API responses
- •Improved error handling across all components
- •Initial release of voidR theme
- •Complete redesign with flat, modern aesthetic
- •Markdown editor for articles and projects
- •CDN integration for file management
- •Custom notification and confirmation dialogs
- •Profile cover image support
- •Full responsive design implementation
- •Admin panel for content management
- •Authentication system with Next-Auth
Theme created by tesla1618
voidR by tesla1618 © 2025