🌑 OBSIDIAN — Wealth Architecture

A High-Density, Pro-Terminal Financial Intelligence Dashboard.

Obsidian is a premium, "Dark Luxury" financial management interface designed for high-speed data interpretation and precise asset tracking. Built with a focus on typographical hierarchy and mathematical layout, it provides a production-grade experience for monitoring complex capital flows.

Dashboard Preview

💎 Core Architectures

1. Data Visualization (Pro-Terminal Mode)

Zero-Intercept Scaling: Custom Chart.js configuration ensuring data lines start exactly at the Y-axis pivot point for technical precision.
Air-Gap Notations: Externalized financial labels with 10px gutters for maximum legibility in high-density views.
Dynamic Doughnut: Compact, mobile-optimized asset allocation charts with responsive legend scaling.

2. Role-Based Access Control (RBAC)

Viewer Mode: Read-only access to global financial snapshots and algorithmic insights.
Admin Mode: Full write-access enabling capital flow injection and record deletion.
Uiverse Toggle: Custom-tailored dual-circle toggle for seamless, state-aware access switching.

3. Safety-First Flow Management

Safe-Delete Architecture: Asynchronous, promise-based confirmation modals (Obsidian-themed) for all destructive actions to prevent accidental data purging.
Native Smooth-Scroll: Fluid navigation between Dashboard Overview, Transaction Ledger, and Insights via high-end scroll behavior.

4. Data Portability

One-Touch CSV Export: High-fidelity data extraction of the current ledger state (filtered and sorted) for external auditing and spreadsheet integration.
Dynamic File Generation: Real-time CSV compilation using secure Blob-based download architecture.

🛠️ Technical Stack

Structure: Semantic HTML5
Styling: Vanilla CSS3 (Custom Design Tokens, Glassmorphism, HSL Palettes)
Logic: Modern ECMAScript (Vanilla JS)
Engine: Chart.js v4.4+
Typography: Cormorant Garamond (Display) & DM Mono (Data)

📱 Mobile Intelligence

Obsidian is engineered for High-Density Mobile UX (Optimized for 412px x 915px):

Focused Navigation: Single-action mobile header showing only the immediate context.
Horizontal-Access Toggle: Integrated role-switcher placed directly next to the active view title.
Safe-Frame Grid: Automatic gap recalibration to prevent legend-clipping on smaller viewports.

🚀 Setup & Deployment

Clone the Architecture:

git clone https://github.com/LavKumarShakya/obsidian-dashboard.git

Initialize: Simply open index.html in any modern browser. No build steps required.
Operation: Use the switch at the top-right to toggle between Viewer (Read-only) and Admin (Edit) permissions.

Designed for those who view finance as architecture.