├── .DS_Store ├── .gitignore ├── CHANGELOG.md ├── LICENSE ├── PSD └── Purple_dashboard_free.psd ├── README.md ├── assets ├── css │ ├── style.css │ └── style.css.map ├── fonts │ └── Ubuntu │ │ ├── Ubuntu-Bold.eot │ │ ├── Ubuntu-Bold.ttf │ │ ├── Ubuntu-Bold.woff │ │ ├── Ubuntu-Bold.woff2 │ │ ├── Ubuntu-Light.eot │ │ ├── Ubuntu-Light.ttf │ │ ├── Ubuntu-Light.woff │ │ ├── Ubuntu-Light.woff2 │ │ ├── Ubuntu-Medium.eot │ │ ├── Ubuntu-Medium.ttf │ │ ├── Ubuntu-Medium.woff │ │ ├── Ubuntu-Medium.woff2 │ │ ├── Ubuntu-Regular.eot │ │ ├── Ubuntu-Regular.ttf │ │ ├── Ubuntu-Regular.woff │ │ └── Ubuntu-Regular.woff2 ├── images │ ├── dashboard │ │ ├── circle.png │ │ ├── circle.svg │ │ ├── img_1.jpg │ │ ├── img_2.jpg │ │ ├── img_3.jpg │ │ └── img_4.jpg │ ├── faces-clipart │ │ ├── pic-1.png │ │ ├── pic-2.png │ │ ├── pic-3.png │ │ └── pic-4.png │ ├── faces │ │ ├── face1.jpg │ │ ├── face10.jpg │ │ ├── face11.jpg │ │ ├── face12.jpg │ │ ├── face13.jpg │ │ ├── face14.jpg │ │ ├── face15.jpg │ │ ├── face16.jpg │ │ ├── face17.jpg │ │ ├── face18.jpg │ │ ├── face19.jpg │ │ ├── face2.jpg │ │ ├── face20.jpg │ │ ├── face21.jpg │ │ ├── face22.jpg │ │ ├── face23.jpg │ │ ├── face24.jpg │ │ ├── face25.jpg │ │ ├── face26.jpg │ │ ├── face27.jpg │ │ ├── face3.jpg │ │ ├── face4.jpg │ │ ├── face5.jpg │ │ ├── face6.jpg │ │ ├── face7.jpg │ │ ├── face8.jpg │ │ └── face9.jpg │ ├── favicon.ico │ ├── favicon.png │ ├── logo-mini.svg │ ├── logo.svg │ └── sprites │ │ ├── blue.png │ │ ├── dark.png │ │ ├── flag.png │ │ ├── green.png │ │ ├── jsgrid-icons.png │ │ ├── red.png │ │ └── yellow.png ├── js │ ├── chart.js │ ├── dashboard.js │ ├── file-upload.js │ ├── hoverable-collapse.js │ ├── jquery.cookie.js │ ├── misc.js │ ├── off-canvas.js │ ├── todo.js │ └── todolist.js ├── scss │ ├── _dashboard.scss │ ├── _demo.scss │ ├── _fonts.scss │ ├── _footer.scss │ ├── _functions.scss │ ├── _layouts.scss │ ├── _misc.scss │ ├── _navbar.scss │ ├── _reset.scss │ ├── _sidebar.scss │ ├── _typography.scss │ ├── _utilities.scss │ ├── _variables.scss │ ├── _vertical-wrapper.scss │ ├── _widget-grid.scss │ ├── components │ │ ├── _badges.scss │ │ ├── _bootstrap-progress.scss │ │ ├── _breadcrumbs.scss │ │ ├── _buttons.scss │ │ ├── _cards.scss │ │ ├── _checkbox-radio.scss │ │ ├── _dropdown.scss │ │ ├── _forms.scss │ │ ├── _icons.scss │ │ ├── _lists.scss │ │ ├── _preview.scss │ │ ├── _tables.scss │ │ └── _todo-list.scss │ ├── landing-screens │ │ └── _auth.scss │ ├── mixins │ │ ├── _animation.scss │ │ ├── _background.scss │ │ ├── _badges.scss │ │ ├── _blockqoute.scss │ │ ├── _breadcrumbs.scss │ │ ├── _buttons.scss │ │ ├── _cards.scss │ │ ├── _misc.scss │ │ ├── _pagination.scss │ │ ├── _popovers.scss │ │ ├── _text.scss │ │ └── _tooltips.scss │ └── style.scss └── vendors │ ├── chart.js │ └── Chart.min.js │ ├── css │ └── vendor.bundle.base.css │ ├── js │ ├── bootstrap.min.js.map │ └── vendor.bundle.base.js │ └── mdi │ ├── css │ ├── materialdesignicons.min.css │ └── materialdesignicons.min.css.map │ └── fonts │ ├── materialdesignicons-webfont.eot │ ├── materialdesignicons-webfont.ttf │ ├── materialdesignicons-webfont.woff │ └── materialdesignicons-webfont.woff2 ├── gulp-tasks ├── inject.js ├── serve.js └── vendors.js ├── gulpfile.js ├── index.html ├── package.json ├── pages ├── charts │ └── chartjs.html ├── forms │ └── basic_elements.html ├── icons │ └── mdi.html ├── samples │ ├── blank-page.html │ ├── error-404.html │ ├── error-500.html │ ├── login.html │ └── register.html ├── tables │ └── basic-table.html └── ui-features │ ├── buttons.html │ └── typography.html ├── partials ├── _footer.html ├── _navbar.html └── _sidebar.html └── screenshot.jpg /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/.DS_Store -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Add any directories, files, or patterns you don't want to be tracked by version control 2 | 3 | /node_modules 4 | /bower_components 5 | package-lock.json -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # CHANGELOG 2 | 3 | ## V 5.0.0 4 | - Bootstrap5 5 | 6 | 7 | ## V 4.0.0 8 | - footer links 9 | - 10 | ## V 3.0.0 11 | - Better changes for file structure 12 | - Design improvements 13 | - Updated outdated plugins 14 | - Bug fixes 15 | 16 | ## V 2.0.0 17 | - Updated to Bootstrap 5.1 version 18 | - Improved design 19 | - Migrated all plugins from bower component to npm component 20 | - Removed deprecated plugins 21 | - Better management of vendor files 22 | - Other bug fixes 23 | 24 | ## V 1.0.0 25 | - Initial release 26 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 BootstrapDash 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. 22 | -------------------------------------------------------------------------------- /PSD/Purple_dashboard_free.psd: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/PSD/Purple_dashboard_free.psd -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 |

PurpleAdmin-Free-Admin-Template

4 | Purple Admin is a free responsive admin template built with Bootstrap 5. The template has colorful, attractive yet simple and elegant design. The template is well crafted, with all the components neatly and carefully designed and arranged within the template. 5 | 6 | Purple Admin is packed with all the features that fit your needs but not cramped with components you would not even use. It is an excellent fit to build admin panels, e-commerce systems, project management systems, CMS or CRM. 7 | 8 | Although the template has a design like none other, it is easily customizable to suit your requirements. Purple Admin comes with a clean and well-commented code that makes it easy to work with the template. Thus making it an ideal pick for jump starting your project. 9 | 10 | 11 |

Credits:

12 | 13 | - Bootstrap 5 14 | - Material Design Icons 15 | - jQuery 16 | - Gulp 17 | - Chart.js 18 | 19 |

Browser Support:

20 | 21 | Purple Admin is designed to work flawlessly with all the latest and modern web browsers. 22 | 23 | - Chrome (latest) 24 | - FireFox (latest) 25 | - Safari (latest) 26 | - Opera (latest) 27 | - IE10+ 28 | 29 |

License Information:

30 | 31 | 32 | Purple Admin is released under MIT license. Purple Admin is a free Bootstrap 5 admin template developed from BootstrapDash. Feel free to download it, use it, share it, get creative with it. 33 | 34 |

How to use Purple Admin?

35 | 36 | 37 | 1 - Click the Clone or Download button in GitHub and download as a ZIP file or you can enter the command git clone https://github.com/BootstrapDash/PurpleAdmin-Free-Admin-Template.git in you terminal to get a copy of this template. 38 | 39 | 2 - After the files have been downloaded you will get a folder with all the required files 40 | 41 | 3 - You can install all the dependencies in the template by running the command npm install. All the required files are in the node modules. 42 | 43 | 4 - Find the file named index.html, check what all components you need. Open the file in a text editor and you can start editing. 44 | 45 | 5 - Now that your project has now kick-started, all you need to do now is to code, code, and code to your heart's content. 46 | 47 |

How to Contribute?:

48 | 49 | 50 | We love your contributions and we welcome them wholeheartedly. We believe the more the merrier. 51 | To contribute make sure you have a Node.js and npm installed. Now run the command gulp --version. If the command returns with the Gulp version number, it means you have Gulp installed. If not you need to run the command npm install --global gulp-cli to install Gulp. 52 | 53 |

Next

54 | 55 | After Gulp has been installed, follow the steps below to contribute. 56 |
57 | 1 - Fork and clone the repo of Purple Admin. 58 |
59 | 2 - Run the command npm install to install all the dependencies. 60 |
61 | 3 - Enter the command gulp serve. This will open Purple Admin in your default browser. 62 |
63 | 4 - Make your valuable contribution 64 |
65 | 5 - Submit a pull request. 66 |
67 | Do you need a template with more features and functionalities? Get more with our collection of the premium template with more plugins, eye catching animations, UI components, and sample pages all fitting together with a high-quality design. 68 | Visit 69 | https://www.bootstrapdash.com for more admin templates. 70 | -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Bold.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Bold.eot -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Bold.ttf -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Bold.woff -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Bold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Bold.woff2 -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Light.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Light.eot -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Light.ttf -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Light.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Light.woff -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Light.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Light.woff2 -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Medium.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Medium.eot -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Medium.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Medium.ttf -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Medium.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Medium.woff -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Medium.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Medium.woff2 -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Regular.eot -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Regular.ttf -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Regular.woff -------------------------------------------------------------------------------- /assets/fonts/Ubuntu/Ubuntu-Regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/fonts/Ubuntu/Ubuntu-Regular.woff2 -------------------------------------------------------------------------------- /assets/images/dashboard/circle.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/dashboard/circle.png -------------------------------------------------------------------------------- /assets/images/dashboard/circle.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 9 | 3 10 | Created with Sketch. 11 | 12 | 13 | 14 | 15 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /assets/images/dashboard/img_1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/dashboard/img_1.jpg -------------------------------------------------------------------------------- /assets/images/dashboard/img_2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/dashboard/img_2.jpg -------------------------------------------------------------------------------- /assets/images/dashboard/img_3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/dashboard/img_3.jpg -------------------------------------------------------------------------------- /assets/images/dashboard/img_4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/dashboard/img_4.jpg -------------------------------------------------------------------------------- /assets/images/faces-clipart/pic-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces-clipart/pic-1.png -------------------------------------------------------------------------------- /assets/images/faces-clipart/pic-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces-clipart/pic-2.png -------------------------------------------------------------------------------- /assets/images/faces-clipart/pic-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces-clipart/pic-3.png -------------------------------------------------------------------------------- /assets/images/faces-clipart/pic-4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces-clipart/pic-4.png -------------------------------------------------------------------------------- /assets/images/faces/face1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face1.jpg -------------------------------------------------------------------------------- /assets/images/faces/face10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face10.jpg -------------------------------------------------------------------------------- /assets/images/faces/face11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face11.jpg -------------------------------------------------------------------------------- /assets/images/faces/face12.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face12.jpg -------------------------------------------------------------------------------- /assets/images/faces/face13.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face13.jpg -------------------------------------------------------------------------------- /assets/images/faces/face14.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face14.jpg -------------------------------------------------------------------------------- /assets/images/faces/face15.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face15.jpg -------------------------------------------------------------------------------- /assets/images/faces/face16.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face16.jpg -------------------------------------------------------------------------------- /assets/images/faces/face17.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face17.jpg -------------------------------------------------------------------------------- /assets/images/faces/face18.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face18.jpg -------------------------------------------------------------------------------- /assets/images/faces/face19.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face19.jpg -------------------------------------------------------------------------------- /assets/images/faces/face2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face2.jpg -------------------------------------------------------------------------------- /assets/images/faces/face20.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face20.jpg -------------------------------------------------------------------------------- /assets/images/faces/face21.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face21.jpg -------------------------------------------------------------------------------- /assets/images/faces/face22.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face22.jpg -------------------------------------------------------------------------------- /assets/images/faces/face23.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face23.jpg -------------------------------------------------------------------------------- /assets/images/faces/face24.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face24.jpg -------------------------------------------------------------------------------- /assets/images/faces/face25.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face25.jpg -------------------------------------------------------------------------------- /assets/images/faces/face26.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face26.jpg -------------------------------------------------------------------------------- /assets/images/faces/face27.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face27.jpg -------------------------------------------------------------------------------- /assets/images/faces/face3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face3.jpg -------------------------------------------------------------------------------- /assets/images/faces/face4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face4.jpg -------------------------------------------------------------------------------- /assets/images/faces/face5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face5.jpg -------------------------------------------------------------------------------- /assets/images/faces/face6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face6.jpg -------------------------------------------------------------------------------- /assets/images/faces/face7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face7.jpg -------------------------------------------------------------------------------- /assets/images/faces/face8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face8.jpg -------------------------------------------------------------------------------- /assets/images/faces/face9.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/faces/face9.jpg -------------------------------------------------------------------------------- /assets/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/favicon.ico -------------------------------------------------------------------------------- /assets/images/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/favicon.png -------------------------------------------------------------------------------- /assets/images/logo-mini.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /assets/images/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 16 | 17 | 18 | 19 | 20 | 23 | 24 | 25 | 26 | 27 | 30 | 31 | 32 | 33 | 34 | 36 | 37 | 38 | 39 | 40 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 88 | 89 | 90 | 91 | -------------------------------------------------------------------------------- /assets/images/sprites/blue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/sprites/blue.png -------------------------------------------------------------------------------- /assets/images/sprites/dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/sprites/dark.png -------------------------------------------------------------------------------- /assets/images/sprites/flag.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/sprites/flag.png -------------------------------------------------------------------------------- /assets/images/sprites/green.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/sprites/green.png -------------------------------------------------------------------------------- /assets/images/sprites/jsgrid-icons.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/sprites/jsgrid-icons.png -------------------------------------------------------------------------------- /assets/images/sprites/red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/sprites/red.png -------------------------------------------------------------------------------- /assets/images/sprites/yellow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/images/sprites/yellow.png -------------------------------------------------------------------------------- /assets/js/chart.js: -------------------------------------------------------------------------------- 1 | $(function () { 2 | /* ChartJS 3 | * ------- 4 | * Data and config for chartjs 5 | */ 6 | 'use strict'; 7 | var data = { 8 | labels: ["2013", "2014", "2014", "2015", "2016", "2017"], 9 | datasets: [{ 10 | label: '# of Votes', 11 | data: [10, 19, 3, 5, 2, 3], 12 | backgroundColor: [ 13 | 'rgba(255, 99, 132, 0.2)', 14 | 'rgba(54, 162, 235, 0.2)', 15 | 'rgba(255, 206, 86, 0.2)', 16 | 'rgba(75, 192, 192, 0.2)', 17 | 'rgba(153, 102, 255, 0.2)', 18 | 'rgba(255, 159, 64, 0.2)' 19 | ], 20 | borderColor: [ 21 | 'rgba(255,99,132,1)', 22 | 'rgba(54, 162, 235, 1)', 23 | 'rgba(255, 206, 86, 1)', 24 | 'rgba(75, 192, 192, 1)', 25 | 'rgba(153, 102, 255, 1)', 26 | 'rgba(255, 159, 64, 1)' 27 | ], 28 | borderWidth: 1, 29 | fill: false 30 | }] 31 | }; 32 | var dataDark = { 33 | labels: ["2013", "2014", "2014", "2015", "2016", "2017"], 34 | datasets: [{ 35 | label: '# of Votes', 36 | data: [10, 19, 3, 5, 2, 3], 37 | backgroundColor: [ 38 | 'rgba(255, 99, 132, 0.2)', 39 | 'rgba(54, 162, 235, 0.2)', 40 | 'rgba(255, 206, 86, 0.2)', 41 | 'rgba(75, 192, 192, 0.2)', 42 | 'rgba(153, 102, 255, 0.2)', 43 | 'rgba(255, 159, 64, 0.2)' 44 | ], 45 | borderColor: [ 46 | 'rgba(255,99,132,1)', 47 | 'rgba(54, 162, 235, 1)', 48 | 'rgba(255, 206, 86, 1)', 49 | 'rgba(75, 192, 192, 1)', 50 | 'rgba(153, 102, 255, 1)', 51 | 'rgba(255, 159, 64, 1)' 52 | ], 53 | borderWidth: 1, 54 | fill: false 55 | }] 56 | }; 57 | var multiLineData = { 58 | labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], 59 | datasets: [{ 60 | label: 'Dataset 1', 61 | data: [12, 19, 3, 5, 2, 3], 62 | borderColor: [ 63 | '#587ce4' 64 | ], 65 | borderWidth: 2, 66 | fill: false 67 | }, 68 | { 69 | label: 'Dataset 2', 70 | data: [5, 23, 7, 12, 42, 23], 71 | borderColor: [ 72 | '#ede190' 73 | ], 74 | borderWidth: 2, 75 | fill: false 76 | }, 77 | { 78 | label: 'Dataset 3', 79 | data: [15, 10, 21, 32, 12, 33], 80 | borderColor: [ 81 | '#f44252' 82 | ], 83 | borderWidth: 2, 84 | fill: false 85 | } 86 | ] 87 | }; 88 | var options = { 89 | scales: { 90 | yAxes: [{ 91 | ticks: { 92 | beginAtZero: true 93 | } 94 | }] 95 | }, 96 | legend: { 97 | display: false 98 | }, 99 | elements: { 100 | point: { 101 | radius: 0 102 | } 103 | } 104 | 105 | }; 106 | var optionsDark = { 107 | scales: { 108 | yAxes: [{ 109 | ticks: { 110 | beginAtZero: true 111 | }, 112 | gridLines: { 113 | color: '#322f2f', 114 | zeroLineColor: '#322f2f' 115 | } 116 | }], 117 | xAxes: [{ 118 | ticks: { 119 | beginAtZero: true 120 | }, 121 | gridLines: { 122 | color: '#322f2f', 123 | } 124 | }], 125 | }, 126 | legend: { 127 | display: false 128 | }, 129 | elements: { 130 | point: { 131 | radius: 0 132 | } 133 | } 134 | 135 | }; 136 | var doughnutPieData = { 137 | datasets: [{ 138 | data: [30, 40, 30], 139 | backgroundColor: [ 140 | 'rgba(255, 99, 132, 0.5)', 141 | 'rgba(54, 162, 235, 0.5)', 142 | 'rgba(255, 206, 86, 0.5)', 143 | 'rgba(75, 192, 192, 0.5)', 144 | 'rgba(153, 102, 255, 0.5)', 145 | 'rgba(255, 159, 64, 0.5)' 146 | ], 147 | borderColor: [ 148 | 'rgba(255,99,132,1)', 149 | 'rgba(54, 162, 235, 1)', 150 | 'rgba(255, 206, 86, 1)', 151 | 'rgba(75, 192, 192, 1)', 152 | 'rgba(153, 102, 255, 1)', 153 | 'rgba(255, 159, 64, 1)' 154 | ], 155 | }], 156 | 157 | // These labels appear in the legend and in the tooltips when hovering different arcs 158 | labels: [ 159 | 'Pink', 160 | 'Blue', 161 | 'Yellow', 162 | ] 163 | }; 164 | var doughnutPieOptions = { 165 | responsive: true, 166 | animation: { 167 | animateScale: true, 168 | animateRotate: true 169 | } 170 | }; 171 | var areaData = { 172 | labels: ["2013", "2014", "2015", "2016", "2017"], 173 | datasets: [{ 174 | label: '# of Votes', 175 | data: [12, 19, 3, 5, 2, 3], 176 | backgroundColor: [ 177 | 'rgba(255, 99, 132, 0.2)', 178 | 'rgba(54, 162, 235, 0.2)', 179 | 'rgba(255, 206, 86, 0.2)', 180 | 'rgba(75, 192, 192, 0.2)', 181 | 'rgba(153, 102, 255, 0.2)', 182 | 'rgba(255, 159, 64, 0.2)' 183 | ], 184 | borderColor: [ 185 | 'rgba(255,99,132,1)', 186 | 'rgba(54, 162, 235, 1)', 187 | 'rgba(255, 206, 86, 1)', 188 | 'rgba(75, 192, 192, 1)', 189 | 'rgba(153, 102, 255, 1)', 190 | 'rgba(255, 159, 64, 1)' 191 | ], 192 | borderWidth: 1, 193 | fill: true, // 3: no fill 194 | }] 195 | }; 196 | 197 | var areaDataDark = { 198 | labels: ["2013", "2014", "2015", "2016", "2017"], 199 | datasets: [{ 200 | label: '# of Votes', 201 | data: [12, 19, 3, 5, 2, 3], 202 | backgroundColor: [ 203 | 'rgba(255, 99, 132, 0.2)', 204 | 'rgba(54, 162, 235, 0.2)', 205 | 'rgba(255, 206, 86, 0.2)', 206 | 'rgba(75, 192, 192, 0.2)', 207 | 'rgba(153, 102, 255, 0.2)', 208 | 'rgba(255, 159, 64, 0.2)' 209 | ], 210 | borderColor: [ 211 | 'rgba(255,99,132,1)', 212 | 'rgba(54, 162, 235, 1)', 213 | 'rgba(255, 206, 86, 1)', 214 | 'rgba(75, 192, 192, 1)', 215 | 'rgba(153, 102, 255, 1)', 216 | 'rgba(255, 159, 64, 1)' 217 | ], 218 | borderWidth: 1, 219 | fill: true, // 3: no fill 220 | }] 221 | }; 222 | 223 | var areaOptions = { 224 | plugins: { 225 | filler: { 226 | propagate: true 227 | } 228 | } 229 | } 230 | 231 | var areaOptionsDark = { 232 | scales: { 233 | yAxes: [{ 234 | ticks: { 235 | beginAtZero: true 236 | }, 237 | gridLines: { 238 | color: '#322f2f', 239 | zeroLineColor: '#322f2f' 240 | } 241 | }], 242 | xAxes: [{ 243 | ticks: { 244 | beginAtZero: true 245 | }, 246 | gridLines: { 247 | color: '#322f2f', 248 | } 249 | }], 250 | }, 251 | plugins: { 252 | filler: { 253 | propagate: true 254 | } 255 | } 256 | } 257 | 258 | var multiAreaData = { 259 | labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], 260 | datasets: [{ 261 | label: 'Facebook', 262 | data: [8, 11, 13, 15, 12, 13, 16, 15, 13, 19, 11, 14], 263 | borderColor: ['rgba(255, 99, 132, 0.5)'], 264 | backgroundColor: ['rgba(255, 99, 132, 0.5)'], 265 | borderWidth: 1, 266 | fill: true 267 | }, 268 | { 269 | label: 'Twitter', 270 | data: [7, 17, 12, 16, 14, 18, 16, 12, 15, 11, 13, 9], 271 | borderColor: ['rgba(54, 162, 235, 0.5)'], 272 | backgroundColor: ['rgba(54, 162, 235, 0.5)'], 273 | borderWidth: 1, 274 | fill: true 275 | }, 276 | { 277 | label: 'Linkedin', 278 | data: [6, 14, 16, 20, 12, 18, 15, 12, 17, 19, 15, 11], 279 | borderColor: ['rgba(255, 206, 86, 0.5)'], 280 | backgroundColor: ['rgba(255, 206, 86, 0.5)'], 281 | borderWidth: 1, 282 | fill: true 283 | } 284 | ] 285 | }; 286 | 287 | var multiAreaOptions = { 288 | plugins: { 289 | filler: { 290 | propagate: true 291 | } 292 | }, 293 | elements: { 294 | point: { 295 | radius: 0 296 | } 297 | }, 298 | scales: { 299 | xAxes: [{ 300 | gridLines: { 301 | display: false 302 | } 303 | }], 304 | yAxes: [{ 305 | gridLines: { 306 | display: false 307 | } 308 | }] 309 | } 310 | } 311 | 312 | var scatterChartData = { 313 | datasets: [{ 314 | label: 'First Dataset', 315 | data: [{ 316 | x: -10, 317 | y: 0 318 | }, 319 | { 320 | x: 0, 321 | y: 3 322 | }, 323 | { 324 | x: -25, 325 | y: 5 326 | }, 327 | { 328 | x: 40, 329 | y: 5 330 | } 331 | ], 332 | backgroundColor: [ 333 | 'rgba(255, 99, 132, 0.2)' 334 | ], 335 | borderColor: [ 336 | 'rgba(255,99,132,1)' 337 | ], 338 | borderWidth: 1 339 | }, 340 | { 341 | label: 'Second Dataset', 342 | data: [{ 343 | x: 10, 344 | y: 5 345 | }, 346 | { 347 | x: 20, 348 | y: -30 349 | }, 350 | { 351 | x: -25, 352 | y: 15 353 | }, 354 | { 355 | x: -10, 356 | y: 5 357 | } 358 | ], 359 | backgroundColor: [ 360 | 'rgba(54, 162, 235, 0.2)', 361 | ], 362 | borderColor: [ 363 | 'rgba(54, 162, 235, 1)', 364 | ], 365 | borderWidth: 1 366 | } 367 | ] 368 | } 369 | 370 | var scatterChartDataDark = { 371 | datasets: [{ 372 | label: 'First Dataset', 373 | data: [{ 374 | x: -10, 375 | y: 0 376 | }, 377 | { 378 | x: 0, 379 | y: 3 380 | }, 381 | { 382 | x: -25, 383 | y: 5 384 | }, 385 | { 386 | x: 40, 387 | y: 5 388 | } 389 | ], 390 | backgroundColor: [ 391 | 'rgba(255, 99, 132, 0.2)' 392 | ], 393 | borderColor: [ 394 | 'rgba(255,99,132,1)' 395 | ], 396 | borderWidth: 1 397 | }, 398 | { 399 | label: 'Second Dataset', 400 | data: [{ 401 | x: 10, 402 | y: 5 403 | }, 404 | { 405 | x: 20, 406 | y: -30 407 | }, 408 | { 409 | x: -25, 410 | y: 15 411 | }, 412 | { 413 | x: -10, 414 | y: 5 415 | } 416 | ], 417 | backgroundColor: [ 418 | 'rgba(54, 162, 235, 0.2)', 419 | ], 420 | borderColor: [ 421 | 'rgba(54, 162, 235, 1)', 422 | ], 423 | borderWidth: 1 424 | } 425 | ] 426 | } 427 | 428 | var scatterChartOptions = { 429 | scales: { 430 | xAxes: [{ 431 | type: 'linear', 432 | position: 'bottom' 433 | }] 434 | } 435 | } 436 | 437 | var scatterChartOptionsDark = { 438 | scales: { 439 | xAxes: [{ 440 | type: 'linear', 441 | position: 'bottom', 442 | gridLines: { 443 | color: '#322f2f', 444 | zeroLineColor: '#322f2f' 445 | } 446 | }], 447 | yAxes: [{ 448 | gridLines: { 449 | color: '#322f2f', 450 | zeroLineColor: '#322f2f' 451 | } 452 | }] 453 | } 454 | } 455 | // Get context with jQuery - using jQuery's .get() method. 456 | if ($("#barChart").length) { 457 | var barChartCanvas = $("#barChart").get(0).getContext("2d"); 458 | // This will get the first returned node in the jQuery collection. 459 | var barChart = new Chart(barChartCanvas, { 460 | type: 'bar', 461 | data: data, 462 | options: options 463 | }); 464 | } 465 | 466 | if ($("#barChartDark").length) { 467 | var barChartCanvasDark = $("#barChartDark").get(0).getContext("2d"); 468 | // This will get the first returned node in the jQuery collection. 469 | var barChartDark = new Chart(barChartCanvasDark, { 470 | type: 'bar', 471 | data: dataDark, 472 | options: optionsDark 473 | }); 474 | } 475 | 476 | if ($("#lineChart").length) { 477 | var lineChartCanvas = $("#lineChart").get(0).getContext("2d"); 478 | var lineChart = new Chart(lineChartCanvas, { 479 | type: 'line', 480 | data: data, 481 | options: options 482 | }); 483 | } 484 | 485 | if ($("#lineChartDark").length) { 486 | var lineChartCanvasDark = $("#lineChartDark").get(0).getContext("2d"); 487 | var lineChartDark = new Chart(lineChartCanvasDark, { 488 | type: 'line', 489 | data: dataDark, 490 | options: optionsDark 491 | }); 492 | } 493 | 494 | if ($("#linechart-multi").length) { 495 | var multiLineCanvas = $("#linechart-multi").get(0).getContext("2d"); 496 | var lineChart = new Chart(multiLineCanvas, { 497 | type: 'line', 498 | data: multiLineData, 499 | options: options 500 | }); 501 | } 502 | 503 | if ($("#areachart-multi").length) { 504 | var multiAreaCanvas = $("#areachart-multi").get(0).getContext("2d"); 505 | var multiAreaChart = new Chart(multiAreaCanvas, { 506 | type: 'line', 507 | data: multiAreaData, 508 | options: multiAreaOptions 509 | }); 510 | } 511 | 512 | if ($("#doughnutChart").length) { 513 | var doughnutChartCanvas = $("#doughnutChart").get(0).getContext("2d"); 514 | var doughnutChart = new Chart(doughnutChartCanvas, { 515 | type: 'doughnut', 516 | data: doughnutPieData, 517 | options: doughnutPieOptions 518 | }); 519 | } 520 | 521 | if ($("#pieChart").length) { 522 | var pieChartCanvas = $("#pieChart").get(0).getContext("2d"); 523 | var pieChart = new Chart(pieChartCanvas, { 524 | type: 'pie', 525 | data: doughnutPieData, 526 | options: doughnutPieOptions 527 | }); 528 | } 529 | 530 | if ($("#areaChart").length) { 531 | var areaChartCanvas = $("#areaChart").get(0).getContext("2d"); 532 | var areaChart = new Chart(areaChartCanvas, { 533 | type: 'line', 534 | data: areaData, 535 | options: areaOptions 536 | }); 537 | } 538 | 539 | if ($("#areaChartDark").length) { 540 | var areaChartCanvas = $("#areaChartDark").get(0).getContext("2d"); 541 | var areaChart = new Chart(areaChartCanvas, { 542 | type: 'line', 543 | data: areaDataDark, 544 | options: areaOptionsDark 545 | }); 546 | } 547 | 548 | if ($("#scatterChart").length) { 549 | var scatterChartCanvas = $("#scatterChart").get(0).getContext("2d"); 550 | var scatterChart = new Chart(scatterChartCanvas, { 551 | type: 'scatter', 552 | data: scatterChartData, 553 | options: scatterChartOptions 554 | }); 555 | } 556 | 557 | if ($("#scatterChartDark").length) { 558 | var scatterChartCanvas = $("#scatterChartDark").get(0).getContext("2d"); 559 | var scatterChart = new Chart(scatterChartCanvas, { 560 | type: 'scatter', 561 | data: scatterChartDataDark, 562 | options: scatterChartOptionsDark 563 | }); 564 | } 565 | 566 | if ($("#browserTrafficChart").length) { 567 | var doughnutChartCanvas = $("#browserTrafficChart").get(0).getContext("2d"); 568 | var doughnutChart = new Chart(doughnutChartCanvas, { 569 | type: 'doughnut', 570 | data: browserTrafficData, 571 | options: doughnutPieOptions 572 | }); 573 | } 574 | }); -------------------------------------------------------------------------------- /assets/js/file-upload.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | 'use strict'; 3 | $(function() { 4 | $('.file-upload-browse').on('click', function() { 5 | var file = $(this).parent().parent().parent().find('.file-upload-default'); 6 | file.trigger('click'); 7 | }); 8 | $('.file-upload-default').on('change', function() { 9 | $(this).parent().find('.form-control').val($(this).val().replace(/C:\\fakepath\\/i, '')); 10 | }); 11 | }); 12 | })(jQuery); -------------------------------------------------------------------------------- /assets/js/hoverable-collapse.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | 'use strict'; 3 | //Open submenu on hover in compact sidebar mode and horizontal menu mode 4 | $(document).on('mouseenter mouseleave', '.sidebar .nav-item', function(ev) { 5 | var body = $('body'); 6 | var sidebarIconOnly = body.hasClass("sidebar-icon-only"); 7 | var sidebarFixed = body.hasClass("sidebar-fixed"); 8 | if (!('ontouchstart' in document.documentElement)) { 9 | if (sidebarIconOnly) { 10 | if (sidebarFixed) { 11 | if (ev.type === 'mouseenter') { 12 | body.removeClass('sidebar-icon-only'); 13 | } 14 | } else { 15 | var $menuItem = $(this); 16 | if (ev.type === 'mouseenter') { 17 | $menuItem.addClass('hover-open') 18 | } else { 19 | $menuItem.removeClass('hover-open') 20 | } 21 | } 22 | } 23 | } 24 | }); 25 | $('.aside-toggler').click(function(){ 26 | $('.chat-list-wrapper').toggleClass('slide') 27 | }); 28 | })(jQuery); -------------------------------------------------------------------------------- /assets/js/jquery.cookie.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * jQuery Cookie Plugin v1.4.1 3 | * https://github.com/carhartl/jquery-cookie 4 | * 5 | * Copyright 2013 Klaus Hartl 6 | * Released under the MIT license 7 | */ 8 | (function (factory) { 9 | if (typeof define === 'function' && define.amd) { 10 | // AMD 11 | define(['jquery'], factory); 12 | } else if (typeof exports === 'object') { 13 | // CommonJS 14 | factory(require('jquery')); 15 | } else { 16 | // Browser globals 17 | factory(jQuery); 18 | } 19 | }(function ($) { 20 | 21 | var pluses = /\+/g; 22 | 23 | function encode(s) { 24 | return config.raw ? s : encodeURIComponent(s); 25 | } 26 | 27 | function decode(s) { 28 | return config.raw ? s : decodeURIComponent(s); 29 | } 30 | 31 | function stringifyCookieValue(value) { 32 | return encode(config.json ? JSON.stringify(value) : String(value)); 33 | } 34 | 35 | function parseCookieValue(s) { 36 | if (s.indexOf('"') === 0) { 37 | // This is a quoted cookie as according to RFC2068, unescape... 38 | s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\'); 39 | } 40 | 41 | try { 42 | // Replace server-side written pluses with spaces. 43 | // If we can't decode the cookie, ignore it, it's unusable. 44 | // If we can't parse the cookie, ignore it, it's unusable. 45 | s = decodeURIComponent(s.replace(pluses, ' ')); 46 | return config.json ? JSON.parse(s) : s; 47 | } catch(e) {} 48 | } 49 | 50 | function read(s, converter) { 51 | var value = config.raw ? s : parseCookieValue(s); 52 | return $.isFunction(converter) ? converter(value) : value; 53 | } 54 | 55 | var config = $.cookie = function (key, value, options) { 56 | 57 | // Write 58 | 59 | if (value !== undefined && !$.isFunction(value)) { 60 | options = $.extend({}, config.defaults, options); 61 | 62 | if (typeof options.expires === 'number') { 63 | var days = options.expires, t = options.expires = new Date(); 64 | t.setTime(+t + days * 864e+5); 65 | } 66 | 67 | return (document.cookie = [ 68 | encode(key), '=', stringifyCookieValue(value), 69 | options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE 70 | options.path ? '; path=' + options.path : '', 71 | options.domain ? '; domain=' + options.domain : '', 72 | options.secure ? '; secure' : '' 73 | ].join('')); 74 | } 75 | 76 | // Read 77 | 78 | var result = key ? undefined : {}; 79 | 80 | // To prevent the for loop in the first place assign an empty array 81 | // in case there are no cookies at all. Also prevents odd result when 82 | // calling $.cookie(). 83 | var cookies = document.cookie ? document.cookie.split('; ') : []; 84 | 85 | for (var i = 0, l = cookies.length; i < l; i++) { 86 | var parts = cookies[i].split('='); 87 | var name = decode(parts.shift()); 88 | var cookie = parts.join('='); 89 | 90 | if (key && key === name) { 91 | // If second argument (value) is a function it's a converter... 92 | result = read(cookie, value); 93 | break; 94 | } 95 | 96 | // Prevent storing a cookie that we couldn't decode. 97 | if (!key && (cookie = read(cookie)) !== undefined) { 98 | result[name] = cookie; 99 | } 100 | } 101 | 102 | return result; 103 | }; 104 | 105 | config.defaults = {}; 106 | 107 | $.removeCookie = function (key, options) { 108 | if ($.cookie(key) === undefined) { 109 | return false; 110 | } 111 | 112 | // Must not alter options, thus extending a fresh object... 113 | $.cookie(key, '', $.extend({}, options, { expires: -1 })); 114 | return !$.cookie(key); 115 | }; 116 | 117 | })); 118 | -------------------------------------------------------------------------------- /assets/js/misc.js: -------------------------------------------------------------------------------- 1 | var ChartColor = ["#5D62B4", "#54C3BE", "#EF726F", "#F9C446", "rgb(93.0, 98.0, 180.0)", "#21B7EC", "#04BCCC"]; 2 | var primaryColor = getComputedStyle(document.body).getPropertyValue('--primary'); 3 | var secondaryColor = getComputedStyle(document.body).getPropertyValue('--secondary'); 4 | var successColor = getComputedStyle(document.body).getPropertyValue('--success'); 5 | var warningColor = getComputedStyle(document.body).getPropertyValue('--warning'); 6 | var dangerColor = getComputedStyle(document.body).getPropertyValue('--danger'); 7 | var infoColor = getComputedStyle(document.body).getPropertyValue('--info'); 8 | var darkColor = getComputedStyle(document.body).getPropertyValue('--dark'); 9 | var lightColor = getComputedStyle(document.body).getPropertyValue('--light'); 10 | 11 | (function($) { 12 | 'use strict'; 13 | $(function() { 14 | var body = $('body'); 15 | var contentWrapper = $('.content-wrapper'); 16 | var scroller = $('.container-scroller'); 17 | var footer = $('.footer'); 18 | var sidebar = $('.sidebar'); 19 | 20 | //Add active class to nav-link based on url dynamically 21 | //Active class can be hard coded directly in html file also as required 22 | 23 | function addActiveClass(element) { 24 | if (current === "") { 25 | //for root url 26 | if (element.attr('href').indexOf("index.html") !== -1) { 27 | element.parents('.nav-item').last().addClass('active'); 28 | if (element.parents('.sub-menu').length) { 29 | element.closest('.collapse').addClass('show'); 30 | element.addClass('active'); 31 | } 32 | } 33 | } else { 34 | //for other url 35 | if (element.attr('href').indexOf(current) !== -1) { 36 | element.parents('.nav-item').last().addClass('active'); 37 | if (element.parents('.sub-menu').length) { 38 | element.closest('.collapse').addClass('show'); 39 | element.addClass('active'); 40 | } 41 | if (element.parents('.submenu-item').length) { 42 | element.addClass('active'); 43 | } 44 | } 45 | } 46 | } 47 | 48 | var current = location.pathname.split("/").slice(-1)[0].replace(/^\/|\/$/g, ''); 49 | $('.nav li a', sidebar).each(function() { 50 | var $this = $(this); 51 | addActiveClass($this); 52 | }) 53 | 54 | $('.horizontal-menu .nav li a').each(function() { 55 | var $this = $(this); 56 | addActiveClass($this); 57 | }) 58 | 59 | //Close other submenu in sidebar on opening any 60 | 61 | sidebar.on('show.bs.collapse', '.collapse', function() { 62 | sidebar.find('.collapse.show').collapse('hide'); 63 | }); 64 | 65 | 66 | //Change sidebar and content-wrapper height 67 | applyStyles(); 68 | 69 | function applyStyles() { 70 | //Applying perfect scrollbar 71 | if (!body.hasClass("rtl")) { 72 | if (body.hasClass("sidebar-fixed")) { 73 | var fixedSidebarScroll = new PerfectScrollbar('#sidebar .nav'); 74 | } 75 | } 76 | } 77 | 78 | $('[data-toggle="minimize"]').on("click", function() { 79 | if ((body.hasClass('sidebar-toggle-display')) || (body.hasClass('sidebar-absolute'))) { 80 | body.toggleClass('sidebar-hidden'); 81 | } else { 82 | body.toggleClass('sidebar-icon-only'); 83 | } 84 | }); 85 | 86 | //checkbox and radios 87 | $(".form-check label,.form-radio label").append(''); 88 | 89 | //fullscreen 90 | $("#fullscreen-button").on("click", function toggleFullScreen() { 91 | if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) { 92 | if (document.documentElement.requestFullScreen) { 93 | document.documentElement.requestFullScreen(); 94 | } else if (document.documentElement.mozRequestFullScreen) { 95 | document.documentElement.mozRequestFullScreen(); 96 | } else if (document.documentElement.webkitRequestFullScreen) { 97 | document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT); 98 | } else if (document.documentElement.msRequestFullscreen) { 99 | document.documentElement.msRequestFullscreen(); 100 | } 101 | } else { 102 | if (document.cancelFullScreen) { 103 | document.cancelFullScreen(); 104 | } else if (document.mozCancelFullScreen) { 105 | document.mozCancelFullScreen(); 106 | } else if (document.webkitCancelFullScreen) { 107 | document.webkitCancelFullScreen(); 108 | } else if (document.msExitFullscreen) { 109 | document.msExitFullscreen(); 110 | } 111 | } 112 | }) 113 | if ($.cookie('purple-free-banner')!="true") { 114 | document.querySelector('#proBanner').classList.add('d-flex'); 115 | document.querySelector('.navbar').classList.remove('fixed-top'); 116 | } 117 | else { 118 | document.querySelector('#proBanner').classList.add('d-none'); 119 | document.querySelector('.navbar').classList.add('fixed-top'); 120 | } 121 | 122 | if ($( ".navbar" ).hasClass( "fixed-top" )) { 123 | document.querySelector('.page-body-wrapper').classList.remove('pt-0'); 124 | document.querySelector('.navbar').classList.remove('pt-5'); 125 | } 126 | else { 127 | document.querySelector('.page-body-wrapper').classList.add('pt-0'); 128 | document.querySelector('.navbar').classList.add('pt-5'); 129 | document.querySelector('.navbar').classList.add('mt-3'); 130 | 131 | } 132 | document.querySelector('#bannerClose').addEventListener('click',function() { 133 | document.querySelector('#proBanner').classList.add('d-none'); 134 | document.querySelector('#proBanner').classList.remove('d-flex'); 135 | document.querySelector('.navbar').classList.remove('pt-5'); 136 | document.querySelector('.navbar').classList.add('fixed-top'); 137 | document.querySelector('.page-body-wrapper').classList.add('proBanner-padding-top'); 138 | document.querySelector('.navbar').classList.remove('mt-3'); 139 | var date = new Date(); 140 | date.setTime(date.getTime() + 24 * 60 * 60 * 1000); 141 | $.cookie('purple-free-banner', "true", { expires: date }); 142 | }); 143 | }); 144 | })(jQuery); -------------------------------------------------------------------------------- /assets/js/off-canvas.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | 'use strict'; 3 | $(function() { 4 | $('[data-toggle="offcanvas"]').on("click", function() { 5 | $('.sidebar-offcanvas').toggleClass('active') 6 | }); 7 | }); 8 | })(jQuery); -------------------------------------------------------------------------------- /assets/js/todo.js: -------------------------------------------------------------------------------- 1 | (function ($) { 2 | 'use strict'; 3 | var $this = $(".todo-list .todo-item"); 4 | $(".todo-list .todo-item:not(.edit-mode)").append('
'); 5 | 6 | $(".edit-icon").on("click", function () { 7 | $(this).parent().addClass("edit-mode"); 8 | $(".todo-list .todo-item button[type='reset']").on("click", function () { 9 | $(this).closest(".todo-item").addClass("edit-mode"); 10 | }); 11 | }); 12 | 13 | })(jQuery); -------------------------------------------------------------------------------- /assets/js/todolist.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | 'use strict'; 3 | $(function() { 4 | var todoListItem = $('.todo-list'); 5 | var todoListInput = $('.todo-list-input'); 6 | $('.todo-list-add-btn').on("click", function(event) { 7 | event.preventDefault(); 8 | 9 | var item = $(this).prevAll('.todo-list-input').val(); 10 | 11 | if (item) { 12 | todoListItem.append("
    • "); 13 | todoListInput.val(""); 14 | } 15 | 16 | }); 17 | 18 | todoListItem.on('change', '.checkbox', function() { 19 | if ($(this).attr('checked')) { 20 | $(this).removeAttr('checked'); 21 | } else { 22 | $(this).attr('checked', 'checked'); 23 | } 24 | 25 | $(this).closest("li").toggleClass('completed'); 26 | 27 | }); 28 | 29 | todoListItem.on('click', '.remove', function() { 30 | $(this).parent().remove(); 31 | }); 32 | 33 | }); 34 | })(jQuery); -------------------------------------------------------------------------------- /assets/scss/_dashboard.scss: -------------------------------------------------------------------------------- 1 | /* Dashboard */ 2 | 3 | .card-statistics { 4 | .highlight-icon { 5 | height: 53px; 6 | width: 53px; 7 | display: flex; 8 | align-items: center; 9 | justify-content: center; 10 | border-radius: 50px; 11 | 12 | i { 13 | font-size: 27px; 14 | } 15 | } 16 | 17 | .card-col { 18 | border-right: 1px solid $border-color; 19 | 20 | &:last-child { 21 | border-right: none; 22 | } 23 | 24 | @include media-breakpoint-down(sm) { 25 | padding-left: 0; 26 | padding-right: 0; 27 | position: relative; 28 | border: none; 29 | 30 | &:first-child, 31 | &:nth-child(2), 32 | &:nth-child(3) { 33 | 34 | &:after, 35 | &:before { 36 | content: ""; 37 | position: absolute; 38 | background: $border-color; 39 | } 40 | } 41 | 42 | &:first-child { 43 | &:before { 44 | bottom: 0; 45 | width: 94.2%; 46 | height: 1px; 47 | right: 0; 48 | } 49 | 50 | &:after { 51 | bottom: 0; 52 | width: 1px; 53 | height: 100%; 54 | right: 0; 55 | } 56 | } 57 | 58 | &:nth-child(2) { 59 | &:before { 60 | bottom: 0; 61 | width: 94.2%; 62 | height: 1px; 63 | left: 0; 64 | } 65 | } 66 | 67 | &:nth-child(3) { 68 | &:before { 69 | width: 1px; 70 | height: 100%; 71 | right: 0; 72 | } 73 | } 74 | } 75 | } 76 | } 77 | 78 | .card-revenue-table { 79 | .revenue-item { 80 | border-bottom: 1px solid $border-color; 81 | @extend .py-3; 82 | 83 | &:last-child { 84 | border-bottom: 0; 85 | @extend .pb-0; 86 | } 87 | 88 | &:first-child { 89 | @extend .pt-0; 90 | } 91 | 92 | .revenue-desc { 93 | margin-right: auto; 94 | width: 80%; 95 | 96 | p { 97 | margin-bottom: 0; 98 | } 99 | } 100 | 101 | .revenue-amount { 102 | margin-left: auto; 103 | width: 40%; 104 | 105 | p { 106 | font-size: 1.25rem; 107 | font-family: $type-1; 108 | font-weight: 600; 109 | text-align: right; 110 | 111 | .rtl & { 112 | text-align: left; 113 | } 114 | } 115 | } 116 | } 117 | } 118 | 119 | .card-revenue { 120 | background: linear-gradient(120deg, #556cdc, #128bfc, #18bef1); 121 | background-size: cover; 122 | color: color(white); 123 | 124 | .highlight-text { 125 | font-size: 1.875rem; 126 | font-family: $type-1; 127 | font-weight: 500; 128 | } 129 | 130 | .badge { 131 | background-color: rgba($white, .2); 132 | font-size: 1.125rem; 133 | padding: 0.5rem 1.25rem; 134 | } 135 | } 136 | 137 | .product-chart-wrapper { 138 | height: 92%; 139 | } 140 | 141 | #dashboardTrendingProgress { 142 | width: 60px; 143 | } 144 | 145 | .dashboard-bar-chart-legend { 146 | .col { 147 | text-align: center; 148 | display: flex; 149 | align-items: center; 150 | flex-direction: column; 151 | 152 | .bg { 153 | margin-left: auto; 154 | margin-right: auto; 155 | height: 5px; 156 | width: 30px; 157 | display: block; 158 | margin-top: 5px; 159 | } 160 | 161 | &:nth-child(1) { 162 | .bg { 163 | background: $info; 164 | } 165 | } 166 | 167 | &:nth-child(2) { 168 | .bg { 169 | background: $primary; 170 | } 171 | } 172 | 173 | &:nth-child(3) { 174 | .bg { 175 | background: $danger; 176 | } 177 | } 178 | } 179 | } 180 | 181 | .intro-banner { 182 | background: #dbe4ec; 183 | display: flex; 184 | align-items: center; 185 | padding: 20px; 186 | border-radius: 2px; 187 | 188 | .banner-image { 189 | width: 24%; 190 | max-width: 100%; 191 | 192 | img { 193 | display: block; 194 | margin: auto; 195 | } 196 | } 197 | 198 | .content-area { 199 | width: 58%; 200 | color: $black; 201 | display: flex; 202 | flex-direction: column; 203 | align-items: end; 204 | } 205 | } 206 | 207 | .sales-mini-tabs { 208 | border-bottom: none; 209 | 210 | .nav-item { 211 | .nav-link { 212 | border: none; 213 | font-weight: 500; 214 | padding: 5px 15px; 215 | border-radius: 2px; 216 | transition-duration: 0.7s; 217 | transition-property: "color"; 218 | 219 | &.active { 220 | font-weight: 600; 221 | background: lighten($card-bg-varient, 4%); 222 | color: $primary; 223 | } 224 | } 225 | } 226 | } 227 | 228 | .purchase-popup { 229 | @extend .grid-margin; 230 | background: #fff; 231 | padding: 15px 20px; 232 | @include border-radius(3px); 233 | 234 | .btn { 235 | margin-right: 20px; 236 | font-weight: 500; 237 | color: $white; 238 | @include border-radius(5px); 239 | @include transition-duration(0.2s); 240 | 241 | &.download-button { 242 | background: rgba(249, 249, 249, 0.7); 243 | color: #969292; 244 | border: 1px solid darken(#e4e4e4,5%); 245 | } 246 | 247 | &.purchase-button { 248 | background-color: rgba(172, 50 ,228, 0.9); 249 | @include background-image(theme-gradient-color(primary)); 250 | color: $white; 251 | border: none; 252 | line-height: 1; 253 | vertical-align: middle; 254 | } 255 | } 256 | 257 | p { 258 | margin-bottom: auto; 259 | margin-top: auto; 260 | color: darken(#e4e4e4,40%); 261 | font-weight: 400; 262 | vertical-align: middle; 263 | line-height: 1; 264 | } 265 | 266 | i { 267 | vertical-align: middle; 268 | line-height: 1; 269 | margin: auto 0; 270 | color: darken(#e4e4e4,20%); 271 | } 272 | } -------------------------------------------------------------------------------- /assets/scss/_demo.scss: -------------------------------------------------------------------------------- 1 | /* Demo Styles */ 2 | // Add spacing to Boostrap components for demo purpose 3 | .template-demo { 4 | > .btn { 5 | @extend .mt-3; 6 | @extend .me-3; 7 | } 8 | 9 | .slider-wrap { 10 | height: 100px; 11 | } 12 | 13 | > .btn-toolbar { 14 | @extend .mt-3; 15 | @extend .me-3; 16 | } 17 | 18 | > .btn-group, 19 | > .btn-group-vertical { 20 | @extend .mt-2; 21 | @extend .me-2; 22 | } 23 | 24 | .progress { 25 | margin-top: 1.5rem; 26 | } 27 | 28 | .circle-progress { 29 | @extend .mt-2; 30 | } 31 | 32 | > h2, 33 | > h3, 34 | > h4, 35 | > h5, 36 | > h6, 37 | > h1 { 38 | border-top: 1px solid $border-color; 39 | padding: 0.5rem 0 0; 40 | } 41 | 42 | .ul-slider { 43 | &.noUi-horizontal { 44 | margin-top: 2rem; 45 | } 46 | 47 | &.noUi-vertical { 48 | margin-right: 2rem; 49 | } 50 | } 51 | 52 | > .dropdown { 53 | display: inline-block; 54 | @extend .me-2; 55 | margin-bottom: 0.5rem; 56 | } 57 | 58 | nav { 59 | .breadcrumb { 60 | margin-bottom: 1.375rem; 61 | } 62 | 63 | &:last-child { 64 | .breadcrumb { 65 | margin-bottom: 0; 66 | } 67 | } 68 | } 69 | 70 | .editable-form { 71 | > .form-group { 72 | border-bottom: 1px solid $border-color; 73 | padding-bottom: 0.8rem; 74 | margin-bottom: 0.8rem; 75 | } 76 | } 77 | 78 | .circle-progress { 79 | padding: 15px; 80 | } 81 | 82 | .circle-progress-block { 83 | @extend .mb-3; 84 | @extend .px-2; 85 | } 86 | } 87 | 88 | .demo-modal { 89 | position: static; 90 | display: block; 91 | 92 | .modal-dialog { 93 | @extend .mt-0; 94 | 95 | &.modal-lg { 96 | max-width: 100%; 97 | } 98 | } 99 | } 100 | 101 | .loader-demo-box { 102 | @extend .border; 103 | @extend .border-secondary; 104 | @extend .rounded; 105 | width: 100%; 106 | height: 200px; 107 | @extend .d-flex; 108 | @extend .align-items-center; 109 | } 110 | 111 | .dropdown-menu-static-demo { 112 | height: 250px; 113 | margin-bottom: 20px; 114 | } 115 | 116 | .rounded-legend { 117 | ul { 118 | li { 119 | list-style-type: none; 120 | color: $text-muted; 121 | font-size: .75rem; 122 | .legend-dots { 123 | width: 1rem; 124 | height: 1rem; 125 | border-radius: 100%; 126 | display: inline-block; 127 | vertical-align: text-bottom; 128 | margin-right: .5rem; 129 | .rtl & { 130 | margin-left: .5rem; 131 | } 132 | } 133 | } 134 | } 135 | &.legend-horizontal { 136 | @include display-flex; 137 | ul { 138 | li { 139 | display: inline-block; 140 | margin-right: 1.5rem; 141 | .rtl & { 142 | margin-right: auto; 143 | margin-left: 1.5rem; 144 | } 145 | } 146 | } 147 | } 148 | &.legend-top-right { 149 | ul { 150 | float: right; 151 | .rtl & { 152 | float: left; 153 | } 154 | } 155 | } 156 | &.legend-vertical { 157 | ul { 158 | li { 159 | margin-top: 1rem; 160 | } 161 | } 162 | } 163 | } 164 | #proBanner { 165 | position: fixed; 166 | left: 0; 167 | top: 0; 168 | width: 100%; 169 | z-index: 9999; 170 | background: #000; 171 | .card-body-padding { 172 | padding-top: .5rem ; 173 | padding-bottom: .5rem; 174 | padding-left: 2rem; 175 | padding-right: 2rem; 176 | @media (max-width: 766px) { 177 | padding-left: 1rem; 178 | padding-right: 1rem; 179 | } 180 | } 181 | .buy-now-text { 182 | color: $white; 183 | @media (max-width: 766px) { 184 | font-size: 10px; 185 | line-height: 1.5; 186 | } 187 | } 188 | .btn { 189 | &.buy-now-btn { 190 | background: transparent; 191 | color: #88b6ff; 192 | border-radius: 10px; 193 | // padding: 0.625rem 1.25rem; 194 | padding: 1rem 0; 195 | border-radius: 4px; 196 | font-weight: bold; 197 | font-size: 1rem; 198 | @media (max-width: 766px) { 199 | min-width: 80px; 200 | padding: 1rem .5rem; 201 | font-size: 12px; 202 | } 203 | } 204 | &#bannerClose { 205 | i { 206 | margin-right: 1rem; 207 | font-size: 1.25rem; 208 | @media (max-width: 766px) { 209 | font-size: 1rem; 210 | margin-right: 0; 211 | } 212 | } 213 | } 214 | } 215 | a { 216 | text-decoration: none; 217 | i { 218 | font-size: 1.25rem; 219 | @media (max-width: 766px) { 220 | font-size: 1rem; 221 | } 222 | } 223 | } 224 | 225 | } 226 | .proBanner-padding-top { 227 | padding-top: $buy-nowbanner-padding-top !important; 228 | } -------------------------------------------------------------------------------- /assets/scss/_fonts.scss: -------------------------------------------------------------------------------- 1 | /* Fonts */ 2 | 3 | //PT_Sans 4 | @font-face { 5 | font-family: 'ubuntu-light'; 6 | src: url('../fonts/Ubuntu/Ubuntu-Light.eot'); /* IE9 Compat Modes */ 7 | src: url('../fonts/Ubuntu/Ubuntu-Light.woff2') format('woff2'), /* Super Modern Browsers */ 8 | url('../fonts/Ubuntu/Ubuntu-Light.woff') format('woff'), /* Pretty Modern Browsers */ 9 | url('../fonts/Ubuntu/Ubuntu-Light.ttf') format('truetype'), /* Safari, Android, iOS */ 10 | } 11 | @font-face { 12 | font-family: 'ubuntu-regular'; 13 | src: url('../fonts/Ubuntu/Ubuntu-Regular.eot'); /* IE9 Compat Modes */ 14 | src: url('../fonts/Ubuntu/Ubuntu-Regular.woff2') format('woff2'), /* Super Modern Browsers */ 15 | url('../fonts/Ubuntu/Ubuntu-Regular.woff') format('woff'), /* Pretty Modern Browsers */ 16 | url('../fonts/Ubuntu/Ubuntu-Regular.ttf') format('truetype'), /* Safari, Android, iOS */ 17 | } 18 | @font-face { 19 | font-family: 'ubuntu-medium'; 20 | src: url('../fonts/Ubuntu/Ubuntu-Medium.eot'); /* IE9 Compat Modes */ 21 | src: url('../fonts/Ubuntu/Ubuntu-Medium.woff2') format('woff2'), /* Super Modern Browsers */ 22 | url('../fonts/Ubuntu/Ubuntu-Medium.woff') format('woff'), /* Pretty Modern Browsers */ 23 | url('../fonts/Ubuntu/Ubuntu-Medium.ttf') format('truetype'), /* Safari, Android, iOS */ 24 | } 25 | @font-face { 26 | font-family: 'ubuntu-bold'; 27 | src: url('../fonts/Ubuntu/Ubuntu-Bold.eot'); /* IE9 Compat Modes */ 28 | src: url('../fonts/Ubuntu/Ubuntu-Bold.woff2') format('woff2'), /* Super Modern Browsers */ 29 | url('../fonts/Ubuntu/Ubuntu-Bold.woff') format('woff'), /* Pretty Modern Browsers */ 30 | url('../fonts/Ubuntu/Ubuntu-Bold.ttf') format('truetype'), /* Safari, Android, iOS */ 31 | } 32 | -------------------------------------------------------------------------------- /assets/scss/_footer.scss: -------------------------------------------------------------------------------- 1 | /* Footer */ 2 | 3 | .footer { 4 | background: $footer-bg; 5 | color: $footer-color; 6 | border-top: 1px solid darken($footer-bg, 5%); 7 | padding: 30px 1rem; 8 | transition: all $action-transition-duration $action-transition-timing-function; 9 | -moz-transition: all $action-transition-duration $action-transition-timing-function; 10 | -webkit-transition: all $action-transition-duration $action-transition-timing-function; 11 | -ms-transition: all $action-transition-duration $action-transition-timing-function; 12 | font-size: calc(#{$default-font-size} - 0.05rem); 13 | font-family: $type1-regular; 14 | a { 15 | color: $success; 16 | font-size: inherit; 17 | } 18 | @media (max-width: 991px) { 19 | margin-left: 0; 20 | width: 100%; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /assets/scss/_functions.scss: -------------------------------------------------------------------------------- 1 | // Functions 2 | @function social-color($key: "twitter") { 3 | @return map-get($social-colors, $key); 4 | } 5 | 6 | @function theme-gradient-color($key: "primary") { 7 | @return map-get($theme-gradient-colors, $key); 8 | } 9 | // Social Color 10 | @each $color, $value in $social-colors { 11 | .text-#{$color} { 12 | @include text-color(social-color($color)); 13 | } 14 | } 15 | @each $color, $value in $social-colors { 16 | .bg-#{$color} { 17 | background: social-color($color); 18 | } 19 | } -------------------------------------------------------------------------------- /assets/scss/_layouts.scss: -------------------------------------------------------------------------------- 1 | /* Layouts */ 2 | 3 | .navbar { 4 | &.fixed-top { 5 | + .page-body-wrapper { 6 | padding-top: $navbar-height; 7 | } 8 | } 9 | } 10 | 11 | // Sidebar Icon Only 12 | .sidebar-icon-only { 13 | @media (min-width: 992px) { 14 | .navbar { 15 | .navbar-brand-wrapper { 16 | width: $sidebar-width-icon; 17 | .brand-logo { 18 | display: none; 19 | } 20 | .brand-logo-mini { 21 | display: inline-block; 22 | } 23 | } 24 | .navbar-menu-wrapper { 25 | width: calc(100% - #{$sidebar-width-icon}); 26 | } 27 | } 28 | .sidebar { 29 | width: $sidebar-width-icon; 30 | .nav { 31 | overflow: visible; 32 | .nav-item { 33 | position: relative; 34 | padding: 0; 35 | .nav-link { 36 | display: block; 37 | text-align: center; 38 | .menu-title, 39 | .badge,.menu-sub-title { 40 | display: none; 41 | } 42 | .menu-title { 43 | @include border-radius(0 5px 5px 0px); 44 | @at-root #{selector-append(".rtl", &)} { 45 | @include border-radius(5px 0 0 5px); 46 | } 47 | } 48 | i { 49 | &.menu-icon { 50 | margin-right: 0; 51 | margin-left: 0; 52 | } 53 | &.menu-arrow { 54 | display: none; 55 | } 56 | } 57 | &[aria-expanded] { 58 | .menu-title{ 59 | @include border-radius(0 5px 0 0px); 60 | @at-root #{selector-append(".rtl", &)} { 61 | @include border-radius(5px 0 0 0); 62 | } 63 | } 64 | } 65 | } 66 | &.nav-profile { 67 | display: none; 68 | } 69 | &.nav-category { 70 | display: none; 71 | } 72 | &.nav-doc { 73 | margin: 0; 74 | i { 75 | display: block; 76 | } 77 | } 78 | .collapse { 79 | display: none; 80 | } 81 | &.hover-open { 82 | .nav-link { 83 | .menu-title { 84 | @include display-flex; 85 | @include align-items(center); 86 | background: $icon-only-menu-bg-light; 87 | padding: 0.5rem 1.4rem; 88 | left: $sidebar-width-icon; 89 | position: absolute; 90 | text-align: left; 91 | top: 0; 92 | bottom: 0; 93 | width: $icon-only-collapse-width; 94 | z-index: 1; 95 | line-height: 1.8; 96 | @at-root #{selector-append(".rtl", &)} { 97 | left: auto; 98 | right: $sidebar-width-icon; 99 | text-align: left; 100 | } 101 | &:after { 102 | display: none; 103 | } 104 | } 105 | } 106 | .collapse, 107 | .collapsing { 108 | display: block; 109 | padding: .5rem 0; 110 | background: $icon-only-menu-bg-light; 111 | @include border-radius(0 0 5px 0); 112 | position: absolute; 113 | left: $sidebar-width-icon; 114 | width: $icon-only-collapse-width; 115 | @at-root #{selector-append(".rtl", &)} { 116 | left: auto; 117 | right:$sidebar-width-icon; 118 | @include border-radius(0 0 0 5px); 119 | } 120 | } 121 | } 122 | } 123 | &.sub-menu { 124 | padding: $sidebar-icon-only-submenu-padding; 125 | .nav-item { 126 | .nav-link { 127 | text-align: left; 128 | padding-left: 20px; 129 | } 130 | } 131 | @at-root #{selector-append(".rtl", &)} { 132 | .nav-item { 133 | margin-right: auto; 134 | margin-left: 0; 135 | .nav-link { 136 | text-align: right; 137 | &:before{ 138 | left: 0; 139 | right: unset; 140 | } 141 | } 142 | } 143 | } 144 | } 145 | } 146 | .sidebar-actions { 147 | display: none; 148 | } 149 | } 150 | 151 | .main-panel { 152 | width: calc(100% - #{$sidebar-width-icon}); 153 | } 154 | } 155 | } 156 | 157 | //RTL layout 158 | .rtl { 159 | direction: rtl; 160 | text-align: right; 161 | 162 | .sidebar { 163 | .nav { 164 | padding-right: 0; 165 | } 166 | } 167 | 168 | .product-chart-wrapper, 169 | .sidebar-fixed .nav, 170 | .table-responsive, 171 | ul.chats { 172 | &::-webkit-scrollbar { 173 | width: 0.5em; 174 | } 175 | 176 | &::-webkit-scrollbar-track { 177 | -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 178 | } 179 | 180 | &::-webkit-scrollbar-thumb { 181 | background-color: darkgrey; 182 | outline: 1px solid slategrey; 183 | } 184 | } 185 | } 186 | -------------------------------------------------------------------------------- /assets/scss/_misc.scss: -------------------------------------------------------------------------------- 1 | /* Miscellanoeous */ 2 | body, 3 | html { 4 | overflow-x: hidden; 5 | padding-right: 0 !important; // resets padding right added by Bootstrap modal 6 | } 7 | 8 | *:-moz-full-screen, 9 | *:-webkit-full-screen, 10 | *:fullscreen *:-ms-fullscreen { 11 | overflow: auto; 12 | } 13 | 14 | .container-scroller { 15 | overflow: hidden; 16 | } 17 | 18 | pre { 19 | background: color(gray-lighter); 20 | padding: 15px; 21 | font-size: 14px; 22 | } 23 | 24 | code { 25 | padding: 5px; 26 | color: $danger; 27 | font-family: $type1-light; 28 | font-size: $default-font-size; 29 | border-radius: 4px; 30 | } 31 | 32 | .page-header { 33 | @extend .d-flex; 34 | @extend .justify-content-between; 35 | @extend .align-items-center; 36 | margin: 0 0 1.5rem 0; 37 | .breadcrumb { 38 | border: 0; 39 | margin-bottom: 0; 40 | } 41 | } 42 | .page-title { 43 | color: $page-title-color; 44 | font-size: 1.125rem; 45 | margin-bottom: 0; 46 | .page-title-icon { 47 | display: inline-block; 48 | width: 36px; 49 | height: 36px; 50 | border-radius: 4px; 51 | text-align: center; 52 | box-shadow: 0px 3px 8.3px 0.7px rgba(163, 93, 255, 0.35); 53 | i { 54 | font-size: .9375rem; 55 | line-height: 36px; 56 | } 57 | } 58 | } -------------------------------------------------------------------------------- /assets/scss/_navbar.scss: -------------------------------------------------------------------------------- 1 | /* Navbar */ 2 | 3 | .navbar { 4 | font-family: $type1-light; 5 | background: $navbar-bg; 6 | transition:background $action-transition-duration $action-transition-timing-function; 7 | -webkit-transition:background $action-transition-duration $action-transition-timing-function; 8 | -moz-transition:background $action-transition-duration $action-transition-timing-function; 9 | -ms-transition:background $action-transition-duration $action-transition-timing-function; 10 | 11 | .navbar-brand { 12 | width: 110px; 13 | } 14 | .navbar-brand-wrapper { 15 | transition: width $action-transition-duration $action-transition-timing-function, background $action-transition-duration $action-transition-timing-function; 16 | -webkit-transition: width $action-transition-duration $action-transition-timing-function, background $action-transition-duration $action-transition-timing-function; 17 | -moz-transition: width $action-transition-duration $action-transition-timing-function, background $action-transition-duration $action-transition-timing-function; 18 | -ms-transition: width $action-transition-duration $action-transition-timing-function, background $action-transition-duration $action-transition-timing-function; 19 | background: $navbar-bg; 20 | width: $sidebar-width-lg; 21 | height: $navbar-height; 22 | @media (max-width: 991px) { 23 | width: 55px; 24 | } 25 | .navbar-brand { 26 | color: lighten($gray-dark, 20%); 27 | font-size: 1.5rem; 28 | line-height: 48px; 29 | margin-right: 0; 30 | padding: .25rem 0; 31 | width: 100%; 32 | 33 | &:active, 34 | &:focus, 35 | &:hover { 36 | color: lighten($gray-dark, 10%); 37 | } 38 | 39 | img { 40 | width: calc(#{$sidebar-width-lg} - 120px ); 41 | max-width: 100%; 42 | height: 28px; 43 | margin: auto; 44 | vertical-align: middle; 45 | } 46 | &.brand-logo-mini { 47 | display: none; 48 | img { 49 | width: calc(#{$sidebar-width-icon} - 50px ); 50 | max-width: 100%; 51 | height: 28px; 52 | margin: auto; 53 | } 54 | } 55 | } 56 | } 57 | .navbar-menu-wrapper { 58 | transition: width $action-transition-duration $action-transition-timing-function; 59 | -webkit-transition: width $action-transition-duration $action-transition-timing-function; 60 | -moz-transition: width $action-transition-duration $action-transition-timing-function; 61 | -ms-transition: width $action-transition-duration $action-transition-timing-function; 62 | color: $navbar-menu-color; 63 | padding-left: 24px; 64 | padding-right: 24px; 65 | width: calc(100% - #{$sidebar-width-lg}); 66 | height: $navbar-height; 67 | @media (max-width: 991px) { 68 | width: auto; 69 | padding-left: 15px; 70 | padding-right: 15px; 71 | } 72 | 73 | .navbar-toggler { 74 | border: 0; 75 | color: inherit; 76 | height: $navbar-height; 77 | @include border-radius(0px); 78 | padding-left: 5px; 79 | padding-right: 20px; 80 | &:focus { 81 | box-shadow: none; 82 | } 83 | &:not(.navbar-toggler-right) { 84 | font-size: 1.5rem; 85 | @media (max-width: 991px) { 86 | display: none; 87 | } 88 | } 89 | &.navbar-toggler-right{ 90 | @media (max-width:991px){ 91 | padding-left: 15px; 92 | padding-right: 11px; 93 | border-right: none; 94 | } 95 | } 96 | } 97 | 98 | .search-field { 99 | .input-group { 100 | input { 101 | font-size: $default-font-size; 102 | padding: .5rem; 103 | @include input-placeholder { 104 | font-size: $navbar-font-size; 105 | color: $navbar-menu-color; 106 | font-family: $type1-light; 107 | } 108 | } 109 | i { 110 | font-size: 17px; 111 | margin-right: 0; 112 | color: $navbar-menu-color; 113 | } 114 | .input-group-text { 115 | background: transparent; 116 | } 117 | } 118 | .rtl & { 119 | @extend .ms-0; 120 | @extend .me-4; 121 | } 122 | } 123 | 124 | .count-indicator { 125 | position: relative; 126 | 127 | .count-symbol, 128 | .count-number { 129 | position: absolute; 130 | border-radius: 100%; 131 | border: 2px solid $white; 132 | } 133 | .count-symbol { 134 | top: 17px; 135 | right: -3px; 136 | width: 10px; 137 | height: 10px; 138 | } 139 | .count-number { 140 | min-width: 14px; 141 | height: 14px; 142 | font-size: .5rem; 143 | color: $white; 144 | bottom: 16px; 145 | right: -5px; 146 | line-height: 1; 147 | text-align: center; 148 | } 149 | &:after { 150 | display: none; 151 | } 152 | } 153 | .navbar-nav { 154 | flex-direction: row; 155 | align-items: center; 156 | .nav-item { 157 | .nav-link { 158 | color: inherit; 159 | font-size: $navbar-font-size; 160 | margin-left: 1.5rem; 161 | margin-right: 1.5rem; 162 | height: $navbar-height; 163 | @include display-flex; 164 | @include align-items(center); 165 | @media (max-width: 767px) { 166 | margin-left: .8rem; 167 | margin-right: .8rem; 168 | } 169 | i { 170 | font-size: $navbar-icon-font-size; 171 | } 172 | } 173 | &.dropdown { 174 | .dropdown-toggle { 175 | &:after { 176 | color: $primary; 177 | font-size: 1rem; 178 | } 179 | } 180 | .dropdown-menu { 181 | @extend .dropdownAnimation; 182 | border: none; 183 | @include border-radius(5px); 184 | -webkit-box-shadow: 0px 3px 21px 0px rgba(0, 0, 0, 0.2); 185 | -moz-box-shadow: 0px 3px 21px 0px rgba(0, 0, 0, 0.2); 186 | box-shadow: 0px 3px 21px 0px rgba(0, 0, 0, 0.2); 187 | &.navbar-dropdown { 188 | position: absolute; 189 | font-size: 0.9rem; 190 | margin-top: 0; 191 | .rtl & { 192 | right: auto; 193 | left: 0; 194 | } 195 | padding: 0; 196 | 197 | .dropdown-item { 198 | @extend .d-flex; 199 | @extend .align-items-center; 200 | margin-bottom: 0; 201 | padding: 11px 13px; 202 | cursor: pointer; 203 | 204 | i { 205 | font-size: 17px; 206 | } 207 | 208 | .ellipsis { 209 | max-width: 200px; 210 | overflow: hidden; 211 | text-overflow: ellipsis; 212 | } 213 | .rtl & { 214 | i{ 215 | @extend .me-0; 216 | margin-left: 10px; 217 | } 218 | } 219 | } 220 | 221 | .dropdown-divider { 222 | margin: 0; 223 | } 224 | } 225 | } 226 | @media (max-width: 991px) { 227 | position: static; 228 | .navbar-dropdown { 229 | left: 20px; 230 | right: 20px; 231 | top: $navbar-height; 232 | width: calc(100% - 40px); 233 | } 234 | } 235 | } 236 | &.nav-settings { 237 | padding-left: 20px; 238 | padding-right: 5px; 239 | .nav-link{ 240 | margin-right: 0; 241 | margin-left: 0; 242 | } 243 | } 244 | &.nav-profile { 245 | .nav-link { 246 | @extend .d-flex; 247 | .nav-profile-img { 248 | position: relative; 249 | width: 32px; 250 | height: 32px; 251 | img { 252 | width: 32px; 253 | height: 32px; 254 | border-radius: 100%; 255 | } 256 | .availability-status { 257 | position: absolute; 258 | width: 10px; 259 | height: 10px; 260 | border-radius: 100%; 261 | border: 2px solid #ffffff; 262 | bottom: 5px; 263 | right: -5px; 264 | &.online { 265 | background: $success; 266 | } 267 | &.offline { 268 | background: $danger; 269 | } 270 | &.busy { 271 | background: $warning; 272 | } 273 | } 274 | } 275 | .nav-profile-text { 276 | margin-left: 1.25rem; 277 | .rtl & { 278 | margin-left: 0; 279 | margin-right: 1.25rem; 280 | } 281 | p { 282 | line-height: 1; 283 | } 284 | @media (max-width: 767px) { 285 | display: none; 286 | } 287 | } 288 | &.dropdown-toggle { 289 | &:after { 290 | line-height: 2; 291 | } 292 | } 293 | } 294 | } 295 | } 296 | &.navbar-nav-right { 297 | @media (min-width: 992px) { 298 | margin-left: auto; 299 | .rtl & { 300 | margin-left: 0; 301 | margin-right: auto; 302 | } 303 | } 304 | } 305 | } 306 | } 307 | } 308 | @media (max-width:991px) { 309 | .navbar { 310 | flex-direction: row; 311 | .navbar-brand-wrapper { 312 | width: 75px; 313 | .navbar-brand { 314 | &.brand-logo { 315 | display: none; 316 | } 317 | &.brand-logo-mini { 318 | display: inline-block; 319 | } 320 | } 321 | } 322 | } 323 | 324 | .navbar-collapse { 325 | display: flex; 326 | margin-top: 0.5rem; 327 | } 328 | } 329 | 330 | @media (max-width:480px) { 331 | .navbar { 332 | .navbar-brand-wrapper { 333 | width: 55px; 334 | .brand-logo-mini{ 335 | padding-top: 0px; 336 | } 337 | } 338 | } 339 | } 340 | 341 | /* Navbar color variations */ 342 | @each $color, $value in $theme-gradient-colors { 343 | .navbar { 344 | &.navbar-#{$color} { 345 | .navbar-menu-wrapper { 346 | background: $value; 347 | color: $white; 348 | .nav-profile-text { 349 | p { 350 | @extend .text-white; 351 | } 352 | } 353 | .search-field { 354 | .input-group { 355 | input { 356 | @include input-placeholder { 357 | color: $white; 358 | } 359 | } 360 | i { 361 | color: $white; 362 | } 363 | } 364 | } 365 | } 366 | } 367 | } 368 | } -------------------------------------------------------------------------------- /assets/scss/_reset.scss: -------------------------------------------------------------------------------- 1 | /* Reset Styles */ 2 | 3 | body { 4 | padding: 0; 5 | margin: 0; 6 | overflow-x: hidden; 7 | } 8 | 9 | .form-control, 10 | .form-control:focus { 11 | -webkit-box-shadow: none; 12 | -moz-box-shadow: none 13 | } 14 | 15 | .form-control { 16 | box-shadow: none 17 | } 18 | 19 | .form-control:focus { 20 | outline: 0; 21 | box-shadow: none 22 | } 23 | 24 | a, 25 | div, 26 | h1, 27 | h2, 28 | h3, 29 | h4, 30 | h5, 31 | p, 32 | span { 33 | text-shadow: none 34 | } 35 | 36 | [type=button]:focus, 37 | a:active, 38 | a:focus, 39 | a:visited, 40 | button::-moz-focus-inner, 41 | input[type=reset]::-moz-focus-inner, 42 | input[type=button]::-moz-focus-inner, 43 | input[type=submit]::-moz-focus-inner, 44 | input[type=file]>input[type=button]::-moz-focus-inner, 45 | select::-moz-focus-inner { 46 | outline: 0 47 | } 48 | 49 | input, 50 | .form-control:focus, 51 | input:focus, 52 | select:focus, 53 | textarea:focus, 54 | button:focus { 55 | outline: none; 56 | outline-width: 0; 57 | outline-color: transparent; 58 | box-shadow: none; 59 | outline-style: none; 60 | } 61 | 62 | textarea { 63 | resize: none; 64 | overflow-x: hidden; 65 | } 66 | 67 | .btn, 68 | .btn-group.open .dropdown-toggle, 69 | .btn:active, 70 | .btn:focus, 71 | .btn:hover, 72 | .btn:visited, 73 | a, 74 | a:active, 75 | a:checked, 76 | a:focus, 77 | a:hover, 78 | a:visited, 79 | body, 80 | button, 81 | button:active, 82 | button:hover, 83 | button:visited, 84 | div, 85 | input, 86 | input:active, 87 | input:focus, 88 | input:hover, 89 | input:visited, 90 | select, 91 | select:active, 92 | select:focus, 93 | select:visited, 94 | textarea, 95 | textarea:active, 96 | textarea:focus, 97 | textarea:hover, 98 | textarea:visited { 99 | -webkit-box-shadow: none; 100 | -moz-box-shadow: none; 101 | box-shadow: none 102 | } 103 | 104 | .btn.active.focus, 105 | .btn.active:focus, 106 | .btn.focus, 107 | .btn:active.focus, 108 | .btn:active:focus, 109 | .btn:focus, 110 | button, 111 | button:active, 112 | button:checked, 113 | button:focus, 114 | button:hover, 115 | button:visited { 116 | outline: 0; 117 | outline-offset: 0 118 | } 119 | 120 | .bootstrap-select .dropdown-toggle:focus { 121 | outline: 0 ; 122 | outline-offset: 0; 123 | } 124 | 125 | .dropdown-menu>li>a:active, 126 | .dropdown-menu>li>a:focus, 127 | .dropdown-menu>li>a:hover, 128 | .dropdown-menu>li>a:visited { 129 | outline: 0; 130 | } 131 | 132 | a:focus, 133 | input:focus { 134 | border-color: transparent; 135 | outline: none 136 | } 137 | -------------------------------------------------------------------------------- /assets/scss/_sidebar.scss: -------------------------------------------------------------------------------- 1 | /* Sidebar */ 2 | 3 | .sidebar { 4 | min-height: calc(100vh - #{$navbar-height}); 5 | background: $sidebar-light-bg; 6 | font-family: $type1-regular; 7 | padding: 0; 8 | width: $sidebar-width-lg; 9 | z-index: 11; 10 | transition: width $action-transition-duration $action-transition-timing-function, background $action-transition-duration $action-transition-timing-function; 11 | -webkit-transition: width $action-transition-duration $action-transition-timing-function, background $action-transition-duration $action-transition-timing-function; 12 | -moz-transition: width $action-transition-duration $action-transition-timing-function, background $action-transition-duration $action-transition-timing-function; 13 | -ms-transition: width $action-transition-duration $action-transition-timing-function, background $action-transition-duration $action-transition-timing-function; 14 | 15 | .nav { 16 | overflow: hidden; 17 | flex-wrap: nowrap; 18 | flex-direction: column; 19 | margin-bottom: 60px; 20 | 21 | .nav-item { 22 | padding:0 $sidebar-menu-padding-x; 23 | @include transition-duration(0.25s); 24 | transition-property: background; 25 | -webkit-transition-property: background; 26 | .collapse { 27 | z-index: 999; 28 | } 29 | 30 | .nav-link { 31 | @include display-flex; 32 | @include align-items(center); 33 | white-space: nowrap; 34 | padding:$sidebar-menu-padding-y 0 $sidebar-menu-padding-y 0; 35 | color: $sidebar-light-menu-color; 36 | @include transition-duration(0.45s); 37 | transition-property: color; 38 | -webkit-transition-property: color; 39 | 40 | i { 41 | color: inherit; 42 | 43 | &.menu-icon { 44 | font-size: $sidebar-icon-font-size; 45 | line-height: 1; 46 | margin-left: auto; 47 | .rtl & { 48 | margin-left: 0; 49 | margin-right: auto; 50 | } 51 | color: $sidebar-light-menu-icon-color; 52 | &:before { 53 | vertical-align: middle; 54 | } 55 | } 56 | 57 | &.menu-arrow { 58 | font: normal normal normal 24px/1 "Material Design Icons"; 59 | line-height: 1; 60 | font-size: $sidebar-icon-font-size; 61 | margin-left: auto; 62 | .rtl & { 63 | margin-left: 0; 64 | margin-right: auto; 65 | } 66 | color: $sidebar-light-menu-arrow-color; 67 | &:before{ 68 | content: "\f141"; 69 | font-size: inherit; 70 | color: inherit; 71 | } 72 | + .menu-icon { 73 | margin-left: .25rem; 74 | .rtl & { 75 | margin-left: 0; 76 | margin-right: .25rem; 77 | } 78 | } 79 | } 80 | } 81 | 82 | .menu-title { 83 | color: inherit; 84 | display: inline-block; 85 | font-size: $sidebar-menu-font-size; 86 | line-height: 1; 87 | vertical-align: middle; 88 | } 89 | 90 | .badge { 91 | margin-right: auto; 92 | margin-left: 1rem; 93 | } 94 | 95 | &[aria-expanded="true"]{ 96 | .menu-arrow{ 97 | &:before{ 98 | content: "\f140"; 99 | } 100 | } 101 | } 102 | } 103 | 104 | &.active { 105 | background: $sidebar-light-menu-active-bg; 106 | > .nav-link { 107 | .menu-title { 108 | color: $sidebar-light-menu-active-color; 109 | font-family: $type1-medium; 110 | } 111 | i { 112 | color: $primary; 113 | } 114 | } 115 | } 116 | &:hover{ 117 | background: $sidebar-light-menu-hover-bg; 118 | } 119 | &.nav-profile { 120 | .nav-link { 121 | height: auto; 122 | line-height: 1; 123 | border-top: 0; 124 | padding: 1.25rem 0; 125 | .nav-profile-image { 126 | width: 44px; 127 | height: 44px; 128 | img { 129 | width: 44px; 130 | height: 44px; 131 | border-radius: 100%; 132 | } 133 | } 134 | .nav-profile-text { 135 | margin-left: 1rem; 136 | .rtl & { 137 | margin-left: auto; 138 | margin-right: 1rem; 139 | } 140 | } 141 | .nav-profile-badge { 142 | font-size: 1.125rem; 143 | margin-left: auto; 144 | .rtl & { 145 | margin-left: 0; 146 | margin-right: auto; 147 | } 148 | } 149 | } 150 | } 151 | &.sidebar-actions { 152 | margin-top: 1rem; 153 | .nav-link { 154 | border-top: 0; 155 | display: block; 156 | height: auto; 157 | } 158 | &:hover { 159 | background: initial; 160 | .nav-link { 161 | color: initial; 162 | } 163 | } 164 | } 165 | } 166 | 167 | &:not(.sub-menu) { 168 | > .nav-item { 169 | &:hover { 170 | &:not(.nav-category):not(.nav-profile) { 171 | > .nav-link { 172 | color: $sidebar-light-menu-hover-color; 173 | } 174 | } 175 | } 176 | } 177 | } 178 | &.sub-menu { 179 | margin-bottom: 20px; 180 | margin-top:0; 181 | list-style: none; 182 | 183 | .nav-item { 184 | padding: 0; 185 | .nav-link { 186 | color: $sidebar-light-submenu-color; 187 | padding: $sidebar-submenu-item-padding; 188 | position: relative; 189 | font-size: $sidebar-submenu-font-size; 190 | line-height: 1; 191 | height: auto; 192 | border-top: 0; 193 | &:before { 194 | content: "\F054"; 195 | font-family: "Material Design Icons"; 196 | display: block; 197 | position: absolute; 198 | left:0px; 199 | .rtl & { 200 | left: auto; 201 | right: 0; 202 | } 203 | top:50%; 204 | @include transform(translateY(-50%)); 205 | color: lighten($sidebar-light-submenu-color, 10%); 206 | font-size: .75rem; 207 | } 208 | &.active { 209 | color: $sidebar-light-menu-active-color; 210 | background: transparent; 211 | } 212 | &:hover { 213 | color: $sidebar-light-submenu-hover-color; 214 | } 215 | } 216 | &:hover { 217 | background: transparent; 218 | } 219 | } 220 | } 221 | } 222 | } 223 | 224 | /* style for off-canvas menu*/ 225 | @media screen and (max-width: 991px) { 226 | .sidebar-offcanvas { 227 | position: fixed; 228 | max-height: calc(100vh - #{$navbar-height}); 229 | top: $navbar-height; 230 | bottom: 0; 231 | overflow: auto; 232 | right: -$sidebar-width-lg; 233 | -webkit-transition: all 0.25s ease-out; 234 | -o-transition: all 0.25s ease-out; 235 | transition: all 0.25s ease-out; 236 | &.active { 237 | right: 0; 238 | } 239 | } 240 | } -------------------------------------------------------------------------------- /assets/scss/_typography.scss: -------------------------------------------------------------------------------- 1 | /* Typography */ 2 | 3 | body { 4 | font-size: 1rem; 5 | font-family: $type1-regular; 6 | font-weight: initial; 7 | line-height: normal; 8 | -webkit-font-smoothing: antialiased; 9 | } 10 | h1, 11 | h2, 12 | h3, 13 | h4, 14 | h5, 15 | h6, 16 | .h1, 17 | .h2, 18 | .h3, 19 | .h4, 20 | .h5, 21 | .h6 { 22 | font-family: $type1-medium; 23 | } 24 | p { 25 | font-size: $default-font-size; 26 | } 27 | h1, 28 | .h1 { 29 | font-size: 2.19rem; 30 | } 31 | h2, 32 | .h2 { 33 | font-size: 1.88rem; 34 | } 35 | h3, 36 | .h3 { 37 | font-size: 1.56rem; 38 | } 39 | h4, 40 | .h4 { 41 | font-size: 1.13rem; 42 | } 43 | h5, 44 | .h5 { 45 | font-size: 1rem; 46 | } 47 | h6, 48 | .h6 { 49 | font-size: .9375rem; 50 | } 51 | p { 52 | font-size: .9375rem; 53 | line-height: 1.5; 54 | } 55 | .display-1 { 56 | font-size: 3.75rem; 57 | @media (max-width: 991px) { 58 | font-size: 3rem; 59 | } 60 | } 61 | .display-2 { 62 | font-size: 3.125rem; 63 | @media (max-width: 991px) { 64 | font-size: 2.5rem; 65 | } 66 | } 67 | .display-3 { 68 | font-size: 2.5rem; 69 | @media (max-width: 991px) { 70 | font-size: 2rem; 71 | } 72 | } 73 | .display-4 { 74 | font-size: 1.875rem; 75 | @media (max-width: 991px) { 76 | font-size: 1.5rem; 77 | } 78 | } 79 | .display-5 { 80 | font-size: 1.25rem; 81 | @media (max-width: 991px) { 82 | font-size: 1rem; 83 | } 84 | } 85 | .blockquote { 86 | padding: 1.25rem; 87 | border: 1px solid $border-color; 88 | } 89 | 90 | address { 91 | p { 92 | margin-bottom: 0; 93 | } 94 | } 95 | 96 | //blockqoute color variations 97 | @each $color, $value in $theme-colors { 98 | .blockquote-#{$color} { 99 | @include blockquote($value); 100 | } 101 | } 102 | .error-page { 103 | h1 { 104 | font-size: 12rem; 105 | @media (max-width: 991px) { 106 | font-size: 8rem; 107 | } 108 | } 109 | } 110 | .icon-lg { 111 | font-size: 2.5rem; 112 | } 113 | .icon-md { 114 | font-size: 1.875rem; 115 | } 116 | .icon-sm { 117 | font-size: 1rem; 118 | } 119 | -------------------------------------------------------------------------------- /assets/scss/_utilities.scss: -------------------------------------------------------------------------------- 1 | /* Utilities */ 2 | 3 | .grid-margin { 4 | margin-bottom: $card-spacing-y; 5 | } 6 | .grid-margin-sm-0 { 7 | @media (min-width: 576px) { 8 | margin-bottom: 0; 9 | } 10 | } 11 | .grid-margin-md-0 { 12 | @media (min-width: 768px) { 13 | margin-bottom: 0; 14 | } 15 | } 16 | .grid-margin-lg-0 { 17 | @media (min-width: 992px) { 18 | margin-bottom: 0; 19 | } 20 | } 21 | .grid-margin-xl-0 { 22 | @media (min-width: 1200px) { 23 | margin-bottom: 0; 24 | } 25 | } 26 | .img-lg { 27 | width: 92px; 28 | height: 92px; 29 | } 30 | .img-sm { 31 | width: 43px; 32 | height: 43px; 33 | } 34 | .img-xs { 35 | width: 37px; 36 | height: 37px; 37 | } 38 | .img-ss { 39 | width: 35px; 40 | height: 35px; 41 | } 42 | .stretch-card { 43 | @include display-flex; 44 | @include align-items(stretch); 45 | @include justify-content(stretch); 46 | >.card{ 47 | width: 100%; 48 | min-width: 100%; 49 | } 50 | } 51 | 52 | .border-right-sm { 53 | @media (min-width: 576px) { 54 | border-right: $border-width solid $border-color; 55 | } 56 | } 57 | .border-right-md { 58 | @media (min-width: 768px) { 59 | border-right: $border-width solid $border-color; 60 | } 61 | } 62 | .border-right-lg { 63 | @media (min-width: 992px) { 64 | border-right: $border-width solid $border-color; 65 | } 66 | } 67 | 68 | .border-left-sm { 69 | @media (min-width: 576px) { 70 | border-left: $border-width solid $border-color; 71 | } 72 | } 73 | .border-left-md { 74 | @media (min-width: 768px) { 75 | border-left: $border-width solid $border-color; 76 | } 77 | } 78 | .border-left-lg { 79 | @media (min-width: 992px) { 80 | border-left: $border-width solid $border-color; 81 | } 82 | } 83 | 84 | .text-gray { 85 | color: #8c8c8c; 86 | } 87 | 88 | .text-black { 89 | color: $black; 90 | } 91 | 92 | .text-small { 93 | font-size: 12px; 94 | } 95 | 96 | .flex-grow { 97 | flex-grow: 1; 98 | } 99 | 100 | .font-weight-light { 101 | font-family: $type1-light; 102 | } 103 | 104 | .font-weight-bold { 105 | font-family: $type1-bold; 106 | } 107 | 108 | .font-weight-normal { 109 | font-family: $type1-regular; 110 | } 111 | 112 | .image-grouped { 113 | display: flex; 114 | 115 | .text-avatar, 116 | img { 117 | @extend .img-ss; 118 | border-radius: 100%; 119 | margin-left: -10px; 120 | z-index: 0; 121 | border: 4px solid $card-bg; 122 | transform: scale(1); 123 | transition-duration: 0.3s; 124 | transition-timing-function: ease; 125 | transition-property: "box-shadow", "z-index", "transform", "border-width"; 126 | 127 | &:first-child { 128 | margin-left: 0; 129 | } 130 | 131 | &:hover { 132 | z-index: 1; 133 | box-shadow: 0 0 5px -2px rgba(0, 0, 0, 0.5); 134 | transform: scale(1.05); 135 | border-width: 0; 136 | 137 | } 138 | } 139 | 140 | .text-avatar { 141 | @extend .bg-inverse-primary; 142 | color: $primary; 143 | font-size: 11px; 144 | font-weight: 600; 145 | } 146 | } 147 | 148 | .aligner-wrapper { 149 | position: relative; 150 | 151 | .absolute { 152 | position: absolute; 153 | 154 | &.absolute-center { 155 | top: 50%; 156 | transform: translateY(-50%); 157 | bottom: 0; 158 | right: 0; 159 | left: 0; 160 | margin: auto; 161 | } 162 | 163 | &.left { 164 | left: 0; 165 | } 166 | 167 | &.right { 168 | right: 0; 169 | } 170 | 171 | &.bottom { 172 | bottom: 0; 173 | } 174 | 175 | &.top { 176 | top: 0; 177 | } 178 | } 179 | } 180 | 181 | .v-strock-1 { 182 | width: 2px; 183 | } 184 | 185 | .v-strock-2 { 186 | width: 3px; 187 | } 188 | 189 | .v-strock-3 { 190 | width: 4px; 191 | } 192 | 193 | .v-strock-4 { 194 | width: 5px; 195 | } 196 | 197 | .dot-indicator { 198 | width: 10px; 199 | height: 10px; 200 | border-radius: 100%; 201 | 202 | &.dot-indicator-sm { 203 | width: 6px; 204 | height: 6px; 205 | } 206 | } 207 | @each $color, $value in $theme-gradient-colors { 208 | .bg-gradient-#{$color} { 209 | background: theme-gradient-color($color) !important; 210 | } 211 | } -------------------------------------------------------------------------------- /assets/scss/_variables.scss: -------------------------------------------------------------------------------- 1 | ////////// COLOR SYSTEM ////////// 2 | 3 | $blue: #5E50F9; 4 | $indigo: #6610f2; 5 | $purple: #6a008a; 6 | $pink: #E91E63; 7 | $red: #f96868; 8 | $orange: #f2a654; 9 | $yellow: #f6e84e; 10 | $green: #46c35f; 11 | $teal: #58d8a3; 12 | $cyan: #57c7d4; 13 | $black: #000; 14 | $white: #ffffff; 15 | $white-smoke: #f2f7f8; 16 | $violet: #41478a; 17 | $darkslategray : #2e383e; 18 | $dodger-blue : #3498db; 19 | 20 | 21 | $colors: ( 22 | blue: $blue, 23 | indigo: $indigo, 24 | purple: $purple, 25 | pink: $pink, 26 | red: $red, 27 | orange: $orange, 28 | yellow: $yellow, 29 | green: $green, 30 | teal: $teal, 31 | cyan: $cyan, 32 | white: $white, 33 | gray: #434a54, 34 | gray-light: #aab2bd, 35 | gray-lighter: #e8eff4, 36 | gray-lightest: #e6e9ed, 37 | gray-dark: #0f1531, 38 | black: #000000 39 | ); 40 | 41 | $blue: $blue; 42 | $indigo: $indigo; 43 | $purple: $purple; 44 | $pink: $pink; 45 | $red: $red; 46 | $orange: $orange; 47 | $yellow: $yellow; 48 | $green: $green; 49 | $teal: $teal; 50 | $cyan: $cyan; 51 | $white: $white; 52 | $gray: #434a54; 53 | $gray-light: #aab2bd; 54 | $gray-lighter: #e8eff4; 55 | $gray-lightest: #e6e9ed; 56 | $gray-dark: #0f1531; 57 | $black: #000000; 58 | 59 | $theme-colors: ( 60 | primary: #b66dff, 61 | secondary: #c3bdbd, 62 | success: #1bcfb4, 63 | info: #198ae3, 64 | warning: #fed713, 65 | danger: #fe7c96, 66 | light: #f8f9fa, 67 | dark: #3e4b5b 68 | ); 69 | 70 | $primary: #b66dff; 71 | $secondary: #c3bdbd; 72 | $success: #1bcfb4; 73 | $info: #198ae3; 74 | $warning: #fed713; 75 | $danger: #fe7c96; 76 | $light: #f8f9fa; 77 | $dark: #3e4b5b; 78 | 79 | $theme-gradient-colors: (primary: linear-gradient(to right, #da8cff, #9a55ff), 80 | secondary: linear-gradient(to right, #e7ebf0, #868e96), 81 | success: linear-gradient(to right, #84d9d2, #07cdae), 82 | info: linear-gradient(to right, #90caf9, #047edf 99%), 83 | warning: linear-gradient(to right, #f6e384, #ffd500), 84 | danger: linear-gradient(to right, #ffbf96, #fe7096), 85 | light: linear-gradient(to bottom, #f4f4f4, #e4e4e9), 86 | dark: linear-gradient(89deg, #5e7188, #3e4b5b)); 87 | 88 | 89 | ////////// COLOR SYSTEM ////////// 90 | 91 | ////////// COLOR VARIABLES ////////// 92 | $content-bg: #f2edf3; 93 | $footer-bg: $content-bg; 94 | $footer-color: color(dark); 95 | $border-color: #ebedf2; 96 | $circle-border:$white; 97 | ////////// COLOR VARIABLES ////////// 98 | 99 | ////////// SOCIAL COLORS ////////// 100 | 101 | $social-colors: (twitter: #2caae1, 102 | facebook: #3b579d, 103 | google: #dc4a38, 104 | linkedin: #0177b5, 105 | pinterest: #cc2127, 106 | youtube: #e52d27, 107 | github: #333333, 108 | behance: #1769ff, 109 | dribbble: #ea4c89, 110 | reddit: #ff4500); 111 | 112 | ////////// SOCIAL COLORS ////////// 113 | 114 | ////////// FONTS// 115 | $type-1: 'roboto', 116 | sans-serif; 117 | $type-2: $type-1; 118 | $type1-light: 'ubuntu-light', 119 | sans-serif; 120 | $type1-regular: 'ubuntu-regular', 121 | sans-serif; 122 | $type1-medium: 'ubuntu-medium', 123 | sans-serif; 124 | $type1-bold: 'ubuntu-bold', 125 | sans-serif; 126 | 127 | $default-font-size: .875rem; // 14px as base font size 128 | 129 | $text-muted: #9c9fa6; 130 | $body-color: #343a40; 131 | 132 | ////////// FONT VARIABLES ////////// 133 | 134 | ///////// CARD //////// 135 | $card-bg: #fff; 136 | $card-description-color: #76838f; 137 | $card-title-color: $body-color; 138 | $card-bg-varient: #fff; 139 | ///////// CARD //////// 140 | 141 | //////// TABLES //////// 142 | $table-accent-bg: transparent; 143 | $table-hover-bg: $content-bg; 144 | $table-cell-padding: .9375rem; 145 | $table-border-color: $border-color; 146 | $table-inverse-bg: #2a2b32; 147 | $table-inverse-color: color(white); 148 | //////// TABLES //////// 149 | 150 | ////////// MODALS VARIABLES ////////// 151 | $modal-content-bg: $content-bg; 152 | ////////// MODALS VARIABLES ////////// 153 | 154 | ///////// NAVBAR //////// 155 | $navbar-bg: #fff; 156 | $navbar-height: 70px; 157 | $navbar-menu-color: #9c9fa6; 158 | $navbar-font-size: .875rem; 159 | $navbar-icon-font-size: 1.25rem; 160 | $mail-head-bg:#303a40; 161 | $u-name-color:$black; 162 | $file-name:$black; 163 | ///////// NAVBAR //////// 164 | 165 | 166 | 167 | ///////// BUTTONS //////// 168 | 169 | $button-fixed-width: 150px; 170 | $btn-padding-y: .875rem; 171 | $btn-padding-x: 2.5rem; 172 | $btn-line-height: 1; 173 | 174 | $btn-padding-y-xs: .5rem; 175 | $btn-padding-x-xs: .75rem; 176 | 177 | $btn-padding-y-sm: .50rem; 178 | $btn-padding-x-sm: .81rem; 179 | 180 | $btn-padding-y-lg: 1rem; 181 | $btn-padding-x-lg: 3rem; 182 | 183 | $btn-font-size: .875rem; 184 | $btn-font-size-xs: .625rem; 185 | $btn-font-size-sm: .875rem; 186 | $btn-font-size-lg: .875rem; 187 | 188 | $btn-border-radius: .1875rem; 189 | $btn-border-radius-xs: .1875rem; 190 | $btn-border-radius-sm: .1875rem; 191 | $btn-border-radius-lg: .1875rem; 192 | 193 | ///////// BUTTONS //////// 194 | 195 | 196 | 197 | ////////// TOOLTIP VARIABLES ////////// 198 | 199 | //default styles 200 | $tooltip-font-size: .75rem; 201 | $tooltip-padding-y: .4rem; 202 | $tooltip-padding-x: .75rem; 203 | $tooltip-border-radius: .375rem; 204 | 205 | ////////// TOOLTIP VARIABLES ////////// 206 | 207 | 208 | 209 | ///////// FORMS ///////// 210 | 211 | $input-bg: color(white); 212 | $input-border-radius: 2px; 213 | $input-placeholder-color: #c9c8c8; 214 | $input-font-size: .8125rem; 215 | 216 | $input-padding-y: 0.94rem; 217 | $input-padding-x: 1.375rem; 218 | $input-line-height: 1; 219 | 220 | $input-padding-y-xs: .5rem; 221 | $input-padding-x-xs: .75rem; 222 | 223 | $input-padding-y-sm: .50rem; 224 | $input-padding-x-sm: .81rem; 225 | 226 | $input-padding-y-lg: .94rem; 227 | $input-padding-x-lg: 1.94rem; 228 | 229 | $input-height: 2.875rem; 230 | $input-height-sm: 2.575rem; 231 | $input-height-lg: 3.175rem; 232 | 233 | ///////// FORMS ///////// 234 | 235 | //////// DROPDOWNS /////// 236 | $dropdown-border-color: $border-color; 237 | $dropdown-divider-bg: $border-color; 238 | $dropdown-link-color: $body-color; 239 | $dropdown-header-color: $body-color; 240 | $dropdown-menu-box-shadow: 0px 1px 15px 1px rgba(230, 234, 236, 0.35); 241 | $dropdown-hover-bg: #f8f9fa; 242 | //////// DROPDOWNS /////// 243 | 244 | 245 | ////////// MEASUREMENT AND PROPERTY VARIABLES ////////// 246 | 247 | $boxed-container-width: 1200px; 248 | $border-property: 1px solid $border-color; 249 | $card-spacing-y: 2.5rem; 250 | $card-padding-y: 2.5rem; 251 | $card-padding-x: 2.5rem; 252 | $card-border-radius: .3125rem; 253 | $grid-gutter-width: 40px; 254 | $action-transition-duration: 0.25s; 255 | $action-transition-timing-function: ease; 256 | ////////// OTHER VARIABLES ////////// 257 | 258 | ////////// BREAD CRUMBS VARIABLES ////////// 259 | 260 | // default styles 261 | $breadcrumb-padding-y: 0.56rem; 262 | $breadcrumb-padding-x: 1.13rem; 263 | $breadcrumb-item-padding: .5rem; 264 | $breadcrumb-margin-bottom: 1rem; 265 | $breadcrumb-font-size: $default-font-size; 266 | $breadcrumb-bg: transparent; 267 | $breadcrumb-border-color: $border-color; 268 | $breadcrumb-divider-color: $gray-600; 269 | $breadcrumb-active-color: $gray-700; 270 | $breadcrumb-divider: "/"; 271 | 272 | // custom styles 273 | $breadcrumb-custom-padding-y: 0; 274 | $breadcrumb-custom-padding-x: 0; 275 | $breadcrumb-custom-item-padding-y: 0.56rem; 276 | $breadcrumb-custom-item-padding-x: 10px; 277 | $breadcrumb-custom-item-color: $black; 278 | $breadcrumb-item-bg: #dbe3e6; 279 | ////////// BREAD CRUMBS VARIABLES ////////// 280 | 281 | 282 | ////////// MODALS VARIABLES ////////// 283 | $modal-inner-padding: .9375rem; 284 | $modal-dialog-margin: 10px; 285 | $modal-dialog-margin-y-sm-up: 30px; 286 | $modal-title-line-height: $line-height-base; 287 | $modal-content-box-shadow-xs: 0 3px 9px rgba($black, .5); 288 | $modal-content-box-shadow-sm-up: 0 5px 15px rgba($black, .5); 289 | 290 | $modal-backdrop-bg: $black; 291 | $modal-backdrop-opacity: .5; 292 | 293 | $modal-header-border-color: $border-color; 294 | $modal-content-border-color: $border-color; 295 | $modal-footer-border-color: $border-color; 296 | 297 | $modal-header-border-width: $border-width; 298 | $modal-content-border-width: $border-width; 299 | $modal-footer-border-width: $border-width; 300 | 301 | $modal-header-padding-x: 26px; 302 | $modal-header-padding-y: 25px; 303 | 304 | $modal-body-padding-x: 26px; 305 | $modal-body-padding-y: 35px; 306 | 307 | $modal-footer-padding-x: 31px; 308 | $modal-footer-padding-y: 15px; 309 | 310 | $modal-lg: 90%; 311 | $modal-md: 500px; 312 | $modal-sm: 300px; 313 | $modal-transition: transform .4s ease; 314 | 315 | ////////// MODALS VARIABLES ////////// 316 | 317 | ///////// TABS VARIABLES ////////// 318 | $nav-tabs-border-color: #ebedf2; 319 | $nav-tabs-link-bg: #f6f8fa; 320 | $nav-tabs-link-color: #000000; 321 | $nav-tabs-link-hover-border-color: $nav-tabs-border-color $nav-tabs-border-color $nav-tabs-border-color; 322 | $nav-tabs-link-active-color: $body-color; 323 | $nav-tabs-link-active-bg: $white; 324 | $nav-tabs-link-active-border-color: $nav-tabs-border-color $nav-tabs-border-color $nav-tabs-link-active-bg; 325 | $nav-pills-custom-bg: #fcfcfd; 326 | //////// TABS VARIABLES ///////// 327 | $accent-color: $white; 328 | $chat-container-height:100%s; 329 | $text-gray:gray; 330 | $bullet-line-list-shape-bg: color(white) !default; 331 | $arrow-color: $white; 332 | $tab-head-bg: darken(#f2edf3, 2%); 333 | $accordian-shadow-color:rgba(230, 234, 236, 0.35); 334 | $landing-bg:#1a142dfa; 335 | $private-btn-bg:#eae2ec; 336 | $circle-img-border: $white; 337 | $bottom-submenu-bg: $white; 338 | $chat-bottom-btn: $white; 339 | $form-focus-bg:$white; 340 | $form-focus-bg: $white; 341 | $form-focus-color:$black; 342 | $landing-bg-color: $white; 343 | $mail-hover-color: rgba(240, 244, 249, 0.8); 344 | 345 | 346 | //////// CALENDAR ////////////// 347 | $fullcalendar-color: #a8b2b9; 348 | //////// CALENDAR ////////////// 349 | 350 | //////// MISC ////////////// 351 | $page-title-color: $body-color; 352 | //////// MISC ////////////// 353 | 354 | 355 | ////////// SIDEBAR //////// 356 | $sidebar-width-lg: 260px; 357 | $sidebar-width-mini: 185px; 358 | $sidebar-width-icon: 70px; 359 | 360 | $sidebar-light-bg: $white; 361 | $sidebar-light-menu-color: #3e4b5b; 362 | $sidebar-light-submenu-color: #888; 363 | $sidebar-light-menu-active-bg: $white; 364 | $sidebar-light-menu-active-color: $primary; 365 | $sidebar-light-menu-hover-bg: darken($sidebar-light-bg, 1%); 366 | $sidebar-light-menu-hover-color: darken($sidebar-light-menu-color, 10%); 367 | $sidebar-light-submenu-hover-color: darken($sidebar-light-submenu-color, 20%); 368 | $sidebar-light-menu-icon-color: #bba8bff5; 369 | $sidebar-light-menu-arrow-color: #9e9da0; 370 | $sidebar-light-menu-border-color: #f2edf3; 371 | 372 | $sidebar-menu-font-size: $default-font-size; 373 | $sidebar-menu-padding-y: 1.125rem; 374 | $sidebar-menu-padding-x: 2.25rem; 375 | 376 | $sidebar-submenu-font-size: .8125rem; 377 | $sidebar-submenu-item-padding: .75rem 2rem .75rem 2rem; 378 | 379 | $sidebar-icon-font-size: 1.125rem; 380 | $sidebar-arrow-font-size: .625rem; 381 | 382 | $sidebar-profile-bg: transparent; 383 | $sidebar-profile-padding: .75rem 1.625rem .75rem 1.188rem; 384 | 385 | $rtl-sidebar-submenu-padding: 0 1.5rem 0 0; 386 | 387 | $sidebar-icon-only-menu-padding: .5rem 1.625rem .5rem 1.188rem; 388 | $sidebar-icon-only-submenu-padding: 0 0 0 1.5rem; 389 | 390 | $icon-only-collapse-width: 190px; 391 | $icon-only-menu-bg-light: $sidebar-light-menu-hover-bg; 392 | 393 | ///////// SIDEBAR //////// 394 | 395 | $bullet-line-list-shape-bg: color(white) !default; 396 | $buy-nowbanner-padding-top:80px; -------------------------------------------------------------------------------- /assets/scss/_vertical-wrapper.scss: -------------------------------------------------------------------------------- 1 | .page-body-wrapper { 2 | min-height: calc(100vh - #{$navbar-height}); 3 | @include display-flex(); 4 | @include flex-direction(row); 5 | padding-left: 0; 6 | padding-right: 0; 7 | 8 | &.full-page-wrapper { 9 | width: 100%; 10 | min-height: 100vh; 11 | } 12 | } 13 | 14 | .main-panel { 15 | transition: width $action-transition-duration $action-transition-timing-function, margin $action-transition-duration $action-transition-timing-function; 16 | width: calc(100% - #{$sidebar-width-lg}); 17 | min-height: calc(100vh - #{$navbar-height}); 18 | @include display-flex(); 19 | @include flex-direction(column); 20 | @media (max-width: 991px) { 21 | margin-left: 0; 22 | width: 100%; 23 | } 24 | } 25 | 26 | .content-wrapper { 27 | background: $content-bg; 28 | padding: 2.75rem 2.25rem; 29 | width: 100%; 30 | @include flex-grow(1); 31 | } -------------------------------------------------------------------------------- /assets/scss/_widget-grid.scss: -------------------------------------------------------------------------------- 1 | #resizable-grid { 2 | .drag-item { 3 | position: relative; 4 | .dismiss { 5 | position: absolute; 6 | top: 7px; 7 | right: 25px; 8 | font-size: 15px; 9 | font-weight: bold; 10 | color: lighten($danger, 10%); 11 | background: lighten(color(gray-light), 40%); 12 | height: 15px; 13 | width: 16px; 14 | line-height: 13px; 15 | cursor: pointer; 16 | text-align: center; 17 | @include border-radius(100%); 18 | } 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /assets/scss/components/_badges.scss: -------------------------------------------------------------------------------- 1 | /* Badges */ 2 | 3 | .badge { 4 | border-radius: .125rem; 5 | font-size: 11px; 6 | font-weight: initial; 7 | line-height: 1; 8 | padding: .375rem .5625rem; 9 | font-family: $type1-medium; 10 | &.badge-pill { 11 | border-radius: 10rem; 12 | } 13 | } 14 | 15 | 16 | /*Badge variations*/ 17 | @each $color, $value in $theme-colors { 18 | .badge-#{$color} { 19 | @include badge-variations($value); 20 | } 21 | } 22 | 23 | /*Badge gradient variations*/ 24 | @each $color, $value in $theme-gradient-colors { 25 | .badge-gradient-#{$color} { 26 | @include badge-gradient-variations($value); 27 | } 28 | } 29 | 30 | /*Badge outlined variations*/ 31 | @each $color, $value in $theme-colors { 32 | .badge-outline-#{$color} { 33 | @include badge-outline-variations($value); 34 | } 35 | } -------------------------------------------------------------------------------- /assets/scss/components/_bootstrap-progress.scss: -------------------------------------------------------------------------------- 1 | /* Bootstrap Progress */ 2 | 3 | .progress { 4 | @include border-radius(3px); 5 | height: 8px; 6 | .progress-bar { 7 | @include border-radius(3px); 8 | } 9 | 10 | &.progress-sm{ 11 | height: 0.375rem; 12 | } 13 | &.progress-md { 14 | height: 8px; 15 | } 16 | &.progress-lg { 17 | height: 15px; 18 | } 19 | &.progress-xl { 20 | height: 18px; 21 | } 22 | } -------------------------------------------------------------------------------- /assets/scss/components/_breadcrumbs.scss: -------------------------------------------------------------------------------- 1 | /* Breadcrumbs */ 2 | 3 | .breadcrumb { 4 | border: $border-width solid $border-color; 5 | 6 | .breadcrumb-item { 7 | font-size: $breadcrumb-font-size; 8 | 9 | &.active { 10 | color: rgba($body-color, 0.8); 11 | } 12 | } 13 | 14 | &.breadcrumb-custom { 15 | padding: $breadcrumb-custom-padding-y $breadcrumb-custom-padding-x; 16 | border-color: $breadcrumb-item-bg; 17 | .breadcrumb-item { 18 | font-size: $breadcrumb-font-size; 19 | background: $breadcrumb-item-bg; 20 | padding: $breadcrumb-custom-item-padding-y $breadcrumb-custom-item-padding-x; 21 | color: $breadcrumb-custom-item-color; 22 | display: inline-block; 23 | vertical-align: top; 24 | &:last-child { 25 | background: transparent; 26 | } 27 | &:before{ 28 | content: ""; 29 | } 30 | a { 31 | position: relative; 32 | color: inherit; 33 | border: 1px solid $breadcrumb-item-bg; 34 | display: inline-block; 35 | vertical-align: top; 36 | &:before,&:after{ 37 | position: absolute; 38 | top: -9px; 39 | width: 0; 40 | height: 0; 41 | content: ""; 42 | border-top: 21px solid transparent; 43 | border-bottom: 21px solid transparent; 44 | } 45 | &:before{ 46 | right: -22px; 47 | z-index: 3; 48 | border-left-color: $breadcrumb-item-bg; 49 | border-left-style: solid; 50 | border-left-width: 12px; 51 | } 52 | &:after{ 53 | border-top: 21px solid transparent; 54 | border-bottom: 22px solid transparent; 55 | border-left: 12px solid $white; 56 | top: -9px; 57 | right: -23px; 58 | } 59 | } 60 | span{ 61 | display: inline-block; 62 | vertical-align: top; 63 | } 64 | &.active { 65 | color: rgba($body-color, 0.8); 66 | } 67 | } 68 | } 69 | 70 | &.bg-success,&.bg-dark,&.bg-danger,&.bg-warning,&.bg-primary,&.bg-info{ 71 | border: none; 72 | .breadcrumb-item{ 73 | color: $white; 74 | &:before{ 75 | color: inherit; 76 | } 77 | a,span{ 78 | color: inherit; 79 | } 80 | } 81 | } 82 | } 83 | 84 | 85 | /* inverse breadcrumb */ 86 | @each $color, $value in $theme-colors { 87 | .bg-inverse-#{$color} { 88 | @include breadcrumb-inverse-variant($value); 89 | } 90 | } 91 | -------------------------------------------------------------------------------- /assets/scss/components/_buttons.scss: -------------------------------------------------------------------------------- 1 | /* Buttons */ 2 | 3 | .btn { 4 | font-size: $btn-font-size; 5 | line-height: 1; 6 | font-family: $type1-bold; 7 | i { 8 | font-size: 1rem; 9 | } 10 | &.btn-rounded { 11 | @include border-radius(50px); 12 | } 13 | &.btn-fw { 14 | min-width: $button-fixed-width; 15 | } 16 | &.btn-sm { 17 | font-size: $btn-font-size-sm; 18 | } 19 | &.btn-lg { 20 | font-size: $btn-font-size-lg; 21 | } 22 | &.btn-xs { 23 | padding: $btn-padding-y-xs $btn-padding-x-xs; 24 | font-size: $btn-font-size-xs; 25 | } 26 | /* Buttons with only icons */ 27 | &.btn-icon { 28 | width: 42px; 29 | height: 42px; 30 | padding: 0; 31 | } 32 | /* Buttons with icon and text */ 33 | &.btn-icon-text { 34 | .btn-icon-prepend { 35 | margin-right: .5rem; 36 | } 37 | .btn-icon-append { 38 | margin-left: .5rem; 39 | } 40 | } 41 | &.btn-social-icon { 42 | width: 50px; 43 | height: 50px; 44 | padding: 0; 45 | } 46 | } 47 | 48 | .btn-group { 49 | .btn { 50 | + .btn { 51 | border-left: 0; 52 | } 53 | } 54 | } 55 | 56 | .btn-toolbar { 57 | .btn-group { 58 | +.btn-group { 59 | @extend .ms-2; 60 | } 61 | } 62 | } 63 | /*social buttons*/ 64 | @each $color, $value in $social-colors { 65 | .btn-#{$color} { 66 | @include social-button(social-color($color)); 67 | } 68 | .btn-outline-#{$color} { 69 | @include social-outline-button(social-color($color)); 70 | } 71 | } 72 | /* inverse buttons */ 73 | @each $color, $value in $theme-colors { 74 | .btn-inverse-#{$color} { 75 | @include button-inverse-variant($value); 76 | } 77 | .btn-#{$color}:not(.btn-light) { 78 | color: $white; 79 | &:hover, 80 | &:focus, 81 | &:active { 82 | color: $white; 83 | } 84 | &:focus, 85 | &:active { 86 | background: $value; 87 | border-color: $value; 88 | } 89 | } 90 | .btn-outline-#{$color} { 91 | &:hover, 92 | &:focus, 93 | &:active { 94 | background: theme-gradient-color($color); 95 | color: $black; 96 | } 97 | } 98 | } 99 | /* gradient buttons */ 100 | @each $color, $value in $theme-gradient-colors { 101 | .btn-gradient-#{$color} { 102 | @include button-gradient-variant($value); 103 | } 104 | } -------------------------------------------------------------------------------- /assets/scss/components/_cards.scss: -------------------------------------------------------------------------------- 1 | /* Cards */ 2 | 3 | .card { 4 | border: 0; 5 | background: $card-bg; 6 | .card-body { 7 | padding: $card-padding-y $card-padding-x; 8 | + .card-body { 9 | padding-top: 1rem; 10 | } 11 | } 12 | .card-title { 13 | color: $card-title-color; 14 | margin-bottom: 0.75rem; 15 | text-transform: capitalize; 16 | font-family: $type1-medium; 17 | font-size: 1.125rem; 18 | } 19 | .card-subtitle { 20 | @extend .text-gray; 21 | font-family: $type1-regular; 22 | margin-top: 0.625rem; 23 | margin-bottom: 0.625rem; 24 | } 25 | .card-description { 26 | color: $card-description-color; 27 | margin-bottom: 1.5rem; 28 | font-family: $type1-regular; 29 | } 30 | &.card-outline-success { 31 | border: 1px solid theme-color("success"); 32 | } 33 | &.card-outline-primary { 34 | border: 1px solid theme-color("primary"); 35 | } 36 | &.card-outline-warning { 37 | border: 1px solid theme-color("warning"); 38 | } 39 | &.card-outline-danger { 40 | border: 1px solid theme-color("danger"); 41 | } 42 | &.card-rounded { 43 | @include border-radius(5px); 44 | } 45 | 46 | &.card-faded { 47 | background: #b5b0b2; 48 | border-color: #b5b0b2; 49 | } 50 | &.card-circle-progress { 51 | color: $white; 52 | text-align: center; 53 | } 54 | &.card-img-holder { 55 | position: relative; 56 | .card-img-absolute { 57 | position: absolute; 58 | top: 0; 59 | right: 0; 60 | height: 100%; 61 | } 62 | } 63 | &.bg-blue-gradient { 64 | background: linear-gradient(to right, #065efd, #3169fd, #6f79fc); 65 | color: #fff; 66 | } 67 | 68 | &.bg-orange-gradient { 69 | background: linear-gradient(to right, #ff7f2e, #fe7452); 70 | color: #fff; 71 | } 72 | 73 | &.bg-green-gradient { 74 | background: linear-gradient(to right, #24e8a6, #09cdd1); 75 | color: #fff; 76 | } 77 | 78 | &.card-no-shadow { 79 | box-shadow: none; 80 | } 81 | } 82 | 83 | @media (min-width: 576px) { 84 | .card-columns { 85 | column-count: 3; 86 | column-gap: 1.25rem; 87 | orphans: 1; 88 | widows: 1; 89 | .card { 90 | display: inline-block; 91 | width: 100%; 92 | margin-bottom: 0.75rem; 93 | } 94 | } 95 | } 96 | @each $color, $value in $theme-colors { 97 | .card-inverse-#{$color} { 98 | @include card-inverse-variant(rgba($value, .2), theme-color-level($value, 1), theme-color-level($value, 3)); 99 | } 100 | } 101 | -------------------------------------------------------------------------------- /assets/scss/components/_checkbox-radio.scss: -------------------------------------------------------------------------------- 1 | /* Checkboxes and Radios */ 2 | 3 | .form-check { 4 | position: relative; 5 | display: block; 6 | margin-top: 15px; 7 | margin-bottom: 10px; 8 | padding-left: 0; 9 | 10 | .form-check-label { 11 | display: block; 12 | margin-left: 1.75rem; 13 | font-size: $default-font-size; 14 | line-height: 1.5; 15 | .rtl & { 16 | margin-left: 0; 17 | margin-right: 1.75rem; 18 | } 19 | 20 | input { 21 | position: absolute; 22 | top: 0; 23 | left: 0; 24 | .rtl & { 25 | left: auto; 26 | right: 0; 27 | } 28 | margin-left: 0; 29 | margin-top: 0; 30 | z-index: 1; 31 | cursor: pointer; 32 | opacity: 0; 33 | filter: alpha(opacity=0); 34 | } 35 | input[type="checkbox"] { 36 | + .input-helper { 37 | &:before, 38 | &:after { 39 | position: absolute; 40 | top: 0; 41 | left: 0; 42 | .rtl & { 43 | left: auto; 44 | right: 0; 45 | } 46 | } 47 | &:before { 48 | content: ""; 49 | width: 18px; 50 | height: 18px; 51 | border-radius: 2px; 52 | border: solid $primary; 53 | border-width: 2px; 54 | @include transition(all); 55 | transition-duration: 0s; 56 | -webkit-transition-duration: 250ms; 57 | transition-duration: 250ms; 58 | } 59 | 60 | &:after { 61 | @include transition(all); 62 | transition-duration: 0s; 63 | -webkit-transition-duration: 250ms; 64 | transition-duration: 250ms; 65 | font-family: Material Design Icons; 66 | opacity: 0; 67 | filter: alpha(opacity=0); 68 | -webkit-transform: scale(0); 69 | -ms-transform: scale(0); 70 | -o-transform: scale(0); 71 | transform: scale(0); 72 | content: '\F12C'; 73 | font-size: .9375rem; 74 | font-weight: bold; 75 | color: $white; 76 | } 77 | } 78 | &:checked { 79 | +.input-helper { 80 | &:before { 81 | background: theme-gradient-color(primary); 82 | border-width: 0; 83 | } 84 | &:after { 85 | width: 18px; 86 | opacity: 1; 87 | line-height: 18px; 88 | filter: alpha(opacity=100); 89 | -webkit-transform: scale(1); 90 | -ms-transform: scale(1); 91 | -o-transform: scale(1); 92 | transform: scale(1); 93 | } 94 | } 95 | } 96 | 97 | &:disabled { 98 | + .input-helper { 99 | &:before { 100 | border-color: $border-color; 101 | } 102 | } 103 | 104 | &:checked { 105 | + .input-helper { 106 | &:after { 107 | background: $border-color; 108 | color: $white; 109 | } 110 | } 111 | } 112 | } 113 | } 114 | input[type="radio"] { 115 | +.input-helper { 116 | &:before { 117 | position: absolute; 118 | content: ""; 119 | top: 0; 120 | left: 0; 121 | .rtl & { 122 | left: auto; 123 | right: 0; 124 | } 125 | border: solid $primary; 126 | border-width: 2px; 127 | width: 20px; 128 | height: 20px; 129 | border-radius: 50%; 130 | @include transition(all); 131 | transition-duration: 0s; 132 | -webkit-transition-duration: 250ms; 133 | transition-duration: 250ms; 134 | } 135 | 136 | &:after { 137 | content: ""; 138 | width: 8px; 139 | height: 8px; 140 | background: $white; 141 | border-radius: 50%; 142 | top: 6px; 143 | left: 6px; 144 | .rtl & { 145 | left: auto; 146 | right: 6px; 147 | } 148 | -webkit-transition: all; 149 | -o-transition: all; 150 | transition: all; 151 | transition-duration: 0s; 152 | -webkit-transition-duration: 250ms; 153 | transition-duration: 250ms; 154 | opacity: 0; 155 | filter: alpha(opacity=0); 156 | -webkit-transform: scale(0); 157 | -ms-transform: scale(0); 158 | -o-transform: scale(0); 159 | transform: scale(0); 160 | position: absolute; 161 | } 162 | } 163 | 164 | &:checked { 165 | +.input-helper { 166 | &:before { 167 | background: theme-gradient-color(primary); 168 | border-width: 0; 169 | } 170 | 171 | &:after { 172 | opacity: 1; 173 | line-height: 1.5; 174 | filter: alpha(opacity=100); 175 | -webkit-transform: scale(1); 176 | -ms-transform: scale(1); 177 | -o-transform: scale(1); 178 | transform: scale(1); 179 | } 180 | } 181 | } 182 | 183 | &:disabled { 184 | + .input-helper { 185 | &:before { 186 | border-color: $border-color; 187 | } 188 | } 189 | 190 | &:checked { 191 | + .input-helper { 192 | &:before { 193 | background: $border-color; 194 | } 195 | 196 | &:after { 197 | background: $white; 198 | } 199 | } 200 | } 201 | } 202 | } 203 | } 204 | } 205 | 206 | @each $color, $value in $theme-gradient-colors { 207 | .form-check-#{$color} { 208 | &.form-check { 209 | label { 210 | input[type="checkbox"], 211 | input[type="radio"] { 212 | +.input-helper { 213 | &:before { 214 | border-color: theme-color($color); 215 | } 216 | } 217 | &:checked { 218 | +.input-helper { 219 | &:before { 220 | background: $value; 221 | } 222 | } 223 | } 224 | } 225 | } 226 | } 227 | } 228 | } 229 | 230 | @media (min-width: 576px) { 231 | .form-inline .form-check { 232 | 233 | } 234 | } -------------------------------------------------------------------------------- /assets/scss/components/_dropdown.scss: -------------------------------------------------------------------------------- 1 | /* Dropdowns */ 2 | 3 | .dropdown { 4 | .dropdown-toggle { 5 | &:after { 6 | border-top: 0; 7 | border-right: 0; 8 | border-left: 0; 9 | border-bottom: 0; 10 | font: normal normal normal 24px/1 "Material Design Icons"; 11 | content: "\f140"; 12 | width: auto; 13 | height: auto; 14 | vertical-align: baseline; 15 | font-size: .75rem; 16 | } 17 | } 18 | .dropdown-menu { 19 | margin-top: .75rem; 20 | font-size: $default-font-size; 21 | box-shadow: $dropdown-menu-box-shadow; 22 | .dropdown-item { 23 | font-size: 1rem; 24 | padding: .25rem 1.5rem; 25 | &:active { 26 | background: initial; 27 | } 28 | &:hover { 29 | background-color: $dropdown-hover-bg; 30 | color: $white; 31 | } 32 | } 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /assets/scss/components/_forms.scss: -------------------------------------------------------------------------------- 1 | /* Forms */ 2 | 3 | .form-group { 4 | margin-bottom: 1.5rem; 5 | } 6 | .input-group-append, 7 | .input-group-prepend { 8 | color: $input-placeholder-color; 9 | width: auto; 10 | border: none; 11 | 12 | .input-group-text { 13 | border-color: $border-color; 14 | padding: $input-padding-y .75rem; 15 | color: $input-placeholder-color; 16 | } 17 | } 18 | .form-control { 19 | border: 1px solid $border-color; 20 | font-family: $type1-regular; 21 | font-size: $input-font-size; 22 | &:focus { 23 | background-color: $form-focus-bg; 24 | color: $form-focus-color; 25 | outline: none; 26 | } 27 | } 28 | 29 | select { 30 | &.form-control { 31 | padding: .4375rem .75rem; 32 | border: 0; 33 | outline: 1px solid $border-color; 34 | color: $input-placeholder-color; 35 | &:focus { 36 | outline: 1px solid $border-color; 37 | } 38 | @each $color, $value in $theme-colors { 39 | &.border-#{$color} { 40 | outline: 1px solid $value; 41 | &:focus { 42 | outline: 1px solid $value; 43 | } 44 | } 45 | } 46 | } 47 | } 48 | .form-group { 49 | label { 50 | font-size: $default-font-size; 51 | line-height: 1; 52 | vertical-align: top; 53 | margin-bottom: .5rem; 54 | } 55 | &.has-danger { 56 | .form-control { 57 | border-color: $danger; 58 | } 59 | } 60 | .file-upload-default { 61 | visibility: hidden; 62 | position: absolute; 63 | } 64 | .file-upload-info { 65 | background: transparent; 66 | } 67 | } 68 | -------------------------------------------------------------------------------- /assets/scss/components/_icons.scss: -------------------------------------------------------------------------------- 1 | /* Icons */ 2 | 3 | .icons-list { 4 | border-left: 1px solid $border-color; 5 | border-top: 1px solid $border-color; 6 | >div { 7 | border-bottom: 1px solid $border-color; 8 | border-right: 1px solid $border-color; 9 | @include display-flex; 10 | @include align-items(center); 11 | padding:15px 15px; 12 | font-family: $type1-regular; 13 | font-size: $default-font-size; 14 | 15 | i { 16 | display: inline-block; 17 | font-size: 20px; 18 | width: 40px; 19 | text-align: left; 20 | color: $primary; 21 | } 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /assets/scss/components/_lists.scss: -------------------------------------------------------------------------------- 1 | /* Lists */ 2 | 3 | ul, 4 | ol, 5 | dl { 6 | padding-left: 1rem; 7 | font-size: $default-font-size; 8 | li { 9 | line-height: 1.8; 10 | } 11 | } 12 | 13 | .list-ticked, 14 | .list-arrow, 15 | .list-star { 16 | list-style: none; 17 | padding: 0; 18 | li { 19 | padding-left: 1.5rem; 20 | &:before { 21 | font-family: "Material Design Icons"; 22 | margin-left: -1.5rem; 23 | width: 1.5rem; 24 | margin-right: .5rem; 25 | } 26 | } 27 | } 28 | 29 | .list-ticked { 30 | li { 31 | &:before { 32 | content: '\F12D'; 33 | color: $danger; 34 | } 35 | } 36 | } 37 | 38 | .list-arrow { 39 | li { 40 | &:before { 41 | content: '\F142'; 42 | color: $success; 43 | } 44 | } 45 | } 46 | 47 | .list-star { 48 | li { 49 | &:before { 50 | content: '\F4CE'; 51 | color: $warning; 52 | } 53 | } 54 | } 55 | 56 | .gradient-bullet-list { 57 | padding-left: 0; 58 | .rtl & { 59 | padding-right: 0; 60 | } 61 | li { 62 | position: relative; 63 | list-style-type: none; 64 | padding-left: 25px; 65 | line-height: 1; 66 | padding-bottom: 25px; 67 | &:before, 68 | &:after { 69 | content:""; 70 | position: absolute; 71 | } 72 | &:before { 73 | top: 0; 74 | left: 0; 75 | width: 15px; 76 | height: 15px; 77 | border-radius: 100%; 78 | } 79 | &:after { 80 | width: 11px; 81 | height: 11px; 82 | top: 2px; 83 | left: 2px; 84 | background: $card-bg; 85 | border-radius: 100%; 86 | } 87 | &:nth-child(1) { 88 | &:before { 89 | background: theme-gradient-color(danger); 90 | } 91 | } 92 | &:nth-child(2) { 93 | &:before { 94 | background: theme-gradient-color(info); 95 | } 96 | } 97 | &:nth-child(3) { 98 | &:before { 99 | background: theme-gradient-color(warning); 100 | } 101 | } 102 | &:nth-child(4) { 103 | &:before { 104 | background: theme-gradient-color(success); 105 | } 106 | } 107 | &:nth-child(5) { 108 | &:before { 109 | background: theme-gradient-color(primary); 110 | } 111 | } 112 | } 113 | } 114 | 115 | .bullet-line-list { 116 | padding-left: 30px; 117 | margin-bottom: 0; 118 | position: relative; 119 | list-style-type: none; 120 | 121 | .rtl & { 122 | padding-right: 0px; 123 | } 124 | 125 | li { 126 | position: relative; 127 | line-height: 1; 128 | padding-bottom: 10px; 129 | 130 | &:before { 131 | content: ""; 132 | position: absolute; 133 | border-radius: 100%; 134 | width: 12px; 135 | height: 12px; 136 | left: -28px; 137 | top: 6px; 138 | border: 3px solid $primary; 139 | margin-right: 15px; 140 | z-index: 2; 141 | background: $bullet-line-list-shape-bg; 142 | } 143 | 144 | &:after { 145 | content: ""; 146 | border: 1px solid $border-color; 147 | position: absolute; 148 | bottom: 0; 149 | left: -23px; 150 | height: 100%; 151 | } 152 | 153 | &:first-child { 154 | &:after { 155 | content: ""; 156 | height: 80%; 157 | } 158 | } 159 | 160 | &:last-child { 161 | padding-bottom: 0; 162 | 163 | &:after { 164 | content: ""; 165 | top: 0; 166 | height: 30%; 167 | } 168 | } 169 | } 170 | } -------------------------------------------------------------------------------- /assets/scss/components/_preview.scss: -------------------------------------------------------------------------------- 1 | /* Preview */ 2 | 3 | .preview-list { 4 | .preview-item { 5 | @include display-flex; 6 | @include flex-direction(row); 7 | @include align-items(flex-start); 8 | padding: .75rem 1.5rem; 9 | font-size: .875rem; 10 | &:last-child { 11 | border-bottom: 0; 12 | } 13 | &:hover { 14 | background: $dropdown-link-hover-bg; 15 | } 16 | .form-check { 17 | margin-top: 8px; 18 | margin-right: 1rem; 19 | } 20 | .preview-thumbnail { 21 | color: color(white); 22 | position: relative; 23 | img, 24 | .preview-icon { 25 | width: 36px; 26 | height: 36px; 27 | border-radius: 100%; 28 | } 29 | .preview-icon { 30 | padding: 6px; 31 | text-align: center; 32 | @include display-flex; 33 | @include align-items(center); 34 | @include justify-content(center); 35 | i { 36 | font-size: 1.125rem; 37 | margin: 0; 38 | .rtl & { 39 | @extend .ms-0; 40 | } 41 | } 42 | } 43 | .badge { 44 | border: 2px solid color(white); 45 | border-radius: 100%; 46 | bottom: 5px; 47 | display: block; 48 | height: 14px; 49 | left: -5px; 50 | padding: 0; 51 | position: absolute; 52 | width: 14px; 53 | &.badge-online { 54 | @extend .badge-success; 55 | } 56 | &.badge-offline { 57 | @extend .badge-info; 58 | } 59 | &.badge-busy { 60 | @extend .badge-warning; 61 | } 62 | } 63 | } 64 | .preview-item-content { 65 | line-height: 1; 66 | padding-left: 15px; 67 | &:first-child { 68 | padding-left: 0; 69 | } 70 | p { 71 | margin-bottom: 10px; 72 | .content-category { 73 | font-family: 'source-sans-pro-semibold', sans-serif; 74 | padding-right: 15px; 75 | border-right: 1px solid $border-color; 76 | @extend .text-muted; 77 | } 78 | } 79 | .rtl & { 80 | padding-left: 0; 81 | padding-right: 1rem; 82 | margin-right: 0; 83 | margin-left: auto; 84 | } 85 | } 86 | .preview-actions { 87 | @include display-flex; 88 | @include flex-direction(row); 89 | i { 90 | width: 29px; 91 | color: color(gray-lightest); 92 | height: 29px; 93 | border: 2px solid color(gray-lightest); 94 | border-radius: 100%; 95 | padding: 3px 6px; 96 | display: inline-block; 97 | &:first-child { 98 | margin-right: 10px; 99 | } 100 | } 101 | } 102 | } 103 | &.comment-preview { 104 | .preview-item { 105 | padding: .87rem 0; 106 | &:first-child { 107 | padding-top: 0; 108 | } 109 | p { 110 | line-height: 27px; 111 | } 112 | } 113 | } 114 | &.bordered { 115 | .preview-item { 116 | border-bottom: 1px solid $border-color; 117 | &:last-child { 118 | border-bottom: 0; 119 | } 120 | } 121 | } 122 | } 123 | -------------------------------------------------------------------------------- /assets/scss/components/_tables.scss: -------------------------------------------------------------------------------- 1 | /* Tables */ 2 | 3 | .table { 4 | margin-bottom: 0; 5 | 6 | thead { 7 | th { 8 | border-top: 0; 9 | border-bottom-width: 1px; 10 | font-family: $type1-medium; 11 | font-weight: initial; 12 | 13 | i { 14 | margin-left: 0.325rem; 15 | } 16 | } 17 | } 18 | 19 | th, 20 | td { 21 | vertical-align: middle; 22 | font-size: $default-font-size; 23 | line-height: 1; 24 | white-space: nowrap; 25 | padding: $table-cell-padding; 26 | 27 | img { 28 | width: 36px; 29 | height: 36px; 30 | border-radius: 100%; 31 | } 32 | 33 | .badge { 34 | margin-bottom: 0; 35 | } 36 | } 37 | 38 | &.table-borderless { 39 | border: none; 40 | 41 | tr, 42 | td, 43 | th { 44 | border: none; 45 | } 46 | } 47 | } 48 | .table > :not(:last-child) > :last-child > *, .jsgrid .jsgrid-table > :not(:last-child) > :last-child > * { 49 | border-bottom-color: $border-color; 50 | } 51 | .table > :not(:first-child), .jsgrid .jsgrid-table > :not(:first-child) { 52 | border-top: none; 53 | } -------------------------------------------------------------------------------- /assets/scss/components/_todo-list.scss: -------------------------------------------------------------------------------- 1 | /* Tabs */ 2 | 3 | .add-items { 4 | margin-bottom: 1.5rem; 5 | overflow: hidden; 6 | input[type="text"] { 7 | border-top-right-radius: 0; 8 | border-bottom-right-radius: 0; 9 | width: 100%; 10 | background: transparent; 11 | } 12 | .btn { 13 | margin-left: .5rem; 14 | .rtl & { 15 | margin-left: auto; 16 | margin-right: .5rem; 17 | } 18 | } 19 | } 20 | 21 | .list-wrapper { 22 | height: 100%; 23 | max-height: 100%; 24 | ul { 25 | padding: 0; 26 | text-align: left; 27 | list-style: none; 28 | margin-bottom: 0; 29 | li { 30 | @extend .d-flex; 31 | @extend .align-items-center; 32 | @extend .justify-content-start; 33 | font-size: .9375rem; 34 | padding: .4rem 0; 35 | border-bottom: 1px solid $border-color; 36 | &:first-child { 37 | border-bottom: none; 38 | } 39 | .form-check{ 40 | @extend %ellipsor; 41 | max-width: 90%; 42 | margin-top: .25rem; 43 | margin-bottom: .25rem; 44 | .form-check-label{ 45 | @extend%ellipsor; 46 | } 47 | } 48 | } 49 | } 50 | 51 | input[type="checkbox"] { 52 | margin-right: 15px; 53 | } 54 | 55 | .remove { 56 | @extend .ms-auto; 57 | @extend .text-secondary; 58 | .rtl & { 59 | @extend .ms-0; 60 | @extend .me-auto; 61 | } 62 | cursor: pointer; 63 | font-size: 1.438rem; 64 | font-weight: 600; 65 | width: 1.25rem; 66 | height: 1.25rem; 67 | line-height: 20px; 68 | text-align: center; 69 | } 70 | 71 | .completed { 72 | text-decoration: line-through; 73 | text-decoration-color: $info; 74 | .remove { 75 | @extend .text-primary; 76 | } 77 | } 78 | } 79 | -------------------------------------------------------------------------------- /assets/scss/landing-screens/_auth.scss: -------------------------------------------------------------------------------- 1 | /* Auth */ 2 | 3 | .auth { 4 | .auth-form-light { 5 | background: $white; 6 | select { 7 | color: $input-placeholder-color; 8 | } 9 | .input-group { 10 | .form-control { 11 | &:focus, 12 | &:active { 13 | border-color: $border-color; 14 | } 15 | } 16 | } 17 | } 18 | .brand-logo { 19 | margin-bottom: 2rem; 20 | img { 21 | width: 150px; 22 | } 23 | } 24 | form { 25 | .form-group { 26 | margin-bottom: 1.5rem; 27 | label { 28 | font-size: .8125rem; 29 | } 30 | .form-control { 31 | background: transparent; 32 | border-radius: 0; 33 | font-size: .9375rem; 34 | } 35 | } 36 | .auth-form-btn { 37 | height: 50px; 38 | line-height: 1.5; 39 | } 40 | .auth-link { 41 | font-size: $default-font-size; 42 | &:hover { 43 | color: initial; 44 | } 45 | } 46 | } 47 | } -------------------------------------------------------------------------------- /assets/scss/mixins/_animation.scss: -------------------------------------------------------------------------------- 1 | /* Animation Mixins */ 2 | @keyframes dropdownAnimation { 3 | from { 4 | opacity: 0; 5 | transform: translate3d(0, -30px, 0); 6 | } 7 | 8 | to { 9 | opacity: 1; 10 | transform: none; 11 | transform: translate3d(0, 0px, 0); 12 | } 13 | } 14 | 15 | .dropdownAnimation { 16 | animation-name: dropdownAnimation; 17 | @include animation-duration($action-transition-duration); 18 | @include animation-fill-mode(both); 19 | } 20 | @mixin transition($settings) { 21 | -webkit-transition: $settings; 22 | -moz-transition: $settings; 23 | -ms-transition: $settings; 24 | -o-transition: $settings; 25 | transition: $settings; 26 | } 27 | @keyframes fadeOut { 28 | from { 29 | opacity: 1; 30 | } 31 | 32 | to { 33 | opacity: 0; 34 | } 35 | } 36 | 37 | .fadeOut { 38 | animation-name: fadeOut; 39 | } 40 | 41 | .infinite-spin { 42 | @keyframes spin { 43 | from { 44 | transform: rotate(0deg); 45 | } 46 | 47 | to { 48 | transform: rotate(360deg); 49 | } 50 | } 51 | animation-name: spin; 52 | animation-duration: 3s; 53 | animation-iteration-count: infinite; 54 | animation-timing-function: linear; 55 | } 56 | @keyframes fadeInUp { 57 | from { 58 | opacity: 0; 59 | transform: translate3d(0, 100%, 0); 60 | } 61 | 62 | to { 63 | opacity: 1; 64 | transform: none; 65 | } 66 | } 67 | 68 | .fadeInUp { 69 | animation-name: fadeInUp; 70 | } -------------------------------------------------------------------------------- /assets/scss/mixins/_background.scss: -------------------------------------------------------------------------------- 1 | // Background Mixins // 2 | @mixin bg($color) { 3 | background: $color; 4 | } 5 | 6 | @mixin bg-gradient($color1, $color2) { 7 | background: $color1; 8 | /* For browsers that do not support gradients */ 9 | background: -webkit-linear-gradient(90deg, $color1, $color2); 10 | /* For Safari 5.1 to 6.0 */ 11 | background: -o-linear-gradient(90deg, $color1, $color2); 12 | /* For Opera 11.1 to 12.0 */ 13 | background: -moz-linear-gradient(90deg, $color1, $color2); 14 | /* For Firefox 3.6 to 15 */ 15 | background: linear-gradient(90deg, $color1, $color2); 16 | /* Standard syntax */ 17 | } 18 | 19 | @mixin bg-inverse-variant($color) { 20 | background: rgba($color, 0.2); 21 | } 22 | -------------------------------------------------------------------------------- /assets/scss/mixins/_badges.scss: -------------------------------------------------------------------------------- 1 | //Badge Mixins 2 | 3 | //Badge vriations 4 | @mixin badge-variations($color) { 5 | border: 1px solid $color; 6 | background: $color; 7 | color: $white; 8 | } 9 | // Badge outlined variations 10 | @mixin badge-outline-variations($color) { 11 | color: $color; 12 | border: 1px solid $color; 13 | } 14 | // Badge outlined variations 15 | @mixin badge-gradient-variations($color) { 16 | background: $color; 17 | color: $white; 18 | } -------------------------------------------------------------------------------- /assets/scss/mixins/_blockqoute.scss: -------------------------------------------------------------------------------- 1 | // BlockQuote Mixins // 2 | 3 | @mixin blockquote($color) { 4 | border-color: $color; 5 | .blockquote-footer { 6 | color: $color; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /assets/scss/mixins/_breadcrumbs.scss: -------------------------------------------------------------------------------- 1 | // Breadcrumb color variations 2 | @mixin breadcrumb-inverse-variant($color) { 3 | background: lighten($color, 25%); 4 | border-color: $color; 5 | 6 | .breadcrumb-item { 7 | color: $color; 8 | 9 | &:before { 10 | color: inherit; 11 | } 12 | 13 | a { 14 | color: inherit; 15 | } 16 | } 17 | 18 | &.breadcrumb-custom { 19 | background: transparent; 20 | 21 | .breadcrumb-item { 22 | background: lighten($color, 25%); 23 | 24 | a { 25 | color: $color; 26 | border: none; 27 | 28 | &:before { 29 | border-left-color: lighten($color, 25%); 30 | } 31 | } 32 | 33 | span { 34 | color: $color; 35 | } 36 | 37 | &:last-child { 38 | background: transparent; 39 | } 40 | } 41 | } 42 | } -------------------------------------------------------------------------------- /assets/scss/mixins/_buttons.scss: -------------------------------------------------------------------------------- 1 | @mixin social-button($color) { 2 | background: $color; 3 | color: $white; 4 | 5 | &:hover, 6 | &:focus { 7 | background: darken($color, 10%); 8 | color: $white; 9 | } 10 | &.btn-social-icon-text { 11 | padding: 0 1.5rem 0 0; 12 | background: lighten($color, 10%); 13 | i { 14 | background: $color; 15 | padding: .75rem; 16 | display: inline-block; 17 | margin-right: 1.5rem; 18 | } 19 | } 20 | } 21 | @mixin social-outline-button($color) { 22 | border: 1px solid $color; 23 | color: $color; 24 | &:hover { 25 | background: $color; 26 | color: $white; 27 | } 28 | } 29 | @mixin button-inverse-variant($color, $color-hover: $white) { 30 | background-color: rgba($color, 0.2); 31 | background-image: none; 32 | border-color: rgba($color, 0); 33 | &:not(.btn-inverse-light) { 34 | color: $color; 35 | } 36 | &:hover { 37 | color: $color-hover; 38 | background-color: $color; 39 | border-color: $color; 40 | } 41 | 42 | &.focus, 43 | &:focus { 44 | box-shadow: 0 0 0 3px rgba($color, .5); 45 | } 46 | 47 | &.disabled, 48 | &:disabled { 49 | color: $color; 50 | background-color: transparent; 51 | } 52 | 53 | &.active, 54 | &:active, 55 | .show > &.dropdown-toggle { 56 | color: $color-hover; 57 | background-color: $color; 58 | border-color: $color; 59 | } 60 | } 61 | @mixin button-gradient-variant($value) { 62 | background: $value; 63 | border: 0; 64 | &:not([disabled]):not(.disabled):active, 65 | &:not([disabled]):not(.disabled).active, 66 | .show > &.dropdown-toggle { 67 | background: $value; 68 | } 69 | &:hover { 70 | opacity: .8; 71 | } 72 | &:not(.btn-gradient-light) { 73 | color: $white; 74 | &:hover, 75 | &:focus, 76 | &:active { 77 | color: $white; 78 | } 79 | } 80 | @include transition(opacity .3s ease); 81 | } 82 | -------------------------------------------------------------------------------- /assets/scss/mixins/_cards.scss: -------------------------------------------------------------------------------- 1 | // Cards Mixins 2 | 3 | @mixin card-inverse-variant($bg, $border, $color) { 4 | background: $bg; 5 | border: 1px solid $border; 6 | color: $color; 7 | } 8 | -------------------------------------------------------------------------------- /assets/scss/mixins/_misc.scss: -------------------------------------------------------------------------------- 1 | /* Miscellaneous Mixins */ 2 | 3 | // general transform 4 | @mixin transform($transforms) { 5 | -moz-transform: $transforms; 6 | -o-transform: $transforms; 7 | -ms-transform: $transforms; 8 | -webkit-transform: $transforms; 9 | transform: $transforms; 10 | } 11 | 12 | // rotate 13 | @mixin rotate ($deg) { 14 | @include transform(rotate(#{$deg}deg)); 15 | } 16 | 17 | // scale 18 | @mixin scale($scale) { 19 | @include transform(scale($scale)); 20 | } 21 | // translate 22 | @mixin translate ($x, $y) { 23 | @include transform(translate($x, $y)); 24 | } 25 | // skew 26 | @mixin skew ($x, $y) { 27 | @include transform(skew(#{$x}deg, #{$y}deg)); 28 | } 29 | //transform origin 30 | @mixin transform-origin ($origin) { 31 | moz-transform-origin: $origin; 32 | -o-transform-origin: $origin; 33 | -ms-transform-origin: $origin; 34 | -webkit-transform-origin: $origin; 35 | transform-origin: $origin; 36 | } 37 | //Ellipsis 38 | %ellipsor{ 39 | text-overflow: ellipsis; 40 | overflow: hidden; 41 | max-width:100%; 42 | white-space: nowrap; 43 | } 44 | 45 | @mixin ellipsor { 46 | text-overflow: ellipsis; 47 | overflow: hidden; 48 | max-width: 100%; 49 | white-space: nowrap; 50 | } 51 | 52 | // Placeholder 53 | @mixin placeholder { 54 | &::-webkit-input-placeholder { 55 | @content 56 | } 57 | &:-moz-placeholder { 58 | @content 59 | } 60 | &::-moz-placeholder { 61 | @content 62 | } 63 | &:-ms-input-placeholder { 64 | @content 65 | } 66 | } -------------------------------------------------------------------------------- /assets/scss/mixins/_pagination.scss: -------------------------------------------------------------------------------- 1 | // Pagination variations 2 | @mixin pagination-variants($color) { 3 | .page-item { 4 | &.active { 5 | .page-link { 6 | background: $color; 7 | border-color: $color; 8 | } 9 | } 10 | 11 | .page-link { 12 | &:hover { 13 | background: lighten($color,5%); 14 | border-color: $color; 15 | color: $white; 16 | } 17 | } 18 | } 19 | } -------------------------------------------------------------------------------- /assets/scss/mixins/_popovers.scss: -------------------------------------------------------------------------------- 1 | // popover color variations // 2 | 3 | @mixin popover-variant($color) { 4 | border-color: $color; 5 | .popover-header { 6 | background: theme-gradient-color($color); 7 | color: $white; 8 | border-bottom: 0; 9 | } 10 | &.bs-popover-top { 11 | .arrow { 12 | &:before, 13 | &:after { 14 | border-top-color: theme-color($color); 15 | } 16 | } 17 | } 18 | &.bs-popover-right { 19 | .arrow { 20 | &:before, 21 | &:after { 22 | border-right-color: theme-color($color); 23 | } 24 | } 25 | } 26 | &.bs-popover-bottom { 27 | .arrow { 28 | &:before, 29 | &:after { 30 | border-bottom-color: theme-color($color); 31 | } 32 | } 33 | } 34 | &.bs-popover-left { 35 | .arrow { 36 | &:before, 37 | &:after { 38 | border-left-color: theme-color($color); 39 | } 40 | } 41 | } 42 | } -------------------------------------------------------------------------------- /assets/scss/mixins/_text.scss: -------------------------------------------------------------------------------- 1 | @mixin text-color($color) { 2 | color: $color; 3 | } -------------------------------------------------------------------------------- /assets/scss/mixins/_tooltips.scss: -------------------------------------------------------------------------------- 1 | // Tooltip color variations 2 | 3 | @mixin tooltip-variant($color) { 4 | .tooltip-inner { 5 | background: theme-gradient-color($color); 6 | color: $white; 7 | } 8 | &.bs-tooltip-top { 9 | .arrow::before { 10 | border-top-color: theme-color($color); 11 | } 12 | } 13 | &.bs-tooltip-right { 14 | .arrow::before { 15 | border-right-color: theme-color($color); 16 | } 17 | } 18 | &.bs-tooltip-bottom { 19 | .arrow::before { 20 | border-bottom-color: theme-color($color); 21 | } 22 | } 23 | &.bs-tooltip-left { 24 | .arrow::before { 25 | border-left-color: theme-color($color); 26 | } 27 | } 28 | } -------------------------------------------------------------------------------- /assets/scss/style.scss: -------------------------------------------------------------------------------- 1 | /*------------------------------------------------------------------- 2 | ===== Table of Contents ===== 3 | 4 | * Bootstrap functions 5 | * Template variables 6 | * SCSS Compass Functions 7 | * Boostrap Main SCSS 8 | * Template mixins 9 | + Animation Mixins 10 | + Background Mixins 11 | + Badge Mixins 12 | + Button Mixins 13 | + Miscellaneous Mixins 14 | + BlockQuote Mixins 15 | + Cards Mixins 16 | + Color Functions Mixins 17 | + Tooltips 18 | + popovers 19 | * Core Styles 20 | + Reset Styles 21 | + Fonts 22 | + Functions 23 | + Backgrounds 24 | + Typography 25 | + Miscellaneous 26 | + Footer 27 | + Layouts 28 | + Utilities 29 | + Demo styles 30 | * Components 31 | + Badges 32 | + Boostrap Progress 33 | + Buttons 34 | + Breadcrumbs 35 | + Cards 36 | + Checkboxes and Radios 37 | + Dropdowns 38 | + Forms 39 | + Icons 40 | + Preview 41 | + Tables 42 | + Todo List 43 | * Landing screens 44 | + Auth 45 | -------------------------------------------------------------------*/ 46 | 47 | /*-------------------------------------------------------------------*/ 48 | /* === Import Bootstrap functions and variables === */ 49 | @import "../../node_modules/bootstrap/scss/functions"; 50 | @import "../../node_modules/bootstrap/scss/variables"; 51 | 52 | /*-------------------------------------------------------------------*/ 53 | /* === Import template variables === */ 54 | @import './variables'; 55 | 56 | /*-------------------------------------------------------------------*/ 57 | /* === SCSS Compass Functions === */ 58 | @import "../../node_modules/compass-mixins/lib/compass"; 59 | @import "../../node_modules/compass-mixins/lib/animate"; 60 | 61 | /*-------------------------------------------------------------------*/ 62 | /* === Boostrap Main SCSS === */ 63 | @import "../../node_modules/bootstrap/scss/bootstrap"; 64 | 65 | /*-------------------------------------------------------------------*/ 66 | /* === Template mixins === */ 67 | @import "./mixins/misc"; 68 | @import "./mixins/animation"; 69 | @import "./mixins/background"; 70 | @import "./mixins/badges"; 71 | @import "./mixins/blockqoute"; 72 | @import "./mixins/buttons"; 73 | @import "./mixins/breadcrumbs"; 74 | @import "./mixins/cards"; 75 | @import "./mixins/pagination"; 76 | @import "./mixins/popovers"; 77 | @import "./mixins/tooltips"; 78 | @import "./mixins/text"; 79 | 80 | /*-------------------------------------------------------------------*/ 81 | /* === Core Styles === */ 82 | @import "./reset"; 83 | @import "./fonts"; 84 | @import "./functions"; 85 | @import "./typography"; 86 | @import "./misc"; 87 | @import "./footer"; 88 | @import "./utilities"; 89 | @import "./demo"; 90 | @import "./dashboard"; 91 | 92 | /*-------------------------------------------------------------------*/ 93 | /* === Components === */ 94 | @import "./components/badges"; 95 | @import "./components/bootstrap-progress"; 96 | @import "./components/buttons"; 97 | @import "./components/breadcrumbs"; 98 | @import "./components/cards"; 99 | @import "./components/checkbox-radio"; 100 | @import "./components/dropdown"; 101 | @import "./components/forms"; 102 | @import "./components/icons"; 103 | @import "./components/lists"; 104 | @import "./components/preview"; 105 | @import "./components/tables"; 106 | @import "./components/todo-list"; 107 | 108 | /*-------------------------------------------------------------------*/ 109 | /* === Landing screens === */ 110 | @import "./landing-screens/auth"; 111 | 112 | 113 | @import './navbar'; 114 | @import './sidebar'; 115 | @import './layouts'; 116 | @import './vertical-wrapper'; -------------------------------------------------------------------------------- /assets/vendors/css/vendor.bundle.base.css: -------------------------------------------------------------------------------- 1 | /* 2 | * Container style 3 | */ 4 | .ps { 5 | overflow: hidden !important; 6 | overflow-anchor: none; 7 | -ms-overflow-style: none; 8 | touch-action: auto; 9 | -ms-touch-action: auto; 10 | } 11 | 12 | /* 13 | * Scrollbar rail styles 14 | */ 15 | .ps__rail-x { 16 | display: none; 17 | opacity: 0; 18 | transition: background-color .2s linear, opacity .2s linear; 19 | -webkit-transition: background-color .2s linear, opacity .2s linear; 20 | height: 15px; 21 | /* there must be 'bottom' or 'top' for ps__rail-x */ 22 | bottom: 0px; 23 | /* please don't change 'position' */ 24 | position: absolute; 25 | } 26 | 27 | .ps__rail-y { 28 | display: none; 29 | opacity: 0; 30 | transition: background-color .2s linear, opacity .2s linear; 31 | -webkit-transition: background-color .2s linear, opacity .2s linear; 32 | width: 15px; 33 | /* there must be 'right' or 'left' for ps__rail-y */ 34 | right: 0; 35 | /* please don't change 'position' */ 36 | position: absolute; 37 | } 38 | 39 | .ps--active-x > .ps__rail-x, 40 | .ps--active-y > .ps__rail-y { 41 | display: block; 42 | background-color: transparent; 43 | } 44 | 45 | .ps:hover > .ps__rail-x, 46 | .ps:hover > .ps__rail-y, 47 | .ps--focus > .ps__rail-x, 48 | .ps--focus > .ps__rail-y, 49 | .ps--scrolling-x > .ps__rail-x, 50 | .ps--scrolling-y > .ps__rail-y { 51 | opacity: 0.6; 52 | } 53 | 54 | .ps .ps__rail-x:hover, 55 | .ps .ps__rail-y:hover, 56 | .ps .ps__rail-x:focus, 57 | .ps .ps__rail-y:focus, 58 | .ps .ps__rail-x.ps--clicking, 59 | .ps .ps__rail-y.ps--clicking { 60 | background-color: #eee; 61 | opacity: 0.9; 62 | } 63 | 64 | /* 65 | * Scrollbar thumb styles 66 | */ 67 | .ps__thumb-x { 68 | background-color: #aaa; 69 | border-radius: 6px; 70 | transition: background-color .2s linear, height .2s ease-in-out; 71 | -webkit-transition: background-color .2s linear, height .2s ease-in-out; 72 | height: 6px; 73 | /* there must be 'bottom' for ps__thumb-x */ 74 | bottom: 2px; 75 | /* please don't change 'position' */ 76 | position: absolute; 77 | } 78 | 79 | .ps__thumb-y { 80 | background-color: #aaa; 81 | border-radius: 6px; 82 | transition: background-color .2s linear, width .2s ease-in-out; 83 | -webkit-transition: background-color .2s linear, width .2s ease-in-out; 84 | width: 6px; 85 | /* there must be 'right' for ps__thumb-y */ 86 | right: 2px; 87 | /* please don't change 'position' */ 88 | position: absolute; 89 | } 90 | 91 | .ps__rail-x:hover > .ps__thumb-x, 92 | .ps__rail-x:focus > .ps__thumb-x, 93 | .ps__rail-x.ps--clicking .ps__thumb-x { 94 | background-color: #999; 95 | height: 11px; 96 | } 97 | 98 | .ps__rail-y:hover > .ps__thumb-y, 99 | .ps__rail-y:focus > .ps__thumb-y, 100 | .ps__rail-y.ps--clicking .ps__thumb-y { 101 | background-color: #999; 102 | width: 11px; 103 | } 104 | 105 | /* MS supports */ 106 | @supports (-ms-overflow-style: none) { 107 | .ps { 108 | overflow: auto !important; 109 | } 110 | } 111 | 112 | @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 113 | .ps { 114 | overflow: auto !important; 115 | } 116 | } 117 | -------------------------------------------------------------------------------- /assets/vendors/mdi/fonts/materialdesignicons-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/vendors/mdi/fonts/materialdesignicons-webfont.eot -------------------------------------------------------------------------------- /assets/vendors/mdi/fonts/materialdesignicons-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/vendors/mdi/fonts/materialdesignicons-webfont.ttf -------------------------------------------------------------------------------- /assets/vendors/mdi/fonts/materialdesignicons-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/vendors/mdi/fonts/materialdesignicons-webfont.woff -------------------------------------------------------------------------------- /assets/vendors/mdi/fonts/materialdesignicons-webfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/assets/vendors/mdi/fonts/materialdesignicons-webfont.woff2 -------------------------------------------------------------------------------- /gulp-tasks/inject.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | var gulp = require('gulp'); 3 | var injectPartials = require('gulp-inject-partials'); 4 | var inject = require('gulp-inject'); 5 | var rename = require('gulp-rename'); 6 | var prettify = require('gulp-prettify'); 7 | var replace = require('gulp-replace'); 8 | var merge = require('merge-stream'); 9 | 10 | 11 | 12 | /* inject partials like sidebar and navbar */ 13 | gulp.task('injectPartial', function () { 14 | var injPartial1 = gulp.src("./pages/**/*.html", { base: "./" }) 15 | .pipe(injectPartials()) 16 | .pipe(gulp.dest(".")); 17 | var injPartial2 = gulp.src("./*.html", { base: "./" }) 18 | .pipe(injectPartials()) 19 | .pipe(gulp.dest(".")); 20 | return merge(injPartial1, injPartial2); 21 | }); 22 | 23 | 24 | 25 | /* inject Js and CCS assets into HTML */ 26 | gulp.task('injectAssets', function () { 27 | return gulp.src(["./**/*.html"]) 28 | .pipe(inject(gulp.src([ 29 | './assets/vendors/mdi/css/materialdesignicons.min.css', 30 | './assets/vendors/css/vendor.bundle.base.css', 31 | './assets/vendors/js/vendor.bundle.base.js', 32 | ], { 33 | read: false 34 | }), { 35 | name: 'plugins', 36 | relative: true 37 | })) 38 | .pipe(inject(gulp.src([ 39 | // './assets/css/shared/style.css', 40 | './assets/js/off-canvas.js', 41 | './assets/js/hoverable-collapse.js', 42 | './assets/js/misc.js', 43 | ], { 44 | read: false 45 | }), { 46 | relative: true 47 | })) 48 | .pipe(gulp.dest('.')); 49 | }); 50 | 51 | 52 | 53 | /*replace image path and linking after injection*/ 54 | gulp.task('replacePath', function () { 55 | var replacePath1 = gulp.src('pages/**/*.html', { 56 | base: "./" 57 | }) 58 | .pipe(replace('src="assets/images/', 'src="../../assets/images/')) 59 | .pipe(replace('href="pages/', 'href="../../pages/')) 60 | .pipe(replace('href="index.html"', 'href="../../index.html"')) 61 | .pipe(gulp.dest('.')); 62 | var replacePath2 = gulp.src('./**/index.html', { 63 | base: "./" 64 | }) 65 | .pipe(replace('src="assets/images/', 'src="assets/images/')) 66 | .pipe(gulp.dest('.')); 67 | return merge(replacePath1, replacePath2); 68 | }); 69 | 70 | 71 | 72 | gulp.task('html-beautify', function () { 73 | return gulp.src(['./**/*.html', '!node_modules/**/*.html']) 74 | .pipe(prettify({ 75 | unformatted: ['pre', 'code', 'textarea'] 76 | })) 77 | .pipe(gulp.dest(function (file) { 78 | return file.base; 79 | })); 80 | }); 81 | 82 | /*sequence for injecting partials and replacing paths*/ 83 | gulp.task('inject', gulp.series('injectPartial', 'injectAssets', 'html-beautify', 'replacePath')); -------------------------------------------------------------------------------- /gulp-tasks/serve.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | var gulp = require('gulp'); 3 | var browserSync = require('browser-sync').create(); 4 | var sass = require('gulp-sass'); 5 | var gutil = require('gulp-util'); 6 | var plumber = require('gulp-plumber'); 7 | var notify = require('gulp-notify'); 8 | var sourcemaps = require('gulp-sourcemaps'); 9 | var autoprefixer = require('gulp-autoprefixer'); 10 | // const del = require('del'); 11 | 12 | 13 | gulp.task('sass', function () { 14 | return gulp.src('./assets/scss/**/*.scss') 15 | .pipe(sourcemaps.init()) 16 | .pipe(plumber({ 17 | errorHandler: function (err) { 18 | notify.onError({ 19 | title: "Gulp error in " + err.plugin, 20 | message: err.toString() 21 | })(err); 22 | gutil.beep(); 23 | } 24 | })) 25 | .pipe(sass()) 26 | .pipe(autoprefixer({ 27 | overrideBrowserslist: ['last 2 versions'], 28 | cascade: false 29 | })) 30 | .pipe(sourcemaps.write('./')) 31 | .pipe(gulp.dest('./assets/css')) 32 | .pipe(browserSync.stream()); 33 | }); 34 | 35 | // Static Server + watching scss/html files 36 | gulp.task('serve', gulp.series('sass', function () { 37 | 38 | browserSync.init({ 39 | port: 3000, 40 | server: "./", 41 | ghostMode: false, 42 | notify: false 43 | }); 44 | 45 | gulp.watch('./assets/scss/**/*.scss', gulp.series('sass')); 46 | gulp.watch(['./assets/js/**/*.js', './**/*.html', './assets/css/**/*.css']).on('change', browserSync.reload); 47 | 48 | })); 49 | 50 | 51 | 52 | gulp.task('sass:watch', function () { 53 | gulp.watch('./assets/scss/**/*.scss'); 54 | }); 55 | 56 | 57 | 58 | // Static Server without watching scss files 59 | gulp.task('serve:lite', function () { 60 | 61 | browserSync.init({ 62 | server: "./", 63 | ghostMode: false, 64 | notify: false 65 | }); 66 | 67 | gulp.watch('**/*.css').on('change', browserSync.reload); 68 | gulp.watch('**/*.html').on('change', browserSync.reload); 69 | gulp.watch('**/*.js').on('change', browserSync.reload); 70 | 71 | }); -------------------------------------------------------------------------------- /gulp-tasks/vendors.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | var gulp = require('gulp'); 3 | var concat = require('gulp-concat'); 4 | var merge = require('merge-stream'); 5 | const del = require('del'); 6 | 7 | 8 | gulp.task('clean:vendors', function () { 9 | return del([ 10 | './assets/vendors/**/*' 11 | ]); 12 | }); 13 | 14 | /*Building vendor scripts needed for basic template rendering*/ 15 | gulp.task('buildBaseVendorScripts', function() { 16 | return gulp.src([ 17 | './node_modules/jquery/dist/jquery.min.js', 18 | // './node_modules/popper.js/dist/umd/popper.min.js', 19 | './node_modules/bootstrap/dist/js/bootstrap.bundle.min.js', 20 | './node_modules/perfect-scrollbar/dist/perfect-scrollbar.min.js' 21 | ]) 22 | .pipe(concat('vendor.bundle.base.js')) 23 | .pipe(gulp.dest('./assets/vendors/js')); 24 | }); 25 | 26 | /*Building vendor styles needed for basic template rendering*/ 27 | gulp.task('buildBaseVendorStyles', function() { 28 | return gulp.src(['./node_modules/perfect-scrollbar/css/perfect-scrollbar.css']) 29 | .pipe(concat('vendor.bundle.base.css')) 30 | .pipe(gulp.dest('./assets/vendors/css')); 31 | }); 32 | 33 | /*Scripts for addons*/ 34 | gulp.task('buildOptionalVendorScripts', function() { 35 | var aScript1 = gulp.src(['node_modules/chart.js/dist/Chart.min.js']) 36 | .pipe(gulp.dest('./assets/vendors/chart.js')); 37 | return merge(aScript1); 38 | }); 39 | 40 | 41 | /*Styles for addons*/ 42 | gulp.task('buildOptionalVendorStyles', function() { 43 | var aStyle1 = gulp.src(['./node_modules/@mdi/font/css/materialdesignicons.min.css']) 44 | .pipe(gulp.dest('./assets/vendors/mdi/css')); 45 | var aStyle2 = gulp.src(['./node_modules/@mdi/font/fonts/*']) 46 | .pipe(gulp.dest('./assets/vendors/mdi/fonts')); 47 | return merge(aStyle1, aStyle2); 48 | }); 49 | 50 | //Copy essential map files 51 | gulp.task('copyMapFiles', function() { 52 | var map1 = gulp.src('node_modules/bootstrap/dist/js/bootstrap.min.js.map') 53 | .pipe(gulp.dest('./assets/vendors/js')); 54 | var map2 = gulp.src('node_modules/@mdi/font/css/materialdesignicons.min.css.map') 55 | .pipe(gulp.dest('./assets/vendors/mdi/css')); 56 | return merge(map1, map2); 57 | }); 58 | 59 | /*sequence for building vendor scripts and styles*/ 60 | gulp.task('bundleVendors', gulp.series('clean:vendors', 'buildBaseVendorStyles','buildBaseVendorScripts', 'buildOptionalVendorStyles', 'buildOptionalVendorScripts', 'copyMapFiles')); -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | var gulp = require('gulp'); 3 | var requireDir = require('require-dir'); 4 | requireDir('gulp-tasks'); 5 | 6 | 7 | gulp.paths = { 8 | dist: 'dist', 9 | }; 10 | 11 | var paths = gulp.paths; 12 | 13 | gulp.task('default', gulp.series('serve')); -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "purple_admin", 3 | "version": "3.0.0", 4 | "description": "", 5 | "main": "index.html", 6 | "dependencies": { 7 | "@mdi/font": "3.7.95", 8 | "bootstrap": "^5.1.3", 9 | "chart.js": "^2.8.0", 10 | "jquery": "^3.4.1", 11 | "perfect-scrollbar": "^1.4.0", 12 | "popper.js": "^1.15.0" 13 | }, 14 | "devDependencies": { 15 | "browser-sync": "^2.26.7", 16 | "compass-mixins": "^0.12.10", 17 | "del": "^5.0.0", 18 | "gulp": "^4.0.2", 19 | "gulp-autoprefixer": "^6.1.0", 20 | "gulp-clean-css": "^4.2.0", 21 | "gulp-concat": "^2.6.1", 22 | "gulp-htmlmin": "^5.0.1", 23 | "gulp-inject": "5.0.2", 24 | "gulp-inject-partials": "^1.0.5", 25 | "gulp-notify": "^3.2.0", 26 | "gulp-plumber": "^1.2.1", 27 | "gulp-prettify": "^0.5.0", 28 | "gulp-rename": "^1.4.0", 29 | "gulp-replace": "^1.0.0", 30 | "gulp-sass": "^4.0.2", 31 | "gulp-sourcemaps": "^2.6.5", 32 | "gulp-util": "^3.0.8", 33 | "merge-stream": "^2.0.0", 34 | "minimatch": "^3.0.4", 35 | "require-dir": "^1.2.0", 36 | "run-sequence": "^2.2.1" 37 | }, 38 | "scripts": { 39 | "test": "echo \"Error: no test specified\" && exit 1" 40 | }, 41 | "author": "bootstrapdash", 42 | "url": "http://www.bootstrapdash.com/", 43 | "copyright": "", 44 | "license": "" 45 | } 46 | -------------------------------------------------------------------------------- /pages/samples/blank-page.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Purple Admin 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
    23 | 24 | 171 | 172 |
    173 | 174 | 268 | 269 |
    270 |
    271 |
    272 | 273 | 274 |
    275 |
    276 | Copyright © bootstrapdash.com 2021 277 | Free Bootstrap admin template from Bootstrapdash.com 278 |
    279 |
    280 | 281 |
    282 | 283 |
    284 | 285 |
    286 | 287 | 288 | 289 | 290 | 291 | 292 | 293 | 294 | 295 | 296 | 297 | 298 | 299 | 300 | -------------------------------------------------------------------------------- /pages/samples/error-404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Purple Admin 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
    23 |
    24 |
    25 |
    26 |
    27 |
    28 |
    29 |

    404

    30 |
    31 |
    32 |

    SORRY!

    33 |

    The page you’re looking for was not found.

    34 |
    35 |
    36 |
    37 |
    38 | Back to home 39 |
    40 |
    41 |
    42 |
    43 |

    Copyright © 2021 All rights reserved.

    44 |
    45 |
    46 |
    47 |
    48 |
    49 | 50 |
    51 | 52 |
    53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /pages/samples/error-500.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Purple Admin 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
    23 |
    24 |
    25 |
    26 |
    27 |
    28 |
    29 |

    500

    30 |
    31 |
    32 |

    SORRY!

    33 |

    Internal server error!

    34 |
    35 |
    36 |
    37 |
    38 | Back to home 39 |
    40 |
    41 |
    42 |
    43 |

    Copyright © 2021 All rights reserved.

    44 |
    45 |
    46 |
    47 |
    48 |
    49 | 50 |
    51 | 52 |
    53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /pages/samples/login.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Purple Admin 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
    23 |
    24 |
    25 |
    26 |
    27 |
    28 | 31 |

    Hello! let's get started

    32 |
    Sign in to continue.
    33 |
    34 |
    35 | 36 |
    37 |
    38 | 39 |
    40 |
    41 | SIGN IN 42 |
    43 |
    44 |
    45 | 47 |
    48 | Forgot password? 49 |
    50 |
    51 | 53 |
    54 |
    Don't have an account? Create 55 |
    56 |
    57 |
    58 |
    59 |
    60 |
    61 | 62 |
    63 | 64 |
    65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | -------------------------------------------------------------------------------- /pages/samples/register.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Purple Admin 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
    23 |
    24 |
    25 |
    26 |
    27 |
    28 | 31 |

    New here?

    32 |
    Signing up is easy. It only takes a few steps
    33 |
    34 |
    35 | 36 |
    37 |
    38 | 39 |
    40 |
    41 | 49 |
    50 |
    51 | 52 |
    53 |
    54 |
    55 | 57 |
    58 |
    59 |
    60 | SIGN UP 61 |
    62 |
    Already have an account? Login 63 |
    64 |
    65 |
    66 |
    67 |
    68 |
    69 | 70 |
    71 | 72 |
    73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | -------------------------------------------------------------------------------- /partials/_footer.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /partials/_navbar.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /partials/_sidebar.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /screenshot.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BootstrapDash/PurpleAdmin-Free-Admin-Template/5c8b9020ec2be4e37ee217833a972d9769b0b022/screenshot.jpg --------------------------------------------------------------------------------