





Clean, Fast & Easy to Customise
Grab the most developer friendly Admin Dashboard,
UI Kits & Design System.






Arctic file structure is layout/demo based. Each layout folder is complete project. Consisting of src & dist folders.
You will make your style & javascript customization in src folder.
Everything in dist/assets will be generated from src.
| Directory/File | Descriiption |
|---|---|
| · layout[x] | Layout directory (e.g. layout1, layout2, layout3, layout4) |
| Build system | |
| · build-tools | Directory for build system. |
|
· gulp
|
Gulp compilation, copy, compress tasks for Js, SCSS, fonts and images. |
|
· node_modules
|
Source files of Plugins & packages. This directory will be created by running npm install. |
|
· gulp.config.js
|
Configuratoin file for gulp tasks. |
|
· gulpfile.js
|
Main gulp file for running gulp tasks. |
|
· helpers.js
|
Utility functions for compilation process. |
|
· package.json
|
Package manager configuration file. |
| Source files | |
|
· src
|
Source SCSS, Js, image, font files are located in this directory. |
|
· fonts
|
Directory for fonts. |
|
· images
|
Directory for images. |
|
· js
|
Directory for javascript files. |
|
· components
|
Js files for Arctic's main components. |
|
· layouts
|
Js files for Arctic's layout. |
|
· pages
|
Js files for Arctic individiul pages (e.g. analytic.js). |
|
· data
|
Dummy JSON data. |
|
· scss
|
Directory for SCSS files. |
|
· base
|
Includes variables, functions, mixins. |
|
· components
|
Component style files. |
|
· customized-plugins
|
Custom style files for plugins. |
|
· layouts
|
Style file for layout. |
|
· pages
|
Independent style files for each custom pages. |
|
· utilities
|
Custom utility classes. |
|
· _reboot.scss
|
Style reboot. |
|
· arctic-design-system.scss
|
Main root file of SCSS style files. |
|
· arctic-design-system-dark.scss
|
Main root SCSS file of dark version. |
| Distribution files | |
|
· dist
|
Distribution directory. |
|
· assets
|
Compiled and compressed SCSS, Js, image, font files are located in this directory. |
|
· vendors
|
This directory is generated by config.copy['vendors'] of Gulp config. |
|
· css
|
Directory for compiled CSS files. |
|
· pages
|
Compiled independent style files for each custom pages. Generated by config.copy['scss-pages'] |
|
· main.bundle.min.css
|
Main CSS bundle. Generated by config.bundle['main'] |
|
· main-dark.bundle.min.css
|
Main CSS bundle of dark version. Generated by config.bundle['main-dark'] |
|
· vendors.bundle.min.css
|
CSS bundle of required vendors. Generated by config.bundle['vendors'] |
|
· js
|
Directory for compiled Javascript files. |
|
· pages
|
Compiled independent js files for each custom pages. Generated by config.copy['js'] |
|
· data
|
Dummy data. Copied by config.copy['data']. |
|
· main.bundle.min.js
|
Main Js bundle. Generated by config.bundle['main'] |
|
· vendors.bundle.min.js
|
Js bundle of required vendors. Generated by config.bundle['vendors'] |
|
· fonts
|
Directory for fonts. Copied by config.copy['images-fonts'] |
|
· images
|
Directory for images. Copied by config.copy['images-fonts'] |