#### Keen - The Ultimate Multi-Demo Bootstrap Admin Theme

#### The most complete UI/UX template solution for today's web projects of any size

## Files Structure

### Overview

Keen comes with a flexible file structure that can be easily used for small to large scope projects. This section will explain Keen's entire file structure and how to adapt it to your project.

Path | Description
--- | ---
docs | The theme documentation
theme | Main theme folder
classic | Classic package folder.
demos | Demos folder.
[...] | List of demo directories. Eg. default, demo2, demo3, etc.
assets | List of 3rd-Party vendor's plugins. Refer to Classic Package page for the vendor files structure.
default | Default package folder.
dist | Theme's preview folder.
[...] | List of demo folders(e.g: default, demo2, demo3, etc).
assets | Contains generated assets (JS, CSS, images, fonts, etc.) from build tools. Refer to folder `[root]/theme/default/tools/conf/default.json`
components | Theme's component demos.
custom | Theme\s custom page demos.
index.html | Main page.
src | Source folder contains the raw source code of javascript, scss, images and web font files that will be minified/concatenated onto assets folder for production usage
[...] | Refer to Source File Structure below.
tools | Development and deployment tools
gulp | The build tools gulp tasks for bundle and minify the js and css files and complile sass fi,les.
node_modules | NPM package installation folder
conf | Contains theme assets configuration in json file.
default.json | Theme configuration for default version
gulpfile.json | Gulp tasks main script. All the build tool tasks are grouped in this script
package.json | NPM package manager config file

### Source File Structure

Below table explains Keen's components file structure including Javascript, SCSS, etc. The table below start with the path: `[root]/theme/default/src/`

Path | Description
--- | ---
src | This source folder contains the raw source code of javascript, scss, images and web font files that will be minified/concatenated upon running build tasks onto the assets folder for production usage
media | Media files(images, videos, etc...)
theme | Theme level source files
app | Application level source files
bundle | JS files that will be concatenated and minified into a single bundle file.
demo-panel.js | The JS file for offcanvas init the demo list panel.
lib.js | A helper functions for chart initializations.
offcanvas-panel.js | Offcanvas initialization JS script.
quick-panel.js | Quick-panel initialization JS script.
quick-search.js | Quick-search initialization JS script.
custom | Custom JS files that indivdually minified and moved to the assets folder for on-demand usage
blog | Blog page components. Eg. blog post, blog list, blog list grid view, etc.
error | Error page components
general | General components folder.
components | Theme's component demos.
custom | Theme\s custom page demos.
dashboard.js | Dashboard page initialization JS scripts.
invoice | Invoice page components
pricing | Pricing page components
user | User page components. Eg. login page, profile page, etc.
demo | Demo level source files
[...] | Demo's directory(e.g: default, demo2, demo3, ...)
media | Optional folder that contain images.
sass | Demo level SASS files (demo layout code).
scripts | Demo level JS files.
bundle | Demo's bundlable JS files.
aside-secondary.js | Optional file for Secondary's Aside panel for initialization.
layout.js | Demo's main initialization class.
framework | Theme's framework components
components | Custom SCSS components
base | Base components.
foundation | Required components for the layout.
vendors | 3rd-Party plugins component overrides.
core | Core libraries. Eg. Bootstrap, Angular
bootstrap | Customize and override Bootstrap components.
extend | Keen's custom SCSS Bootstrap
_extend.scss | Extend and Override Bootstrap Components SCSS.
_variables.scss | Custom Bootstrap variables.
boostrap.scss | Main Bootstrap include file called in the demo's main style.scss file.
lib | Global required JS and SASS codes.
_functions.scss | Global functions for SASS.
mixin.scss | Global mixins for SASS.
app.js | Global available JS functions to initialize the theme's base features.
util.js | Global available Pure JS helper functions for manipulation DOM
vendors | 3rd-Party plugins style customization SCSS files
_config.scss | The main SCSS framework config
_include.scss | The main SCSS include file

### Keen’s Key Features

Keen empowers your project with virtually limitless array of options
to create endless unique projects.

- Based On Bootstrap 4.x
- Multi-Demo Concept
- Enterprise Ready Architect
- Integrated Build Tools: Gulp, NPM, Yarn, SASS
- Full RTL Support
- Included Classic(without build tool) Version
- Enterprise Ready Core Framework
- Full SASS Support
- Re-Usable Component System
- And many more...

> We truly hope that our love and dedication to produce an incredibly powerful high level solution suits all your project needs. We will continue to deliver incredible enterprise ready solutions for Angular, React and VueJS to serve you better. We sincerely hope you enjoyed using Keen as much as we enjoyed building it.

> Sean, Keenthemes Co-Author