Curriculum Management - Copy this React, Tailwind Component to your project
Design a professional and user friendly curriculum management section. The design should include a sidebar with accordion sections, and each section should contain lessons (like videos, quizzes, assignments) represented as cards. The sidebar should have intuitive icons for each lesson type (video, quiz, etc.) and a search bar for filtering lessons. The main content area should display the selected lesson's details, featuring a rich text editor for lesson creation and editing, with options for text formatting, media embedding, and adding questions (for quizzes). Include clear buttons for actions like saving, editing, and previewing lessons. Add a header with the course title and autosave functionality. Ensure that the design is responsive for desktop and mobile. Use modern design principles with a clean, minimalistic layout, ample white space, and a cohesive color scheme with blue as the primary color and subtle accent colors. Additionally, incorporate drag and drop functionality for reordering lessons, tooltips for icons, and smooth transitions for interactions like adding or editing lessons. Ensure that feedback messages (like ‘saved’ or ‘added successfully’) are displayed clearly, and use accessible, easy to read typography.
