adminator-admin-dashboard 2.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (191) hide show
  1. package/CLAUDE.md +162 -0
  2. package/LICENSE +21 -0
  3. package/README.md +376 -0
  4. package/RELEASE_NOTES.md +92 -0
  5. package/dist/1e59d2330b4c6deb84b3.ttf +0 -0
  6. package/dist/20fd1704ea223900efa9.woff2 +0 -0
  7. package/dist/29b39089170885ae2967.woff +0 -0
  8. package/dist/404.html +24 -0
  9. package/dist/500.html +24 -0
  10. package/dist/55b07f26c86c8e3d3754.svg +1 -0
  11. package/dist/8b43027f47b20503057d.eot +0 -0
  12. package/dist/9bad94440d49256265a5.eot +0 -0
  13. package/dist/9fad440d8ee7a949a9a9.svg +1 -0
  14. package/dist/assets/c1e38fd9e0e74ba58f7a2b77ef29fdd3.svg +2671 -0
  15. package/dist/assets/f0fc8c798eac5636249c4ea287832422.svg +362 -0
  16. package/dist/assets/static/fonts/icons/fontawesome/FontAwesome.otf +0 -0
  17. package/dist/assets/static/fonts/icons/fontawesome/fontawesome-webfont.eot +0 -0
  18. package/dist/assets/static/fonts/icons/fontawesome/fontawesome-webfont.svg +2671 -0
  19. package/dist/assets/static/fonts/icons/fontawesome/fontawesome-webfont.ttf +0 -0
  20. package/dist/assets/static/fonts/icons/fontawesome/fontawesome-webfont.woff +0 -0
  21. package/dist/assets/static/fonts/icons/fontawesome/fontawesome-webfont.woff2 +0 -0
  22. package/dist/assets/static/fonts/icons/themify/themify.eot +0 -0
  23. package/dist/assets/static/fonts/icons/themify/themify.svg +362 -0
  24. package/dist/assets/static/fonts/icons/themify/themify.ttf +0 -0
  25. package/dist/assets/static/fonts/icons/themify/themify.woff +0 -0
  26. package/dist/assets/static/images/404.png +0 -0
  27. package/dist/assets/static/images/500.png +0 -0
  28. package/dist/assets/static/images/bg.jpg +0 -0
  29. package/dist/assets/static/images/datatables/sort_asc.png +0 -0
  30. package/dist/assets/static/images/datatables/sort_asc_disabled.png +0 -0
  31. package/dist/assets/static/images/datatables/sort_both.png +0 -0
  32. package/dist/assets/static/images/datatables/sort_desc.png +0 -0
  33. package/dist/assets/static/images/datatables/sort_desc_disabled.png +0 -0
  34. package/dist/assets/static/images/logo-circle.svg +7 -0
  35. package/dist/assets/static/images/logo-gradient.svg +13 -0
  36. package/dist/assets/static/images/logo-outline.svg +7 -0
  37. package/dist/assets/static/images/logo.png +0 -0
  38. package/dist/assets/static/images/logo.svg +5 -0
  39. package/dist/basic-table.html +715 -0
  40. package/dist/blank.html +522 -0
  41. package/dist/buttons.html +467 -0
  42. package/dist/calendar.html +692 -0
  43. package/dist/charts.html +681 -0
  44. package/dist/chat.html +730 -0
  45. package/dist/compose.html +643 -0
  46. package/dist/datatable.html +1009 -0
  47. package/dist/eda8b94308c6f538f04a.ttf +0 -0
  48. package/dist/email.html +992 -0
  49. package/dist/f691f37e57f04c152e23.woff +0 -0
  50. package/dist/forms.html +760 -0
  51. package/dist/google-maps.html +530 -0
  52. package/dist/index.html +1090 -0
  53. package/dist/main.js +61239 -0
  54. package/dist/main.js.map +1 -0
  55. package/dist/signin.html +107 -0
  56. package/dist/signup.html +104 -0
  57. package/dist/test.html +91 -0
  58. package/dist/ui.html +931 -0
  59. package/dist/vector-maps.html +529 -0
  60. package/package.json +112 -0
  61. package/src/404.html +24 -0
  62. package/src/500.html +24 -0
  63. package/src/assets/scripts/app.js +644 -0
  64. package/src/assets/scripts/charts/chartJS/index.js +148 -0
  65. package/src/assets/scripts/charts/easyPieChart/index.js +200 -0
  66. package/src/assets/scripts/charts/index.js +3 -0
  67. package/src/assets/scripts/charts/sparkline/index.js +208 -0
  68. package/src/assets/scripts/chat/index.js +11 -0
  69. package/src/assets/scripts/components/Chart.js +1390 -0
  70. package/src/assets/scripts/components/Sidebar.js +241 -0
  71. package/src/assets/scripts/constants/colors.js +274 -0
  72. package/src/assets/scripts/datatable/index.js +379 -0
  73. package/src/assets/scripts/datepicker/index.js +302 -0
  74. package/src/assets/scripts/email/index.js +25 -0
  75. package/src/assets/scripts/fullcalendar/index.js +86 -0
  76. package/src/assets/scripts/googleMaps/index.js +93 -0
  77. package/src/assets/scripts/index.js +18 -0
  78. package/src/assets/scripts/masonry/index.js +14 -0
  79. package/src/assets/scripts/popover/index.js +109 -0
  80. package/src/assets/scripts/scrollbar/index.js +10 -0
  81. package/src/assets/scripts/search/index.js +15 -0
  82. package/src/assets/scripts/sidebar/index.js +140 -0
  83. package/src/assets/scripts/skycons/index.js +52 -0
  84. package/src/assets/scripts/ui/index.js +412 -0
  85. package/src/assets/scripts/utils/date.js +242 -0
  86. package/src/assets/scripts/utils/dom.js +349 -0
  87. package/src/assets/scripts/utils/index.js +45 -0
  88. package/src/assets/scripts/utils/theme.js +105 -0
  89. package/src/assets/scripts/vectorMaps/index.js +277 -0
  90. package/src/assets/static/fonts/icons/fontawesome/FontAwesome.otf +0 -0
  91. package/src/assets/static/fonts/icons/fontawesome/fontawesome-webfont.eot +0 -0
  92. package/src/assets/static/fonts/icons/fontawesome/fontawesome-webfont.svg +2671 -0
  93. package/src/assets/static/fonts/icons/fontawesome/fontawesome-webfont.ttf +0 -0
  94. package/src/assets/static/fonts/icons/fontawesome/fontawesome-webfont.woff +0 -0
  95. package/src/assets/static/fonts/icons/fontawesome/fontawesome-webfont.woff2 +0 -0
  96. package/src/assets/static/fonts/icons/themify/themify.eot +0 -0
  97. package/src/assets/static/fonts/icons/themify/themify.svg +362 -0
  98. package/src/assets/static/fonts/icons/themify/themify.ttf +0 -0
  99. package/src/assets/static/fonts/icons/themify/themify.woff +0 -0
  100. package/src/assets/static/images/404.png +0 -0
  101. package/src/assets/static/images/500.png +0 -0
  102. package/src/assets/static/images/bg.jpg +0 -0
  103. package/src/assets/static/images/datatables/sort_asc.png +0 -0
  104. package/src/assets/static/images/datatables/sort_asc_disabled.png +0 -0
  105. package/src/assets/static/images/datatables/sort_both.png +0 -0
  106. package/src/assets/static/images/datatables/sort_desc.png +0 -0
  107. package/src/assets/static/images/datatables/sort_desc_disabled.png +0 -0
  108. package/src/assets/static/images/logo-circle.svg +7 -0
  109. package/src/assets/static/images/logo-gradient.svg +13 -0
  110. package/src/assets/static/images/logo-outline.svg +7 -0
  111. package/src/assets/static/images/logo.png +0 -0
  112. package/src/assets/static/images/logo.svg +5 -0
  113. package/src/assets/styles/index.scss +801 -0
  114. package/src/assets/styles/spec/components/easyPieChart.scss +11 -0
  115. package/src/assets/styles/spec/components/footer.scss +4 -0
  116. package/src/assets/styles/spec/components/forms.scss +288 -0
  117. package/src/assets/styles/spec/components/index.scss +9 -0
  118. package/src/assets/styles/spec/components/loader.scss +46 -0
  119. package/src/assets/styles/spec/components/masonry.scss +1 -0
  120. package/src/assets/styles/spec/components/pageContainer.scss +255 -0
  121. package/src/assets/styles/spec/components/progressBar.scss +6 -0
  122. package/src/assets/styles/spec/components/sidebar.scss +642 -0
  123. package/src/assets/styles/spec/components/topbar.scss +455 -0
  124. package/src/assets/styles/spec/generic/base.scss +102 -0
  125. package/src/assets/styles/spec/generic/index.scss +1 -0
  126. package/src/assets/styles/spec/index.scss +4 -0
  127. package/src/assets/styles/spec/screens/chat.scss +147 -0
  128. package/src/assets/styles/spec/screens/email.scss +108 -0
  129. package/src/assets/styles/spec/screens/index.scss +2 -0
  130. package/src/assets/styles/spec/settings/baseColors.scss +103 -0
  131. package/src/assets/styles/spec/settings/borders.scss +6 -0
  132. package/src/assets/styles/spec/settings/breakpoints.scss +26 -0
  133. package/src/assets/styles/spec/settings/fonts.scss +4 -0
  134. package/src/assets/styles/spec/settings/index.scss +4 -0
  135. package/src/assets/styles/spec/settings/materialColors.scss +550 -0
  136. package/src/assets/styles/spec/tools/index.scss +1 -0
  137. package/src/assets/styles/spec/tools/mixins/clearfix.scss +15 -0
  138. package/src/assets/styles/spec/tools/mixins/index.scss +3 -0
  139. package/src/assets/styles/spec/tools/mixins/mediaQueriesRanges.scss +58 -0
  140. package/src/assets/styles/spec/tools/mixins/placeholder.scss +10 -0
  141. package/src/assets/styles/spec/utils/colors.scss +33 -0
  142. package/src/assets/styles/spec/utils/index.scss +2 -0
  143. package/src/assets/styles/spec/utils/layout/helpers/border.scss +78 -0
  144. package/src/assets/styles/spec/utils/layout/helpers/flex.scss +220 -0
  145. package/src/assets/styles/spec/utils/layout/helpers/index.scss +11 -0
  146. package/src/assets/styles/spec/utils/layout/helpers/layout.scss +137 -0
  147. package/src/assets/styles/spec/utils/layout/helpers/lists.scss +23 -0
  148. package/src/assets/styles/spec/utils/layout/helpers/margin.scss +266 -0
  149. package/src/assets/styles/spec/utils/layout/helpers/objects.scss +91 -0
  150. package/src/assets/styles/spec/utils/layout/helpers/padding.scss +147 -0
  151. package/src/assets/styles/spec/utils/layout/helpers/positions.scss +118 -0
  152. package/src/assets/styles/spec/utils/layout/helpers/pseudo.scss +6 -0
  153. package/src/assets/styles/spec/utils/layout/helpers/sizes.scss +157 -0
  154. package/src/assets/styles/spec/utils/layout/helpers/typography.scss +127 -0
  155. package/src/assets/styles/spec/utils/layout/index.scss +3 -0
  156. package/src/assets/styles/spec/utils/layout/mixins/generateResponsive.scss +25 -0
  157. package/src/assets/styles/spec/utils/layout/mixins/index.scss +2 -0
  158. package/src/assets/styles/spec/utils/layout/mixins/mediaQueryCondition.scss +28 -0
  159. package/src/assets/styles/spec/utils/layout/utils/center.scss +54 -0
  160. package/src/assets/styles/spec/utils/layout/utils/gap.scss +229 -0
  161. package/src/assets/styles/spec/utils/layout/utils/index.scss +5 -0
  162. package/src/assets/styles/spec/utils/layout/utils/layers.scss +5 -0
  163. package/src/assets/styles/spec/utils/layout/utils/peers.scss +35 -0
  164. package/src/assets/styles/utils/mobile.scss +954 -0
  165. package/src/assets/styles/utils/theme.css +97 -0
  166. package/src/assets/styles/vendor/datepicker.scss +183 -0
  167. package/src/assets/styles/vendor/font-awesome.css +2337 -0
  168. package/src/assets/styles/vendor/fullcalendar.scss +217 -0
  169. package/src/assets/styles/vendor/index.scss +8 -0
  170. package/src/assets/styles/vendor/jquery.datatables.scss +162 -0
  171. package/src/assets/styles/vendor/perfectScrollbar.scss +4 -0
  172. package/src/assets/styles/vendor/sparkline.scss +6 -0
  173. package/src/assets/styles/vendor/themify-icons.css +1081 -0
  174. package/src/basic-table.html +725 -0
  175. package/src/blank.html +532 -0
  176. package/src/buttons.html +477 -0
  177. package/src/calendar.html +702 -0
  178. package/src/charts.html +691 -0
  179. package/src/chat.html +740 -0
  180. package/src/compose.html +653 -0
  181. package/src/datatable.html +1019 -0
  182. package/src/email.html +1002 -0
  183. package/src/forms.html +770 -0
  184. package/src/google-maps.html +540 -0
  185. package/src/index.html +1100 -0
  186. package/src/signin.html +107 -0
  187. package/src/signup.html +104 -0
  188. package/src/test.html +96 -0
  189. package/src/ui.html +941 -0
  190. package/src/vector-maps.html +539 -0
  191. package/webpack.config.js +3 -0
package/CLAUDE.md ADDED
@@ -0,0 +1,162 @@
1
+ # CLAUDE.md
2
+
3
+ This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
4
+
5
+ ## Development Commands
6
+
7
+ ### Core Development
8
+ - `npm start` - Start development server with hot reload (available at http://localhost:4000)
9
+ - `npm run dev` - Start development server with webpack dashboard
10
+ - `npm run build` - Build for production (optimized)
11
+ - `npm run release:minified` - Build production with minification
12
+ - `npm run release:unminified` - Build production without minification
13
+ - `npm run preview` - Preview production build locally
14
+
15
+ ### Code Quality
16
+ - `npm run lint` - Run all linters (JavaScript + SCSS)
17
+ - `npm run lint:js` - Lint JavaScript files using ESLint 9.x flat config
18
+ - `npm run lint:scss` - Lint SCSS files using Stylelint
19
+
20
+ ### Utility Commands
21
+ - `npm run clean` - Clean the dist directory
22
+
23
+ ## Project Architecture
24
+
25
+ ### Technology Stack
26
+ - **Build System**: Webpack 5.99.9 with modern configuration
27
+ - **JavaScript**: ES6+ with Babel transpilation, ESLint 9.x flat config
28
+ - **CSS**: Sass/SCSS with PostCSS processing, Bootstrap 5.3.7
29
+ - **Frontend Framework**: **100% jQuery-free** vanilla JavaScript with modern class-based architecture
30
+ - **Theme System**: CSS variables-based dark/light mode system
31
+
32
+ ### Core Application Structure
33
+ The application follows a modular class-based architecture:
34
+
35
+ **Main Application Class** (`src/assets/scripts/app.js`):
36
+ - `AdminatorApp` - Main application controller with component management
37
+ - Handles initialization, mobile optimizations, and global event coordination
38
+ - Component registry system for managing feature modules
39
+
40
+ **Core Components**:
41
+ - `Sidebar` (`src/assets/scripts/components/Sidebar.js`) - Navigation sidebar logic
42
+ - `ChartComponent` (`src/assets/scripts/components/Chart.js`) - Chart rendering and theme integration
43
+ - `Theme` (`src/assets/scripts/utils/theme.js`) - Theme management with localStorage persistence
44
+
45
+ **Utility Modules**:
46
+ - `DOM` (`src/assets/scripts/utils/dom.js`) - DOM manipulation helpers
47
+ - `DateUtils` (`src/assets/scripts/utils/date.js`) - Date handling with Day.js integration
48
+
49
+ ### Dark Mode System
50
+ The project features a comprehensive dark mode implementation:
51
+
52
+ **Theme Toggle Integration**:
53
+ - Automatically injects theme toggle into navigation if missing
54
+ - Detects OS preference on first visit
55
+ - Persists theme choice in localStorage
56
+ - Real-time theme switching without page reload
57
+
58
+ **Component Theme Awareness**:
59
+ - Chart.js integration with dynamic color schemes
60
+ - FullCalendar dark mode support
61
+ - Vector maps with theme-specific palettes
62
+ - All UI components use CSS variables for theming
63
+
64
+ **CSS Variables Architecture**:
65
+ - Semantic color variables (e.g., `--c-bkg-body`, `--c-text-base`)
66
+ - Component-specific theme variables
67
+ - Automatic contrast and accessibility considerations
68
+
69
+ ### Mobile Optimization
70
+ The application includes extensive mobile enhancements:
71
+
72
+ **Responsive Features**:
73
+ - Full-width search overlay for mobile
74
+ - Enhanced dropdown behavior with overlay management
75
+ - Touch-friendly interactions
76
+ - Viewport-based responsive breakpoints
77
+
78
+ **Mobile-Specific Behavior**:
79
+ - Prevents horizontal scrolling on mobile
80
+ - Auto-focus management for form inputs
81
+ - Gesture-based navigation support
82
+
83
+ ### File Organization
84
+ ```
85
+ src/
86
+ ├── assets/
87
+ │ ├── scripts/ # JavaScript modules
88
+ │ │ ├── components/ # Reusable UI components
89
+ │ │ ├── utils/ # Utility functions
90
+ │ │ ├── charts/ # Chart initialization modules
91
+ │ │ ├── fullcalendar/ # Calendar integration
92
+ │ │ └── app.js # Main application entry point
93
+ │ ├── styles/ # SCSS stylesheets
94
+ │ │ ├── spec/ # Custom component styles
95
+ │ │ └── vendor/ # Third-party plugin styles
96
+ │ └── static/ # Static assets (fonts, images)
97
+ ├── *.html # HTML template pages
98
+ ```
99
+
100
+ ### Build Configuration
101
+ **Webpack Setup**:
102
+ - Modern flat ESLint configuration
103
+ - Sass compilation with PostCSS processing
104
+ - Source map generation for development
105
+ - Production optimization with minification
106
+ - Hot module replacement for development
107
+
108
+ **Development Server**:
109
+ - Webpack dev server on port 4000
110
+ - Live reload and hot module replacement
111
+ - Proxy configuration for API endpoints
112
+
113
+ ## Working with This Codebase
114
+
115
+ ### Adding New Components
116
+ 1. Create component class in `src/assets/scripts/components/`
117
+ 2. Register component in `AdminatorApp.init()` method
118
+ 3. Add component-specific styles in `src/assets/styles/spec/components/`
119
+ 4. Ensure theme compatibility using CSS variables
120
+
121
+ ### Modifying Themes
122
+ - Theme logic is centralized in `src/assets/scripts/utils/theme.js`
123
+ - CSS variables are defined in `src/assets/styles/utils/theme.css`
124
+ - Chart.js theme integration is automatic via `Chart.defaults` configuration
125
+
126
+ ### Testing Changes
127
+ - Always run `npm run lint` before committing
128
+ - Test both light and dark themes
129
+ - Verify mobile responsiveness at various breakpoints
130
+ - Check component integration via browser developer tools
131
+
132
+ ### Development Workflow
133
+ 1. Run `npm start` for development server
134
+ 2. Use `npm run dev` for enhanced debugging with webpack dashboard
135
+ 3. Lint code with `npm run lint` before commits
136
+ 4. Build production assets with `npm run build`
137
+ 5. Preview production build with `npm run preview`
138
+
139
+ ### Key Dependencies
140
+ - **Bootstrap 5.3.7**: UI framework and CSS components (JS components replaced with vanilla alternatives)
141
+ - **Chart.js 4.5.0**: Interactive charts with theme support (replaces jQuery Sparkline)
142
+ - **FullCalendar 6.1.17**: Calendar component with dark mode
143
+ - **Day.js 1.11.13**: Lightweight date manipulation
144
+ - **Perfect Scrollbar 1.5.6**: Custom scrollbar implementation
145
+ - **Masonry Layout 4.2.2**: Grid layouts (vanilla JS compatible)
146
+
147
+ ### Removed jQuery Dependencies
148
+ **Successfully removed all jQuery dependencies (~600KB bundle reduction):**
149
+ - ❌ `jquery` (3.7.1) - Replaced with vanilla JS DOM manipulation
150
+ - ❌ `jquery-sparkline` (2.4.0) - Replaced with Chart.js mini charts
151
+ - ❌ `bootstrap-datepicker` (1.10.0) - Replaced with HTML5 date inputs + vanilla JS
152
+ - ❌ `datatables` (1.10.18) - Replaced with vanilla JS table component
153
+ - ❌ `easy-pie-chart` (2.1.7) - Replaced with vanilla JS SVG pie charts
154
+ - ❌ `jvectormap` (2.0.4) - Replaced with vanilla JS SVG world map
155
+
156
+ ### Modern Vanilla JS Implementations
157
+ - **Sparkline Charts**: Chart.js-based mini charts with theme support
158
+ - **Pie Charts**: Custom SVG-based circular progress indicators
159
+ - **Data Tables**: Full-featured table with sorting, pagination, and search
160
+ - **Date Pickers**: Enhanced HTML5 date inputs with custom styling
161
+ - **Vector Maps**: SVG-based world map with markers and interactions
162
+ - **Bootstrap 5 Components**: Vanilla JS implementations of modals, dropdowns, popovers, tooltips, and accordions
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2018 Aigars Silkalns
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,376 @@
1
+ # Adminator Bootstrap 5 Admin Template v2.7.0
2
+
3
+ **Adminator** is a responsive Bootstrap 5 Admin Template built with modern development tools. It provides you with a collection of ready to use code snippets and utilities, custom pages, a collection of applications and some useful widgets.
4
+
5
+ 🚀 **Latest Update (v2.7.0)**: **100% jQuery-Free** - Complete removal of jQuery dependency (~600KB bundle reduction) with modern vanilla JavaScript implementation.
6
+
7
+ ⚡ **Performance Benefits**: Faster load times, smaller bundle size, modern ES6+ code, and zero jQuery overhead.
8
+
9
+ 📚 **[Complete Documentation](https://puikinsh.github.io/Adminator-admin-dashboard/)** - Detailed setup guides, API reference, and examples
10
+
11
+ Preview of this awesome admin template available here: https://colorlib.com/polygon/adminator/index.html
12
+
13
+ # Preview
14
+
15
+ ### Screenshots
16
+
17
+ **Light Mode:**
18
+ ![Adminator Bootstrap 5 Light Mode](https://colorlib.com/wp/wp-content/uploads/sites/2/adminator-bootstrap-5-light.png.avif)
19
+
20
+ **Dark Mode:**
21
+ ![Adminator Bootstrap 5 Dark Mode](https://colorlib.com/wp/wp-content/uploads/sites/2/adminator-bootstrap-5-dark.png.avif)
22
+
23
+ ### Demo Site: [Here](https://colorlib.com/polygon/adminator/index.html)
24
+
25
+ ## TOC
26
+ - [What's New in v2.7.0](#whats-new-in-v270)
27
+ - [Getting Started](#getting-started)
28
+ - [Prerequisites](#prerequisites)
29
+ - [Installing & Local Development](#installing--local-development)
30
+ - [Adminator for other platforms and frameworks](#adminator-for-other-platforms-and-frameworks)
31
+ - [Files/Folder Structure](#filesfolders-structure)
32
+ - [Deployment](#deployment)
33
+ - [Built With](#built-with)
34
+ - [Changelog](#changelog)
35
+ - [Authors](#authors)
36
+ - [License](#license)
37
+
38
+ ## What's New in v2.7.0
39
+
40
+ 🚀 **jQuery-Free Release** - Complete removal of jQuery dependency with modern vanilla JavaScript:
41
+
42
+ ### 💥 Major Performance Improvements
43
+ - **⚡ ~600KB Bundle Reduction**: Eliminated jQuery and all jQuery-dependent plugins
44
+ - **🚀 Faster Load Times**: Native DOM manipulation for optimal performance
45
+ - **📦 Smaller Bundle Size**: Significantly reduced JavaScript payload
46
+ - **🌟 Modern ES6+ Code**: Class-based architecture with modern JavaScript features
47
+
48
+ ### 🔄 jQuery Replacements (Zero Breaking Changes)
49
+ - **📊 Chart.js**: Replaced jQuery Sparkline with Chart.js mini charts
50
+ - **📅 HTML5 Date Pickers**: Enhanced native date inputs with Day.js support
51
+ - **📋 Vanilla DataTables**: Custom table component with sorting and pagination
52
+ - **🎨 SVG Pie Charts**: Pure JavaScript circular progress indicators
53
+ - **🗺️ Vector Maps**: JavaScript-based world map with markers and interactions
54
+ - **💬 Vanilla Popovers**: Lightweight alternatives to Bootstrap JS components
55
+
56
+ ### 🛠️ Technical Achievements
57
+ - **🎯 100% Vanilla JavaScript**: No jQuery dependency anywhere in the codebase
58
+ - **♻️ Component Architecture**: Modern class-based components (Sidebar, Charts, etc.)
59
+ - **🔧 Enhanced DOM Utilities**: jQuery-like functionality using native JavaScript
60
+ - **📱 Mobile Optimized**: Touch-friendly interactions and responsive behavior
61
+ - **🌙 Theme Integration**: All new components fully support dark/light mode switching
62
+
63
+ ### 🌙 Previous Updates (v2.6.0 - Dark Mode System)
64
+
65
+ ### 🎨 Dark Mode Features
66
+ - **🌗 Smart Theme Toggle**: Bootstrap-based switch with sun/moon icons and intuitive labels
67
+ - **🔄 OS Preference Detection**: Automatically detects and applies your preferred color scheme
68
+ - **💾 Persistent Storage**: Remembers your theme choice across browser sessions
69
+ - **⚡ Instant Switching**: Real-time theme updates without page reload
70
+ - **🎯 Component Integration**: All charts, calendars, maps, and UI elements are theme-aware
71
+
72
+ ### 🛠️ Technical Implementation
73
+ - **🎨 CSS Variables Architecture**: Comprehensive color system with semantic naming
74
+ - **📊 Chart.js Integration**: Dynamic color schemes for all chart types
75
+ - **🗓️ FullCalendar Support**: Dark-mode aware calendar with proper contrast
76
+ - **🗺️ Vector Maps**: Custom color palettes for both light and dark themes
77
+ - **🎪 Component Compatibility**: Theme support across all interactive elements
78
+
79
+ ### 🚀 Previous Updates (v2.5.0)
80
+ - **Latest Dependencies**: All 22+ dependencies updated to latest versions
81
+ - **Modern Build Tools**: webpack 5.99.9, webpack-dev-server 5.2.2
82
+ - **ESLint 9.x**: Migrated to modern flat config format
83
+ - **Enhanced CSS**: Latest Sass (1.89.2), PostCSS (8.5.6), Bootstrap (5.3.7)
84
+ - **Updated Components**: Chart.js 4.5.0, FullCalendar 6.1.17
85
+ - **Zero Vulnerabilities**: Complete security audit with all packages secure
86
+
87
+ ## Getting Started
88
+
89
+ In order to run **Adminator** on your local machine all what you need to do is to have the prerequisites stated below installed on your machine and follow the installation steps down below. Prebuilt static assets can be found under [releases](https://github.com/puikinsh/Adminator-admin-dashboard/releases).
90
+
91
+ #### Prerequisites
92
+ - **Node.js 18.12.0 or higher** (tested with Node.js 23.11.0)
93
+ - **npm** (included with Node.js) or **Yarn**
94
+ - **Git**
95
+
96
+ #### Installing & Local Development
97
+
98
+ Start by typing the following commands in your terminal in order to get **Adminator** full package on your machine and starting a local development server with live reload feature.
99
+
100
+ ```bash
101
+ # Clone the repository
102
+ git clone https://github.com/puikinsh/Adminator-admin-dashboard.git adminator
103
+
104
+ # Navigate to the project directory
105
+ cd adminator
106
+
107
+ # Install dependencies
108
+ npm install
109
+
110
+ # Start development server (available at http://localhost:4000)
111
+ npm start
112
+
113
+ # Alternative: Start with webpack dashboard
114
+ npm run dev
115
+ ```
116
+
117
+ #### Development Commands
118
+
119
+ ```bash
120
+ # Development server with hot reload
121
+ npm start
122
+
123
+ # Development server with dashboard
124
+ npm run dev
125
+
126
+ # Build for production (optimized)
127
+ npm run build
128
+
129
+ # Build for production (unminified)
130
+ npm run release:unminified
131
+
132
+ # Build for production (minified)
133
+ npm run release:minified
134
+
135
+ # Preview production build
136
+ npm run preview
137
+
138
+ # Lint JavaScript files
139
+ npm run lint:js
140
+
141
+ # Lint SCSS files
142
+ npm run lint:scss
143
+
144
+ # Run all linters
145
+ npm run lint
146
+ ```
147
+
148
+ ## 🌙 Dark Mode Usage
149
+
150
+ Adminator now includes a comprehensive dark mode system that works out of the box:
151
+
152
+ ### **Automatic Setup**
153
+ - Dark mode is automatically initialized on page load
154
+ - Detects your OS preference (light/dark) on first visit
155
+ - Remembers your choice across browser sessions
156
+
157
+ ### **Theme Toggle**
158
+ - Look for the **Light/Dark** toggle switch in the header navigation
159
+ - Click to instantly switch between light and dark themes
160
+ - Visual feedback with sun ☀️ and moon 🌙 icons
161
+
162
+ ### **For Developers**
163
+
164
+ 📚 **[Complete Theme API Documentation →](https://puikinsh.github.io/Adminator-admin-dashboard/api/theme-api)**
165
+
166
+ **Using the Theme API:**
167
+ ```javascript
168
+ // Get current theme
169
+ const currentTheme = Theme.current(); // 'light' or 'dark'
170
+
171
+ // Switch themes programmatically
172
+ Theme.toggle();
173
+
174
+ // Set specific theme
175
+ Theme.apply('dark');
176
+
177
+ // Listen for theme changes
178
+ window.addEventListener('adminator:themeChanged', (event) => {
179
+ console.log('Theme changed to:', event.detail.theme);
180
+ });
181
+ ```
182
+
183
+ **CSS Variables for Custom Styling:**
184
+ ```css
185
+ .my-component {
186
+ background: var(--c-bkg-card);
187
+ color: var(--c-text-base);
188
+ border: 1px solid var(--c-border);
189
+ }
190
+ ```
191
+
192
+ **Available CSS Variables:**
193
+ - `--c-bkg-body` - Main background
194
+ - `--c-bkg-card` - Card backgrounds
195
+ - `--c-text-base` - Primary text color
196
+ - `--c-text-muted` - Secondary text color
197
+ - `--c-border` - Border colors
198
+ - `--c-primary` - Primary brand color
199
+
200
+ 📖 **[View Complete CSS Variables Reference →](https://puikinsh.github.io/Adminator-admin-dashboard/customization/theme-system)**
201
+
202
+ ## Documentation
203
+
204
+ 📚 **[Complete Documentation Site](https://puikinsh.github.io/Adminator-admin-dashboard/)** - Comprehensive guides and API reference
205
+
206
+ ### Quick Links:
207
+ - 🚀 **[Installation Guide](https://puikinsh.github.io/Adminator-admin-dashboard/getting-started/installation)** - Complete setup instructions
208
+ - 🌙 **[Theme System](https://puikinsh.github.io/Adminator-admin-dashboard/customization/theme-system)** - Dark mode and theming
209
+ - 🔧 **[API Reference](https://puikinsh.github.io/Adminator-admin-dashboard/api/theme-api)** - JavaScript API documentation
210
+ - 💡 **[Examples](https://puikinsh.github.io/Adminator-admin-dashboard/examples/theme-integration)** - Integration examples
211
+
212
+ ## Adminator for other platforms and frameworks
213
+ * [Adminator right to left](https://github.com/mortezakarimi/Adminator-admin-dashboard-rtl) - Adminator modified to work with right to left languages like Persian and Arabic
214
+
215
+ ## Files/Folders Structure
216
+
217
+ Here is a brief explanation of the template folder structure and some of its main files usage:
218
+
219
+ ```
220
+ └── src # Contains all template source files.
221
+ │ └── assets # Contains JS, CSS, images and icon fonts.
222
+ │ │ └── scripts # Contains all JavaScript files.
223
+ │ │ │ └── charts # Chart.js, Sparkline & Pie Chart plugins init.
224
+ │ │ │ └── chat # All chat app JS code.
225
+ │ │ │ └── constants # Template constant values like color values.
226
+ │ │ │ └── datatable # Date table plugin init.
227
+ │ │ │ └── datepicker # Bootstrap datepicker init.
228
+ │ │ │ └── email # All email app code.
229
+ │ │ │ └── fullcalendar # Fullcalendar plugin init.
230
+ │ │ │ └── googleMaps # Google maps API integration code.
231
+ │ │ │ └── masonry # Masonry layout code.
232
+ │ │ │ └── popover # Bootstrap popover plugin init.
233
+ │ │ │ └── scrollbar # Perfect scrollbar plugin init.
234
+ │ │ │ └── search # Topbar toggle search init.
235
+ │ │ │ └── sidebar # Sidebar JS code.
236
+ │ │ │ └── skycons # Animated icons plugin init.
237
+ │ │ │ └── utils # Basic utils used for proper rendering.
238
+ │ │ │ └── vectorMaps # Vector maps plugin init.
239
+ │ │ │ └── app.js # Main application entry point.
240
+ │ │ │
241
+ │ │ └── static # Contains the non-code files.
242
+ │ │ │ └── fonts # Contains icon fonts.
243
+ │ │ │ └── images # Contains all template images/svg.
244
+ │ │ │
245
+ │ │ └── styles # Contains all SCSS files.
246
+ │ │ └── spec # Contains custom SCSS files.
247
+ │ │ │ └── components # Contains all template components.
248
+ │ │ │ └── generic # Contains basic scaffolding styles.
249
+ │ │ │ └── screens # Contains views specific styles.
250
+ │ │ │ └── settings # Contains all template variables.
251
+ │ │ │ └── tools # Contains all mixins.
252
+ │ │ │ └── utils # Contains helper classes.
253
+ │ │ │ └── index.scss # Indicator file.
254
+ │ │ │
255
+ │ │ └── vendor # Contains all plugin files & custom styles.
256
+ │ │ └── index.scss # Main style entry point.
257
+ │ │
258
+ │ └── *.html # All HTML template pages.
259
+ └── webpack # Contains Webpack configuration.
260
+ │ └── plugins # Contains all Webpack plugins config.
261
+ │ └── rules # Contains Webpack loaders config.
262
+ │ └── config.js # Main Webpack configuration.
263
+ │ └── devServer.js # Development server configuration.
264
+ │ └── manifest.js # Build system constants.
265
+
266
+ └── .babelrc # Babel ES6 transpiler configuration.
267
+ └── .editorconfig # Code editor consistency settings.
268
+ └── eslint.config.mjs # ESLint 9.x flat configuration.
269
+ └── .gitattributes # Git attributes configuration.
270
+ └── .gitignore # Git ignore patterns.
271
+ └── .stylelintrc.json # SCSS/CSS linting configuration.
272
+ └── browserslist # Supported browsers configuration.
273
+ └── CHANGELOG.md # Version history and updates.
274
+ └── package.json # Node.js package configuration.
275
+ └── README.md # This documentation file.
276
+ └── webpack.config.js # Webpack entry configuration.
277
+ ```
278
+
279
+ ## Deployment
280
+
281
+ In deployment process, you have several commands:
282
+
283
+ 1. **Production Build** - Generate optimized assets for production:
284
+ ```bash
285
+ npm run build
286
+ ```
287
+
288
+ 2. **Production Preview** - Preview the production build locally:
289
+ ```bash
290
+ npm run preview
291
+ ```
292
+
293
+ 3. **Custom Builds**:
294
+ ```bash
295
+ # Unminified production build (for debugging)
296
+ npm run release:unminified
297
+
298
+ # Minified production build (smallest size)
299
+ npm run release:minified
300
+ ```
301
+
302
+ The built files will be available in the `dist/` directory.
303
+
304
+ ## Built With
305
+
306
+ ### Core Framework & Build Tools
307
+ - [Bootstrap 5.3.7](http://getbootstrap.com/) - Modern CSS framework
308
+ - [Webpack 5.99.9](https://webpack.js.org/) - Module bundler and build tool
309
+ - [Babel 7.27.x](https://babeljs.io/) - JavaScript transpiler
310
+ - [Sass 1.89.2](http://sass-lang.com/) - CSS preprocessor
311
+ - [PostCSS 8.5.6](http://postcss.org/) - CSS transformations
312
+ - [ESLint 9.29.0](https://eslint.org/) - JavaScript linting (flat config)
313
+ - [Stylelint 16.21.0](https://stylelint.io/) - CSS/SCSS linting
314
+
315
+ ### UI Components & Charts
316
+ - [Chart.js 4.5.0](http://www.chartjs.org/) - Modern charting library
317
+ - [FullCalendar 6.1.17](https://fullcalendar.io/) - Interactive calendar
318
+ - [DataTables](https://datatables.net/) - Advanced table functionality
319
+ - [Easy Pie Chart](http://rendro.github.io/easy-pie-chart/) - Animated pie charts
320
+ - [Perfect Scrollbar 1.5.6](https://github.com/utatti/perfect-scrollbar) - Custom scrollbars
321
+
322
+ ### JavaScript Libraries
323
+ - **[Chart.js 4.5.0](http://www.chartjs.org/)** - Modern charting library (replaces jQuery Sparkline)
324
+ - **[jsvectormap 1.6.0](https://github.com/themustafaomar/jsvectormap)** - Interactive vector maps (replaces jVectorMap)
325
+ - [Lodash 4.17.21](https://lodash.com/) - Utility library
326
+ - [Day.js 1.11.13](https://day.js.org/) - Modern 2KB date library (replaces Moment.js)
327
+ - [Masonry 4.2.2](https://masonry.desandro.com/) - Grid layouts
328
+ - **100% Vanilla JavaScript** - No jQuery dependency
329
+
330
+ ### Icons & Fonts
331
+ - [Font Awesome](http://fontawesome.io/) - Icon library
332
+ - [Themify Icons](https://themify.me/themify-icons) - Additional icons
333
+ - [Roboto Font](https://fonts.google.com/specimen/Roboto) - Google Fonts
334
+
335
+ ### Additional Plugins
336
+ - **HTML5 Date Inputs** - Enhanced native date pickers (replaces Bootstrap Datepicker)
337
+ - [Skycons](https://darkskyapp.github.io/skycons/) - Animated weather icons
338
+ - [Load Google Maps API](https://github.com/yuanqing/load-google-maps-api) - Maps integration
339
+
340
+ ## Changelog
341
+
342
+ See [CHANGELOG.md](CHANGELOG.md) for detailed version history.
343
+
344
+ 📚 **[Online Documentation](https://puikinsh.github.io/Adminator-admin-dashboard/)** includes comprehensive guides for all features.
345
+
346
+ #### Latest Release: V 2.7.0 (2025-07-09)
347
+ - **🚀 100% jQuery-Free** - Complete removal of jQuery dependency (~600KB reduction)
348
+ - **⚡ Modern Vanilla JavaScript** - Class-based architecture with ES6+ features
349
+ - **📊 Chart.js Integration** - Replaced jQuery Sparkline with Chart.js
350
+ - **📅 HTML5 Date Pickers** - Enhanced native inputs with Day.js support
351
+ - **🗺️ SVG Vector Maps** - Pure JavaScript world maps with theme support
352
+ - **🎯 Zero Breaking Changes** - All functionality preserved with better performance
353
+
354
+ #### Previous Releases
355
+ - **V 2.6.0**: Complete Dark Mode System with theme switching
356
+ - **V 2.5.0**: Updated all dependencies, ESLint 9.x, zero vulnerabilities
357
+ - **V 2.1.0**: Upgraded all dependencies
358
+ - **V 2.0.0**: Upgrade to Bootstrap 5
359
+ - **V 1.1.0**: Upgrade to webpack 5
360
+ - **V 1.0.0**: Initial Release
361
+
362
+ ## Authors
363
+ [Colorlib](https://colorlib.com)
364
+
365
+ ## More info
366
+ - [Bootstrap Dashboards](https://colorlib.com/wp/free-bootstrap-admin-dashboard-templates/)
367
+ - [Bootstrap Templates](https://colorlib.com/wp/free-bootstrap-templates/)
368
+ - [HTML Templates](https://colorlib.com/wp/free-html-website-templates/)
369
+ - [Free Admin Dashboards](https://colorlib.com/wp/free-html5-admin-dashboard-templates/)
370
+ - [Website Templates](https://colorlib.com/wp/templates/)
371
+ - [Free CSS Templates](https://colorlib.com/wp/free-css-website-templates/)
372
+ - [WordPress Themes](https://colorlib.com/wp/free-wordpress-themes/)
373
+
374
+ ## License
375
+
376
+ Adminator is licensed under The MIT License (MIT). Which means that you can use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the final products. But you always need to state that Colorlib is the original author of this template.
@@ -0,0 +1,92 @@
1
+ # 🚀 Adminator v2.7.0 - jQuery-Free Release
2
+
3
+ ## 📋 Overview
4
+ This major release completely removes jQuery dependency from the Adminator admin dashboard while maintaining all functionality and improving performance. The project now uses modern vanilla JavaScript with Bootstrap 5.3.7.
5
+
6
+ ## ✨ Major Changes
7
+
8
+ ### 🗑️ Removed jQuery Dependencies (600KB+ bundle reduction)
9
+ - ❌ **jQuery Core** (3.7.1) → ✅ **Vanilla JavaScript**
10
+ - ❌ **jQuery Sparkline** (2.4.0) → ✅ **Chart.js 4.5.0** mini charts
11
+ - ❌ **Bootstrap Datepicker** (1.10.0) → ✅ **HTML5 date inputs** + vanilla JS
12
+ - ❌ **DataTables** (1.10.18) → ✅ **Custom vanilla JS** table component
13
+ - ❌ **Easy Pie Chart** (2.1.7) → ✅ **Custom SVG** pie charts
14
+ - ❌ **jVectorMap** (2.0.4) → ✅ **JSVectorMap 1.6.0** (jQuery-free)
15
+
16
+ ### 🔧 New Vanilla JavaScript Components
17
+ - **Bootstrap 5 Components**: Modals, dropdowns, popovers, tooltips, accordions
18
+ - **Enhanced Data Tables**: Sorting, pagination, search functionality
19
+ - **Interactive Charts**: Chart.js-based sparklines with theme support
20
+ - **Vector Maps**: Interactive world maps with markers and tooltips
21
+ - **Date Pickers**: HTML5 date inputs with enhanced UX
22
+ - **Theme System**: Improved dark/light mode with CSS variables
23
+
24
+ ### 📱 Mobile Enhancements
25
+ - Full-width search overlay for mobile devices
26
+ - Enhanced dropdown behavior with overlay management
27
+ - Touch-friendly interactions and gestures
28
+ - Viewport-based responsive breakpoints
29
+ - Prevents horizontal scrolling on mobile
30
+
31
+ ### 🎨 Bootstrap 5 Migration
32
+ - **Updated to Bootstrap 5.3.7** from Bootstrap 4
33
+ - **Fixed deprecated classes**: `sr-only` → `visually-hidden`
34
+ - **Updated data attributes**: `data-toggle` → `data-bs-toggle`
35
+ - **Enhanced UI components**: New examples and improved styling
36
+ - **Better accessibility**: Proper ARIA attributes and keyboard navigation
37
+
38
+ ## 🚀 Performance Improvements
39
+ - **Bundle size reduction**: ~600KB smaller JavaScript bundle
40
+ - **Faster page loads**: Eliminated jQuery dependency
41
+ - **Modern ES6+**: Class-based architecture with better maintainability
42
+ - **Optimized builds**: Webpack 5.99.9 with modern optimizations
43
+
44
+ ## 📦 New Features
45
+ - **Theme Toggle**: Automatic injection with OS preference detection
46
+ - **Comprehensive Documentation**: Updated CLAUDE.md with full architecture guide
47
+ - **Mobile-First Design**: Enhanced mobile experience across all components
48
+ - **Dark Mode**: Complete dark mode implementation with CSS variables
49
+
50
+ ## 🔧 Technical Details
51
+ - **Build System**: Webpack 5.99.9 with hot module replacement
52
+ - **JavaScript**: ES6+ with Babel transpilation, ESLint 9.x flat config
53
+ - **CSS**: Sass/SCSS with PostCSS processing
54
+ - **Frontend**: 100% jQuery-free vanilla JavaScript
55
+ - **Theme System**: CSS variables-based dark/light mode
56
+
57
+ ## 📖 Documentation
58
+ - Complete architecture documentation in `CLAUDE.md`
59
+ - Development commands and workflow guidelines
60
+ - Component integration examples
61
+ - Mobile optimization techniques
62
+
63
+ ## 🔗 Demo
64
+ - **Live Demo**: https://puikinsh.github.io/Adminator-admin-dashboard/
65
+ - **Development Server**: `npm start` (http://localhost:4000)
66
+
67
+ ## 💻 Quick Start
68
+ ```bash
69
+ # Install dependencies
70
+ npm install
71
+
72
+ # Start development server
73
+ npm start
74
+
75
+ # Build for production
76
+ npm run build
77
+
78
+ # Run linters
79
+ npm run lint
80
+ ```
81
+
82
+ ## 🎯 What's Next
83
+ This release establishes a modern, maintainable foundation for the Adminator admin dashboard. All functionality has been preserved while significantly improving performance and developer experience.
84
+
85
+ ## 🙏 Acknowledgments
86
+ - Original design by [Colorlib](https://colorlib.com)
87
+ - jQuery removal and modernization completed with comprehensive testing
88
+ - Bootstrap 5 migration with full backward compatibility
89
+
90
+ ---
91
+
92
+ **Full Changelog**: https://github.com/puikinsh/Adminator-admin-dashboard/compare/v2.6.1...v2.7.0
Binary file
Binary file
Binary file
package/dist/404.html ADDED
@@ -0,0 +1,24 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
6
+ <title>404</title>
7
+ <script defer="defer" src="main.js"></script></head>
8
+ <body class="app">
9
+ <div class="pos-a t-0 l-0 bgc-white w-100 h-100 d-f fxd-r fxw-w ai-c jc-c pos-r p-30">
10
+ <div class="mR-60">
11
+ <img alt="#" src="assets/static/images/404.png">
12
+ </div>
13
+
14
+ <div class="d-f jc-c fxd-c">
15
+ <h1 class="mB-30 fw-900 lh-1 c-red-500" style="font-size: 60px;">404</h1>
16
+ <h3 class="mB-10 fsz-lg c-grey-900 tt-c">Oops Page Not Found</h3>
17
+ <p class="mB-30 fsz-def c-grey-700">The page you are looking for does not exist or has been moved.</p>
18
+ <div>
19
+ <a href="index.html" type="primary" class="btn btn-primary">Go to Home</a>
20
+ </div>
21
+ </div>
22
+ </div>
23
+ </body>
24
+ </html>