A
Anonymous

Admin Class Panel - Copy this Html, Bootstrap Component to your project

Design an "Admin Panel" interface for managing class information. At the top, include the institution's logo with the text "Admin Panel," followed by the institute name (e.g., "IIT Bhagalpur"), a "Role" button, "Help & Support" link, and a "Log out" button. Below this header, add a "Class Info" section title. Create a search form labeled "Search for classes:" with two subsections. The first subsection, "Search by List," contains dropdown filters for "CourseCode," "ClassCourse," and "Course Name," with an "Apply" button to execute the search. The second subsection, "Specific Search," includes an input field labeled "Enter Lecture Name," a year selection dropdown (defaulted to "2022 23"), and a "Search" button. Below the search form, add buttons labeled "Add," "Delete," and "Update" for managing class records. In the main area, add a table with headers such as "Select," "Course," "Class Course," "Course Name," "Quantity," "Start," "End," and "Lecturer." Populate rows with sample data, including placeholders like "No due" for fee status, "Provisional" for registration, and "Pending" for lecturer status. At the bottom, add pagination controls labeled "<< Prev. Page" and "Next Page >>" with a page indicator like "1/10." Below the table, include two buttons labeled "Export" and "Import" for exporting results as an Excel file and importing data from an Excel file, respectively. Use a consistent color scheme with blue and yellow highlights for buttons and headers.

Prompt
Component Preview

About

Admin Class Panel - Manage class info with search filters, action buttons, and a data table. Built with HTML and Bootstrap. Copy now for free!

Share

Last updated 1 month ago