# CodideX School ERP HTML Template System

CodideX is a frontend-only School ERP HTML template foundation.

## Phase 1 Scope

- Project architecture
- Design tokens and global CSS
- Reusable layout system
- Dashboard shell
- Core dashboard widgets
- Login template
- Local image asset system
- Responsive behavior
- Print-ready CSS foundation

## Day 2 Scope

- Premium reusable component system
- Dashboard UI enhancements
- Advanced buttons, cards, badges, alerts, tabs, empty states, and toasts
- Reusable form examples
- Responsive table system
- Modal and dropdown showcase
- Improved dark mode and microinteractions

## Technology

- HTML5
- CSS3
- Bootstrap 5
- Vanilla JavaScript
- Font Awesome
- Google Fonts

## CSS Files

- `assets/css/variables.css`: design tokens
- `assets/css/global.css`: base styles, utilities, forms, tables
- `assets/css/layout.css`: shell, sidebar, topbar, auth layout, footer
- `assets/css/components.css`: cards, KPIs, widgets, actions, notifications
- `assets/css/responsive.css`: desktop, tablet, and mobile breakpoints
- `assets/css/print.css`: A4 print foundation

## JavaScript Files

- `assets/js/app.js`: shared utilities and global UI behavior
- `assets/js/sidebar.js`: sidebar drawer and collapse handling
- `assets/js/theme.js`: light/dark theme persistence
- `assets/js/dashboard.js`: dashboard counters and demo filters

Day 2 extends `app.js` with loading button, toast trigger, password toggle, and table selection helpers.

## Asset Policy

All demo images are local SVG placeholders under `assets/images`. Replace these files with project-specific images while preserving folder intent and relative paths.

## Backend Policy

This template includes no PHP, MySQL, APIs, backend authentication, or server-side logic.