Apricot Navigation Admin Dashboard Vibe Coding Starter

Apricot – React Vite Tailwind Admin Dashboard Template

Apricot has been completely rebuilt from the ground up, transitioning from a legacy Bootstrap architecture to a blazing-fast, modern stack powered by React, Vite, and Tailwind CSS.

Designed for scalability and performance, Apricot retains its signature user experience—including the smart collapsible sidebar—while offering the modularity and speed required for next-generation web applications. It strikes the perfect balance between a clean, minimalist aesthetic and robust backend functionality.

Main Features

• Modern “Smart” Sidebar The signature Apricot navigation experience has been reimagined with React state management. The sidebar seamlessly toggles between a full view and a “Mini Mode.” In Mini Mode, menu text vanishes, leaving elegant icons that reveal their labels via Tailwind-styled tooltips on hover. This maximizes screen real estate without sacrificing navigation clarity.
• Instant Searchable Navigation Managing complex apps with extensive menus is effortless with Apricot’s built-in search facility. Powered by React’s real-time filtering, users can type to instantly locate specific menu items or sub-menus. This is essential for large-scale applications, allowing users to jump to “Mega Menu” items or deep links in milliseconds.
• Clean & Utility-First Design Gone are the heavy, rigid styles of the past. Apricot now utilizes Tailwind CSS for a utility-first approach. The design remains clean, flat, and distraction-free, but is now fully customizable and significantly lighter. It provides a professional look that feels intuitive for backend administration and SaaS products.
• ⚡ Powered by Vite & React We have replaced the legacy dependencies with a modern toolchain:
  • Vite: Experience instant server starts and lightning-fast Hot Module Replacement (HMR).
  • React Components: The template is fully modular. Every widget, button, and layout element is a reusable component.
  • Responsive: Fully adaptive layouts that look perfect on desktops, tablets, and mobile devices.

Technical Stack Highlights

• Framework: React 18+
• Build Tool: Vite
• Styling: Tailwind CSS v3+
• Icons: React Icons / Heroicons
• State Management: React Hooks / Context API

Changelog

v1.4 – 2025-04-25

MAJOR RELEASE: REACT VITE TAILWIND MIGRATION

This release marks the complete overhaul of Apricot, moving 
from a legacy Bootstrap architecture to a modern React stack.


+ Tech Stack: Rebuilt entirely using React 18 and Vite.
+ Styling: Migrated to Tailwind CSS v3 (Utility-first).
+ Sidebar: Added "Mini Mode" (icons only) with tooltip reveals.
+ Search: Added instant real-time filtering for sidebar menus.
+ Icons: Integrated React Icons / Heroicons library.
+ Components: Modular UI architecture (Cards, Buttons, Inputs).


* Design: Refreshed "Flat" aesthetic using Tailwind classes.
* Performance: Significantly reduced bundle size via Vite.


- jQuery dependency.
- Bootstrap 3 script and style dependencies.
------------------------------------------------------------