Created: 06 July 2023
By: Codebucks
Email: codebucks007@gmail.com
Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here . Thanks so much!
Clivax is built with Bootstrap v5.3.3 in HTML, SCSS with responsive with all devices and supported with Dark, light, RTL modes. You can change mode very quickly by doing a single change. It has many features like one to one chat, group chat, contact, send files, online users, read and unread new messages from users, authentication pages and many more.
HTML
├── dist
├── src
├── assets
├── css
├── fonts
├── images
├── js
└── scss
├── custom
├── _variables.scss
├── _variables-dark.scss
├── app.scss
├── bootstrap.scss
└── icons.scss
├── partials
├── body.html
├── footer.html
├── head-css.html
├── main.html
├── menu.html
├── page-title.html
├── right-sidebar.html
├── sidebar.html
├── title-meta.html
├── topbar.html
└── vendor-scripts.html
└── all html pages
├── gulpfile.js
└── package.json
└── yarn.lock
We are using gulp which allows having complete automation for build flow. In case if you don't know Gulp then it's easy to use it. Gulp is a toolkit for automating painful or time-consuming tasks in the development workflow, so you can stop messing around while building any project. You can read it more about it here. Please follow below steps to install and setup all prerequisites:
Please follow below steps to install and setup all prerequisites:
Make sure to have the Yarn installed & running in your computer. If you already have installed Yarn on your computer, you can skip this step. We suggest you to use Yarn instead of NPM.
Make sure to have the Node.js installed & running in your computer. If you already have installed Node on your computer, you can skip this step if your existing node version is greater than 18. We suggest you to use LTS version of Node.js.
Make sure to have the Gulp installed & running in
your computer. If you already have installed gulp on run
command npm install -g gulp from your
terminal.
Make sure to have the Git installed globally & running on your computer. If you already have installed git on your computer, you can skip this step.
To setup the admin theme, follow below-mentioned steps:
Make sure to have all above prerequisites installed & running on your computer
After you finished with the above steps, you can run the following commands into the terminal / command prompt from the root directory of the project to run the project locally or build for production use:
| Command | Description |
|---|---|
yarn install
|
This would install all the required dependencies in
the node_modules folder.
|
gulp
|
Runs the project locally, starts the development server and watches for any changes in your code, including your HTML, javascript, sass, etc. The development server is accessible at http://localhost:3000. |
gulp build
|
Generates a /dist directory with all
the production files.
|
To have light mode enabled, Keep your body element with data attribute
data-bs-theme="light" in the src/partials/body.html
E.g. <body data-bs-theme="light"> to
have Light layout.
To have dark mode enabled, Keep your body element with data attribute
data-bs-theme="dark" in the src/partials/body.html
E.g. <body data-bs-theme="dark"> to
have Dark layout.
To have rtl mode enabled, replace the reference of
bootstrap.min.css to
bootstrap-rtl.min.css and
app.min.css to
app-rtl.min.css in the src/partials/head-css.html.
Also add dir="rtl" in the html tag. e.g <html dir="rtl">
We've used the following images, files or other plugins URL, Licenses as listed.
| NAME | URL | LICENSE |
|---|---|---|
| Bootstrap | https://getbootstrap.com/ | MIT |
| Unsplash - Images | https://unsplash.com/ | MIT |
| Apexcharts | https://apexcharts.com/ | MIT |
| Choices js | https://github.com/Choices-js/Choices | MIT |
| Dropzone | https://www.dropzone.dev/js/ | MIT |
| Flatpicker | https://flatpickr.js.org/ | MIT |
| Full Calendar | https://fullcalendar.io/ | MIT |
| Gmaps | https://hpneo.dev/gmaps/examples.html | MIT |
| Jsvectormap | https://github.com/themustafaomar/jsvectormap | MIT |
| Moment | https://momentjs.com/ | MIT |
| Simplebar | https://grsmto.github.io/simplebar/ | MIT |
| Sweetalert 2 | https://sweetalert2.github.io/ | MIT |
| Swiper | https://swiperjs.com/ | MIT |
| Toastify js | https://apvarun.github.io/toastify-js/ | MIT |