## HTML Structure

We use Jekyll and Liquid templating language to process templates. Here is a list of components that are found on most pages:

- _layouts/defaults.htm: It is used for layout structure for all main pages. It contains all base components to construct its skeleton
- _includes/base/head.html: Used as HTML head that contains page titles, meta info, and CSS and JS file includes
- _includes/base/header.html: Page's topbar/header component
- _includes/base/left-sidebar.html: Page's left sidebar navigation component
- _includes/base/right-sidebar.html: Page's right sidebar component
- _includes/base/footer.html: Page's footer component
- _includes/base/script.html: This component contains al JS file includes

##### Using UI Elements

We have many ready to use UI elements with detailed documentation. You can explore and use these by visiting `UI Elements` page in the Left Sidebar. Such as Alert, Card, Modal etc.

## Customizing Style

There are 2 basic ways to customize your theme...

- Compiled CSS: If you want to use Sleek Dashboard "as is", or only need limited customization, feel free to simply include the compiled `sleek.css` or `sleek.min.css` file located in the `dist/assets/css` directory.
- Customizing SCSS: This is more versatile and sustainable way to customize Sleek Dashboard. The 2 major benefits of this strategy are using variable overrides (`_variables.scss`) to easily customize theme styles, plus you never have to touch Bootstrap source, meaning future updates will be much, much, simpler.