├── .gitignore
├── LICENSE
├── README.md
├── app
    └── Providers
    │   └── RouteServiceProvider.php
├── package.json
├── public
    └── assets
    │   └── static
    │       └── images
    │           ├── 404.png
    │           ├── 500.png
    │           ├── bg.jpg
    │           ├── datatables
    │               ├── sort_asc.png
    │               ├── sort_asc_disabled.png
    │               ├── sort_both.png
    │               ├── sort_desc.png
    │               └── sort_desc_disabled.png
    │           ├── logo.png
    │           └── logo.svg
├── resources
    ├── assets
    │   ├── js
    │   │   ├── admin.js
    │   │   └── admin
    │   │   │   ├── charts
    │   │   │       ├── chartJS
    │   │   │       │   └── index.js
    │   │   │       ├── easyPieChart
    │   │   │       │   └── index.js
    │   │   │       ├── index.js
    │   │   │       └── sparkline
    │   │   │       │   └── index.js
    │   │   │   ├── chat
    │   │   │       └── index.js
    │   │   │   ├── constants
    │   │   │       └── colors.js
    │   │   │   ├── datatable
    │   │   │       └── index.js
    │   │   │   ├── datepicker
    │   │   │       └── index.js
    │   │   │   ├── email
    │   │   │       └── index.js
    │   │   │   ├── fullcalendar
    │   │   │       └── index.js
    │   │   │   ├── googleMaps
    │   │   │       └── index.js
    │   │   │   ├── index.js
    │   │   │   ├── masonry
    │   │   │       └── index.js
    │   │   │   ├── popover
    │   │   │       └── index.js
    │   │   │   ├── scrollbar
    │   │   │       └── index.js
    │   │   │   ├── search
    │   │   │       └── index.js
    │   │   │   ├── sidebar
    │   │   │       └── index.js
    │   │   │   ├── skycons
    │   │   │       └── index.js
    │   │   │   ├── utils
    │   │   │       └── index.js
    │   │   │   └── vectorMaps
    │   │   │       ├── index.js
    │   │   │       └── jquery-jvectormap-world-mill.js
    │   ├── sass
    │   │   ├── admin.scss
    │   │   └── admin
    │   │   │   ├── index.scss
    │   │   │   ├── spec
    │   │   │       ├── components
    │   │   │       │   ├── easyPieChart.scss
    │   │   │       │   ├── footer.scss
    │   │   │       │   ├── forms.scss
    │   │   │       │   ├── index.scss
    │   │   │       │   ├── loader.scss
    │   │   │       │   ├── masonry.scss
    │   │   │       │   ├── pageContainer.scss
    │   │   │       │   ├── progressBar.scss
    │   │   │       │   ├── sidebar.scss
    │   │   │       │   └── topbar.scss
    │   │   │       ├── generic
    │   │   │       │   ├── base.scss
    │   │   │       │   └── index.scss
    │   │   │       ├── index.scss
    │   │   │       ├── screens
    │   │   │       │   ├── chat.scss
    │   │   │       │   ├── email.scss
    │   │   │       │   └── index.scss
    │   │   │       ├── settings
    │   │   │       │   ├── baseColors.scss
    │   │   │       │   ├── borders.scss
    │   │   │       │   ├── brandColors.scss
    │   │   │       │   ├── breakpoints.scss
    │   │   │       │   ├── fonts.scss
    │   │   │       │   ├── index.scss
    │   │   │       │   └── materialColors.scss
    │   │   │       ├── tools
    │   │   │       │   ├── index.scss
    │   │   │       │   └── mixins
    │   │   │       │   │   ├── clearfix.scss
    │   │   │       │   │   ├── index.scss
    │   │   │       │   │   ├── mediaQueriesRanges.scss
    │   │   │       │   │   └── placeholder.scss
    │   │   │       └── utils
    │   │   │       │   ├── colors.scss
    │   │   │       │   ├── index.scss
    │   │   │       │   └── layout
    │   │   │       │       ├── helpers
    │   │   │       │           ├── border.scss
    │   │   │       │           ├── flex.scss
    │   │   │       │           ├── index.scss
    │   │   │       │           ├── layout.scss
    │   │   │       │           ├── lists.scss
    │   │   │       │           ├── margin.scss
    │   │   │       │           ├── objects.scss
    │   │   │       │           ├── padding.scss
    │   │   │       │           ├── positions.scss
    │   │   │       │           ├── pseudo.scss
    │   │   │       │           ├── sizes.scss
    │   │   │       │           └── typography.scss
    │   │   │       │       ├── index.scss
    │   │   │       │       ├── mixins
    │   │   │       │           ├── generateResponsive.scss
    │   │   │       │           ├── index.scss
    │   │   │       │           └── mediaQueryCondition.scss
    │   │   │       │       └── utils
    │   │   │       │           ├── center.scss
    │   │   │       │           ├── gap.scss
    │   │   │       │           ├── index.scss
    │   │   │       │           ├── layers.scss
    │   │   │       │           └── peers.scss
    │   │   │   └── vendor
    │   │   │       ├── datepicker.scss
    │   │   │       ├── font-awesome.css
    │   │   │       ├── fullcalendar.scss
    │   │   │       ├── index.scss
    │   │   │       ├── jquery.datatables.scss
    │   │   │       ├── perfectScrollbar.scss
    │   │   │       ├── sparkline.scss
    │   │   │       └── themify-icons.css
    │   └── static
    │   │   └── fonts
    │   │       └── icons
    │   │           ├── fontawesome
    │   │               ├── FontAwesome.otf
    │   │               ├── fontawesome-webfont.eot
    │   │               ├── fontawesome-webfont.svg
    │   │               ├── fontawesome-webfont.ttf
    │   │               ├── fontawesome-webfont.woff
    │   │               └── fontawesome-webfont.woff2
    │   │           └── themify
    │   │               ├── themify.eot
    │   │               ├── themify.svg
    │   │               ├── themify.ttf
    │   │               └── themify.woff
    └── views
    │   └── admin
    │       ├── 404.blade.php
    │       ├── 500.blade.php
    │       ├── basic-table.blade.php
    │       ├── blank.blade.php
    │       ├── buttons.blade.php
    │       ├── calendar.blade.php
    │       ├── charts.blade.php
    │       ├── chat.blade.php
    │       ├── compose.blade.php
    │       ├── dashboard.blade.php
    │       ├── datatable.blade.php
    │       ├── email.blade.php
    │       ├── forms.blade.php
    │       ├── google-maps.blade.php
    │       ├── layout
    │           ├── footer.blade.php
    │           ├── layout.blade.php
    │           ├── sideBar.blade.php
    │           └── topBar.blade.php
    │       ├── signin.blade.php
    │       ├── signup.blade.php
    │       ├── ui.blade.php
    │       └── vector-maps.blade.php
├── routes
    └── admin.php
└── webpack.mix.js


/.gitignore:
--------------------------------------------------------------------------------
 1 | node_modules
 2 | app/Console
 3 | app/Exceptions
 4 | app/Http
 5 | app/Providers/*
 6 | !app/Providers/RouteServiceProvider.php
 7 | app/User.php
 8 | app/Models
 9 | bootstrap
10 | config
11 | database
12 | public/*
13 | !public/assets
14 | resources/assets/js/*
15 | !resources/assets/js/admin
16 | !resources/assets/js/admin.js
17 | resources/assets/sass/*
18 | !resources/assets/sass/admin
19 | !resources/assets/sass/admin.scss
20 | resources/lang
21 | resources/views/*
22 | !resources/views/admin
23 | routes/*
24 | !routes/admin.php
25 | storage
26 | tests
27 | .env
28 | .env.example
29 | .gitattributes
30 | artisan
31 | composer.json
32 | composer.lock
33 | phpunit.xml
34 | server.php
35 | yarn.lock
36 | .idea
37 | ./vendor
38 | 
39 | 
40 | 
41 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2018 Aigars Silkalns
 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 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Adminator HTML5 Admin Template - Laravel Implementation
 2 | This is a Laravel implementation of **Adminator** 
 3 | 
 4 | Original source: https://github.com/puikinsh/Adminator-admin-dashboard
 5 | 
 6 | **Adminator** is a responsive Bootstrap 4 Admin Template. It provides you with a collection of ready to use code snippets and utilities, custom pages, a collection of applications and some useful widgets. Preview of this awesome admin template available here: https://colorlib.com/polygon/adminator/index.html
 7 | 
 8 | # Preview
 9 | 
10 | ### Screenshot
11 | 
12 | ![Adminator admin dashboard template preview](https://colorlib.com/wp/wp-content/uploads/sites/2/adminator-free-admin-dashboard-template.jpg)
13 | 
14 | ### Demo Site: [Here](https://colorlib.com/polygon/adminator/index.html)
15 | 
16 | ### TOC
17 | - [Getting Started](#getting-started)
18 |   - [Prerequisites](#prerequisites)
19 |   - [Installing](#installing)
20 | - [Changelog](#changelog)
21 | - [Authors](#authors)
22 | - [License](#license)
23 | 
24 | 
25 | ### Getting Started
26 | In order to run **Adminator** on your local machine all what you need to do is to have the prerequisites stated below installed on your machine and follow the installation steps down below.
27 | 
28 | #### Prerequisites
29 |   - Node.js
30 |   - Yarn or NPM
31 |   - Git
32 |   - Laravel 5.6 (tested)
33 | 
34 | #### Installing
35 | Installation is done by copy and pasting entire repo into your new laravel application and run following commands in your terminal.
36 | Start by typing the following commands in your terminal in order to get **Adminator** full package on your machine and starting a local development server with live reload feature.
37 | 
38 | ```
39 | > npm install
40 | > npm run dev
41 | > php artisan serve
42 | ```
43 | 
44 | To access admin dashboard: http://localhost:8000/admin/dashboard 
45 | 
46 | ### Changelog
47 | #### V 1.0.0
48 | Initial Release
49 | ### Original Authors
50 | [Colorlib](https://colorlib.com)
51 | ### License
52 | 
53 | Adminator is licensed under The MIT License (MIT). Which means that you can use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the final products. But you always need to state that Colorlib is the original author of this template.
54 | 


--------------------------------------------------------------------------------
/app/Providers/RouteServiceProvider.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace App\Providers;
 4 | 
 5 | use Illuminate\Support\Facades\Route;
 6 | use Illuminate\Foundation\Support\Providers\RouteServiceProvider as ServiceProvider;
 7 | 
 8 | class RouteServiceProvider extends ServiceProvider
 9 | {
10 |     /**
11 |      * This namespace is applied to your controller routes.
12 |      *
13 |      * In addition, it is set as the URL generator's root namespace.
14 |      *
15 |      * @var string
16 |      */
17 |     protected $namespace = 'App\Http\Controllers';
18 | 
19 |     /**
20 |      * Define your route model bindings, pattern filters, etc.
21 |      *
22 |      * @return void
23 |      */
24 |     public function boot()
25 |     {
26 |         //
27 | 
28 |         parent::boot();
29 |     }
30 | 
31 |     /**
32 |      * Define the routes for the application.
33 |      *
34 |      * @return void
35 |      */
36 |     public function map()
37 |     {
38 |         $this->mapApiRoutes();
39 | 
40 |         $this->mapWebRoutes();
41 | 
42 |         $this->mapAdminRoutes();
43 | 
44 |         //
45 |     }
46 | 
47 |     /**
48 |      * Define the "web" routes for the application.
49 |      *
50 |      * These routes all receive session state, CSRF protection, etc.
51 |      *
52 |      * @return void
53 |      */
54 |     protected function mapWebRoutes()
55 |     {
56 |         Route::middleware('web')
57 |              ->namespace($this->namespace)
58 |              ->group(base_path('routes/web.php'));
59 |     }
60 | 
61 |     /**
62 |      * Define the "api" routes for the application.
63 |      *
64 |      * These routes are typically stateless.
65 |      *
66 |      * @return void
67 |      */
68 |     protected function mapApiRoutes()
69 |     {
70 |         Route::prefix('api')
71 |              ->middleware('api')
72 |              ->namespace($this->namespace)
73 |              ->group(base_path('routes/api.php'));
74 |     }
75 | 
76 | 
77 |     /**
78 |      * Define the "admin" routes for the application.
79 |      *
80 |      * These routes all receive session state, CSRF protection, etc.
81 |      *
82 |      * @return void
83 |      */
84 |     protected function mapAdminRoutes()
85 |     {
86 |         Route::middleware('web')
87 |             ->prefix('admin')
88 |             ->as('admin.')
89 |             ->namespace($this->namespace.'\Admin')
90 |             ->group(base_path('routes/admin.php'));
91 |     }
92 | }
93 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "private": true,
 3 |     "scripts": {
 4 |         "dev": "npm run development",
 5 |         "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
 6 |         "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
 7 |         "watch-poll": "npm run watch -- --watch-poll",
 8 |         "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
 9 |         "prod": "npm run production",
10 |         "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
11 |     },
12 |     "devDependencies": {
13 |         "axios": "^0.18",
14 |         "bootstrap": "^4.0.0",
15 |         "popper.js": "^1.12",
16 |         "cross-env": "^5.1",
17 |         "jquery": "^3.2",
18 |         "laravel-mix": "^2.0",
19 |         "lodash": "^4.17.4",
20 |         "vue": "^2.5.7",
21 |         "bootstrap-datepicker": "^1.7.1",
22 |         "chart.js": "^2.7.1",
23 |         "datatables": "^1.10.13",
24 |         "easy-pie-chart": "^2.1.7",
25 |         "file-loader": "^1.1.5",
26 |         "fullcalendar": "^3.6.2",
27 |         "jquery-sparkline": "^2.4.0",
28 |         "jvectormap": "^2.0.4",
29 |         "load-google-maps-api": "^1.0.0",
30 |         "masonry-layout": "^4.2.0",
31 |         "moment": "^2.19.1",
32 |         "perfect-scrollbar": "^1.1.0",
33 |         "skycons": "^1.0.0"
34 |     }
35 | }
36 | 


--------------------------------------------------------------------------------
/public/assets/static/images/404.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/404.png


--------------------------------------------------------------------------------
/public/assets/static/images/500.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/500.png


--------------------------------------------------------------------------------
/public/assets/static/images/bg.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/bg.jpg


--------------------------------------------------------------------------------
/public/assets/static/images/datatables/sort_asc.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/datatables/sort_asc.png


--------------------------------------------------------------------------------
/public/assets/static/images/datatables/sort_asc_disabled.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/datatables/sort_asc_disabled.png


--------------------------------------------------------------------------------
/public/assets/static/images/datatables/sort_both.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/datatables/sort_both.png


--------------------------------------------------------------------------------
/public/assets/static/images/datatables/sort_desc.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/datatables/sort_desc.png


--------------------------------------------------------------------------------
/public/assets/static/images/datatables/sort_desc_disabled.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/datatables/sort_desc_disabled.png


--------------------------------------------------------------------------------
/public/assets/static/images/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/public/assets/static/images/logo.png


--------------------------------------------------------------------------------
/public/assets/static/images/logo.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3388.25 3014.2"><title>react-1</title><circle cx="1694.17" cy="1504.25" r="302.6" fill="#fff"/><path d="M1806.5,1191.9c406.2,0,783.6,58.3,1068.1,156.2,342.8,118,553.6,296.9,553.6,458.9,0,168.8-223.4,358.9-591.5,480.8-278.3,92.2-644.6,140.4-1030.2,140.4-395.4,0-769.7-45.2-1051.2-141.4C399.2,2165.1,184.7,1972.6,184.7,1807c0-160.7,201.3-338.2,539.3-456,285.6-99.5,672.3-159.1,1082.5-159.1Z" transform="translate(-112.33 -302.85)" fill="none" stroke="#fff" stroke-miterlimit="10" stroke-width="144.75"/><path d="M1271,1501.3c202.9-351.9,442-649.7,669-847.2,273.5-238,533.8-331.2,674.1-250.3,146.2,84.3,199.3,372.8,121,752.7-59.2,287.2-200.4,628.5-393.1,962.6-197.5,342.5-423.7,644.2-647.6,840-283.3,247.7-557.3,337.3-700.7,254.6-139.2-80.3-192.4-343.3-125.7-695,56.4-297.4,198-662.1,403-1017.4Z" transform="translate(-112.33 -302.85)" fill="none" stroke="#fff" stroke-miterlimit="10" stroke-width="144.75"/><path d="M1271.5,2119.8C1068,1768.2,929.4,1412.4,871.6,1117.1c-69.6-355.8-20.4-627.9,119.8-709,146.1-84.6,422.5,13.5,712.5,271,219.3,194.7,444.4,487.5,637.6,821.3,198.1,342.2,346.6,688.8,404.3,980.5,73.1,369.2,13.9,651.3-129.4,734.2-139.1,80.5-393.5-4.7-664.9-238.2-229.2-197.3-474.5-502.1-680-857.1Z" transform="translate(-112.33 -302.85)" fill="none" stroke="#fff" stroke-miterlimit="10" stroke-width="144.75"/></svg>


--------------------------------------------------------------------------------
/resources/assets/js/admin.js:
--------------------------------------------------------------------------------
1 | try {
2 |     window.$ = window.jQuery = require('jquery');
3 | } catch (e) {}
4 | 
5 | // Admin scripts
6 | require('./admin/index');


--------------------------------------------------------------------------------
/resources/assets/js/admin/charts/chartJS/index.js:
--------------------------------------------------------------------------------
  1 | import Chart from 'chart.js';
  2 | import { COLORS } from '../../constants/colors';
  3 | 
  4 | export default (function () {
  5 |   // ------------------------------------------------------
  6 |   // @Line Charts
  7 |   // ------------------------------------------------------
  8 | 
  9 |   const lineChartBox = document.getElementById('line-chart');
 10 | 
 11 |   if (lineChartBox) {
 12 |     const lineCtx = lineChartBox.getContext('2d');
 13 |     lineChartBox.height = 80;
 14 | 
 15 |     new Chart(lineCtx, {
 16 |       type: 'line',
 17 |       data: {
 18 |         labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
 19 |         datasets: [{
 20 |           label                : 'Series A',
 21 |           backgroundColor      : 'rgba(237, 231, 246, 0.5)',
 22 |           borderColor          : COLORS['deep-purple-500'],
 23 |           pointBackgroundColor : COLORS['deep-purple-700'],
 24 |           borderWidth          : 2,
 25 |           data                 : [60, 50, 70, 60, 50, 70, 60],
 26 |         }, {
 27 |           label                : 'Series B',
 28 |           backgroundColor      : 'rgba(232, 245, 233, 0.5)',
 29 |           borderColor          : COLORS['blue-500'],
 30 |           pointBackgroundColor : COLORS['blue-700'],
 31 |           borderWidth          : 2,
 32 |           data                 : [70, 75, 85, 70, 75, 85, 70],
 33 |         }],
 34 |       },
 35 | 
 36 |       options: {
 37 |         legend: {
 38 |           display: false,
 39 |         },
 40 |       },
 41 | 
 42 |     });
 43 |   }
 44 | 
 45 |   // ------------------------------------------------------
 46 |   // @Bar Charts
 47 |   // ------------------------------------------------------
 48 | 
 49 |   const barChartBox = document.getElementById('bar-chart');
 50 | 
 51 |   if (barChartBox) {
 52 |     const barCtx = barChartBox.getContext('2d');
 53 | 
 54 |     new Chart(barCtx, {
 55 |       type: 'bar',
 56 |       data: {
 57 |         labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
 58 |         datasets: [{
 59 |           label           : 'Dataset 1',
 60 |           backgroundColor : COLORS['deep-purple-500'],
 61 |           borderColor     : COLORS['deep-purple-800'],
 62 |           borderWidth     : 1,
 63 |           data            : [10, 50, 20, 40, 60, 30, 70],
 64 |         }, {
 65 |           label           : 'Dataset 2',
 66 |           backgroundColor : COLORS['light-blue-500'],
 67 |           borderColor     : COLORS['light-blue-800'],
 68 |           borderWidth     : 1,
 69 |           data            : [10, 50, 20, 40, 60, 30, 70],
 70 |         }],
 71 |       },
 72 | 
 73 |       options: {
 74 |         responsive: true,
 75 |         legend: {
 76 |           position: 'bottom',
 77 |         },
 78 |       },
 79 |     });
 80 |   }
 81 | 
 82 |   // ------------------------------------------------------
 83 |   // @Area Charts
 84 |   // ------------------------------------------------------
 85 | 
 86 |   const areaChartBox = document.getElementById('area-chart');
 87 | 
 88 |   if (areaChartBox) {
 89 |     const areaCtx = areaChartBox.getContext('2d');
 90 | 
 91 |     new Chart(areaCtx, {
 92 |       type: 'line',
 93 |       data: {
 94 |         labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
 95 |         datasets: [{
 96 |           backgroundColor : 'rgba(3, 169, 244, 0.5)',
 97 |           borderColor     : COLORS['light-blue-800'],
 98 |           data            : [10, 50, 20, 40, 60, 30, 70],
 99 |           label           : 'Dataset',
100 |           fill            : 'start',
101 |         }],
102 |       },
103 |     });
104 |   }
105 | 
106 |   // ------------------------------------------------------
107 |   // @Scatter Charts
108 |   // ------------------------------------------------------
109 | 
110 |   const scatterChartBox = document.getElementById('scatter-chart');
111 | 
112 |   if (scatterChartBox) {
113 |     const scatterCtx = scatterChartBox.getContext('2d');
114 | 
115 |     Chart.Scatter(scatterCtx, {
116 |       data: {
117 |         datasets: [{
118 |           label           : 'My First dataset',
119 |           borderColor     : COLORS['red-500'],
120 |           backgroundColor : COLORS['red-500'],
121 |           data: [
122 |             { x: 10, y: 20 },
123 |             { x: 30, y: 40 },
124 |             { x: 50, y: 60 },
125 |             { x: 70, y: 80 },
126 |             { x: 90, y: 100 },
127 |             { x: 110, y: 120 },
128 |             { x: 130, y: 140 },
129 |           ],
130 |         }, {
131 |           label           : 'My Second dataset',
132 |           borderColor     : COLORS['green-500'],
133 |           backgroundColor : COLORS['green-500'],
134 |           data: [
135 |             { x: 150, y: 160 },
136 |             { x: 170, y: 180 },
137 |             { x: 190, y: 200 },
138 |             { x: 210, y: 220 },
139 |             { x: 230, y: 240 },
140 |             { x: 250, y: 260 },
141 |             { x: 270, y: 280 },
142 |           ],
143 |         }],
144 |       },
145 |     });
146 |   }
147 | }())
148 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/charts/easyPieChart/index.js:
--------------------------------------------------------------------------------
 1 | import 'easy-pie-chart/dist/jquery.easypiechart.min.js';
 2 | 
 3 | export default (function () {
 4 |   if ($('.easy-pie-chart').length > 0) {
 5 |     $('.easy-pie-chart').easyPieChart({
 6 |       onStep(from, to, percent) {
 7 |         this.el.children[0].innerHTML = `${Math.round(percent)} %`;
 8 |       },
 9 |     });
10 |   }
11 | }())
12 | 
13 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/charts/index.js:
--------------------------------------------------------------------------------
1 | import './chartJS';
2 | import './easyPieChart';
3 | import './sparkline';
4 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/charts/sparkline/index.js:
--------------------------------------------------------------------------------
  1 | import 'jquery-sparkline';
  2 | import { debounce } from 'lodash';
  3 | import { COLORS } from '../../constants/colors';
  4 | 
  5 | export default (function () {
  6 |   // ------------------------------------------------------
  7 |   // @Dashboard Sparklines
  8 |   // ------------------------------------------------------
  9 | 
 10 |   const drawSparklines = () => {
 11 |     if ($('#sparklinedash').length > 0) {
 12 |       $('#sparklinedash').sparkline([0, 5, 6, 10, 9, 12, 4, 9], {
 13 |         type: 'bar',
 14 |         height: '20',
 15 |         barWidth: '3',
 16 |         resize: true,
 17 |         barSpacing: '3',
 18 |         barColor: '#4caf50',
 19 |       });
 20 |     }
 21 | 
 22 |     if ($('#sparklinedash2').length > 0) {
 23 |       $('#sparklinedash2').sparkline([0, 5, 6, 10, 9, 12, 4, 9], {
 24 |         type: 'bar',
 25 |         height: '20',
 26 |         barWidth: '3',
 27 |         resize: true,
 28 |         barSpacing: '3',
 29 |         barColor: '#9675ce',
 30 |       });
 31 |     }
 32 | 
 33 |     if ($('#sparklinedash3').length > 0) {
 34 |       $('#sparklinedash3').sparkline([0, 5, 6, 10, 9, 12, 4, 9], {
 35 |         type: 'bar',
 36 |         height: '20',
 37 |         barWidth: '3',
 38 |         resize: true,
 39 |         barSpacing: '3',
 40 |         barColor: '#03a9f3',
 41 |       });
 42 |     }
 43 | 
 44 |     if ($('#sparklinedash4').length > 0) {
 45 |       $('#sparklinedash4').sparkline([0, 5, 6, 10, 9, 12, 4, 9], {
 46 |         type: 'bar',
 47 |         height: '20',
 48 |         barWidth: '3',
 49 |         resize: true,
 50 |         barSpacing: '3',
 51 |         barColor: '#f96262',
 52 |       });
 53 |     }
 54 |   };
 55 | 
 56 |   drawSparklines();
 57 | 
 58 |   // Redraw sparklines on resize
 59 |   $(window).resize(debounce(drawSparklines, 150));
 60 | 
 61 |   // ------------------------------------------------------
 62 |   // @Other Sparklines
 63 |   // ------------------------------------------------------
 64 | 
 65 |   $('#sparkline').sparkline(
 66 |     [5, 6, 7, 9, 9, 5, 3, 2, 2, 4, 6, 7],
 67 |     {
 68 |       type: 'line',
 69 |       resize: true,
 70 |       height: '20',
 71 |     }
 72 |   );
 73 | 
 74 |   $('#compositebar').sparkline(
 75 |     'html',
 76 |     {
 77 |       type: 'bar',
 78 |       resize: true,
 79 |       barColor: '#aaf',
 80 |       height: '20',
 81 |     }
 82 |   );
 83 | 
 84 |   $('#compositebar').sparkline(
 85 |     [4, 1, 5, 7, 9, 9, 8, 7, 6, 6, 4, 7, 8, 4, 3, 2, 2, 5, 6, 7],
 86 |     {
 87 |       composite: true,
 88 |       fillColor: false,
 89 |       lineColor: 'red',
 90 |       resize: true,
 91 |       height: '20',
 92 |     }
 93 |   );
 94 | 
 95 |   $('#normalline').sparkline(
 96 |     'html',
 97 |     {
 98 |       fillColor: false,
 99 |       normalRangeMin: -1,
100 |       resize: true,
101 |       normalRangeMax: 8,
102 |       height: '20',
103 |     }
104 |   );
105 | 
106 |   $('.sparktristate').sparkline(
107 |     'html',
108 |     {
109 |       type: 'tristate',
110 |       resize: true,
111 |       height: '20',
112 |     }
113 |   );
114 | 
115 |   $('.sparktristatecols').sparkline(
116 |     'html',
117 |     {
118 |       type: 'tristate',
119 |       colorMap: {
120 |         '-2': '#fa7',
121 |         resize: true,
122 |         '2': '#44f',
123 |         height: '20',
124 |       },
125 |     }
126 |   );
127 | 
128 |   const values    = [5, 4, 5, -2, 0, 3, -5, 6, 7, 9, 9, 5, -3, -2, 2, -4];
129 |   const valuesAlt = [1, 1, 0, 1, -1, -1, 1, -1, 0, 0, 1, 1];
130 | 
131 |   $('.sparkline').sparkline(values, {
132 |     type: 'line',
133 |     barWidth: 4,
134 |     barSpacing: 5,
135 |     fillColor: '',
136 |     lineColor: COLORS['red-500'],
137 |     lineWidth: 2,
138 |     spotRadius: 3,
139 |     spotColor: COLORS['red-500'],
140 |     maxSpotColor: COLORS['red-500'],
141 |     minSpotColor: COLORS['red-500'],
142 |     highlightSpotColor: COLORS['red-500'],
143 |     highlightLineColor: '',
144 |     tooltipSuffix: ' Bzzt',
145 |     tooltipPrefix: 'Hello ',
146 |     width: 100,
147 |     height: undefined,
148 |     barColor: '9f0',
149 |     negBarColor: 'ff0',
150 |     stackedBarColor: ['ff0', '9f0', '999', 'f60'],
151 |     sliceColors: ['ff0', '9f0', '000', 'f60'],
152 |     offset: '30',
153 |     borderWidth: 1,
154 |     borderColor: '000',
155 |   });
156 | 
157 |   $('.sparkbar').sparkline(values, {
158 |     type: 'bar',
159 |     barWidth: 4,
160 |     barSpacing: 1,
161 |     fillColor: '',
162 |     lineColor: COLORS['deep-purple-500'],
163 |     tooltipSuffix: 'Celsius',
164 |     width: 100,
165 |     barColor: '39f',
166 |     negBarColor: COLORS['deep-purple-500'],
167 |     stackedBarColor: ['ff0', '9f0', '999', 'f60'],
168 |     sliceColors: ['ff0', '9f0', '000', 'f60'],
169 |     offset: '30',
170 |     borderWidth: 1,
171 |     borderColor: '000',
172 |   });
173 | 
174 |   $('.sparktri').sparkline(valuesAlt, {
175 |     type: 'tristate',
176 |     barWidth: 4,
177 |     barSpacing: 1,
178 |     fillColor: '',
179 |     lineColor: COLORS['light-blue-500'],
180 |     tooltipSuffix: 'Celsius',
181 |     width: 100,
182 |     barColor: COLORS['light-blue-500'],
183 |     posBarColor: COLORS['light-blue-500'],
184 |     negBarColor: 'f90',
185 |     zeroBarColor: '000',
186 |     stackedBarColor: ['ff0', '9f0', '999', 'f60'],
187 |     sliceColors: ['ff0', '9f0', '000', 'f60'],
188 |     offset: '30',
189 |     borderWidth: 1,
190 |     borderColor: '000',
191 |   });
192 | 
193 |   $('.sparkdisc').sparkline(values, {
194 |     type: 'discrete',
195 |     barWidth: 4,
196 |     barSpacing: 5,
197 |     fillColor: '',
198 |     lineColor: '9f0',
199 |     tooltipSuffix: 'Celsius',
200 |     width: 100,
201 |     barColor: '9f0',
202 | 
203 |     negBarColor: 'f90',
204 | 
205 |     stackedBarColor: ['ff0', '9f0', '999', 'f60'],
206 |     sliceColors: ['ff0', '9f0', '000', 'f60'],
207 |     offset: '30',
208 |     borderWidth: 1,
209 |     borderColor: '000',
210 |   });
211 | 
212 |   $('.sparkbull').sparkline(values, {
213 |     type: 'bullet',
214 |     barWidth: 4,
215 |     barSpacing: 5,
216 |     fillColor: '',
217 |     lineColor: COLORS['amber-500'],
218 |     tooltipSuffix: 'Celsius',
219 |     height: 'auto',
220 |     width: 'auto',
221 |     targetWidth: 'auto',
222 |     barColor: COLORS['amber-500'],
223 |     negBarColor: 'ff0',
224 |     stackedBarColor: ['ff0', '9f0', '999', 'f60'],
225 |     sliceColors: ['ff0', '9f0', '000', 'f60'],
226 |     offset: '30',
227 |     borderWidth: 1,
228 |     borderColor: '000',
229 |   });
230 | 
231 |   $('.sparkbox').sparkline(values, {
232 |     type: 'box',
233 |     barWidth: 4,
234 |     barSpacing: 5,
235 |     fillColor: '',
236 |     lineColor: '9f0',
237 |     tooltipSuffix: 'Celsius',
238 |     width: 100,
239 |     barColor: '9f0',
240 |     negBarColor: 'ff0',
241 |     stackedBarColor: ['ff0', '9f0', '999', 'f60'],
242 |     sliceColors: ['ff0', '9f0', '000', 'f60'],
243 |     offset: '30',
244 |     borderWidth: 1,
245 |     borderColor: '000',
246 |   });
247 | }())
248 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/chat/index.js:
--------------------------------------------------------------------------------
1 | export default (function () {
2 |   $('#chat-sidebar-toggle').on('click', e => {
3 |     $('#chat-sidebar').toggleClass('open');
4 |     e.preventDefault();
5 |   });
6 | }())
7 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/constants/colors.js:
--------------------------------------------------------------------------------
  1 | const COLORS = {
  2 |   'white'                 : '#ffffff',
  3 |   'red-50'                : '#ffebee',
  4 |   'red-100'               : '#ffcdd2',
  5 |   'red-200'               : '#ef9a9a',
  6 |   'red-300'               : '#e57373',
  7 |   'red-400'               : '#ef5350',
  8 |   'red-500'               : '#f44336',
  9 |   'red-600'               : '#e53935',
 10 |   'red-700'               : '#d32f2f',
 11 |   'red-800'               : '#c62828',
 12 |   'red-900'               : '#b71c1c',
 13 |   'red-a100'              : '#ff8a80',
 14 |   'red-a200'              : '#ff5252',
 15 |   'red-a400'              : '#ff1744',
 16 |   'red-a700'              : '#d50000',
 17 |   'pink-50'               : '#fce4ec',
 18 |   'pink-100'              : '#f8bbd0',
 19 |   'pink-200'              : '#f48fb1',
 20 |   'pink-300'              : '#f06292',
 21 |   'pink-400'              : '#ec407a',
 22 |   'pink-500'              : '#e91e63',
 23 |   'pink-600'              : '#d81b60',
 24 |   'pink-700'              : '#c2185b',
 25 |   'pink-800'              : '#ad1457',
 26 |   'pink-900'              : '#880e4f',
 27 |   'pink-a100'             : '#ff80ab',
 28 |   'pink-a200'             : '#ff4081',
 29 |   'pink-a400'             : '#f50057',
 30 |   'pink-a700'             : '#c51162',
 31 |   'purple-50'             : '#f3e5f5',
 32 |   'purple-100'            : '#e1bee7',
 33 |   'purple-200'            : '#ce93d8',
 34 |   'purple-300'            : '#ba68c8',
 35 |   'purple-400'            : '#ab47bc',
 36 |   'purple-500'            : '#9c27b0',
 37 |   'purple-600'            : '#8e24aa',
 38 |   'purple-700'            : '#7b1fa2',
 39 |   'purple-800'            : '#6a1b9a',
 40 |   'purple-900'            : '#4a148c',
 41 |   'purple-a100'           : '#ea80fc',
 42 |   'purple-a200'           : '#e040fb',
 43 |   'purple-a400'           : '#d500f9',
 44 |   'purple-a700'           : '#aa00ff',
 45 |   'deep-purple-50'        : '#ede7f6',
 46 |   'deep-purple-100'       : '#d1c4e9',
 47 |   'deep-purple-200'       : '#b39ddb',
 48 |   'deep-purple-300'       : '#9575cd',
 49 |   'deep-purple-400'       : '#7e57c2',
 50 |   'deep-purple-500'       : '#673ab7',
 51 |   'deep-purple-600'       : '#5e35b1',
 52 |   'deep-purple-700'       : '#512da8',
 53 |   'deep-purple-800'       : '#4527a0',
 54 |   'deep-purple-900'       : '#311b92',
 55 |   'deep-purple-a100'      : '#b388ff',
 56 |   'deep-purple-a200'      : '#7c4dff',
 57 |   'deep-purple-a400'      : '#651fff',
 58 |   'deep-purple-a700'      : '#6200ea',
 59 |   'indigo-50'             : '#e8eaf6',
 60 |   'indigo-100'            : '#c5cae9',
 61 |   'indigo-200'            : '#9fa8da',
 62 |   'indigo-300'            : '#7986cb',
 63 |   'indigo-400'            : '#5c6bc0',
 64 |   'indigo-500'            : '#3f51b5',
 65 |   'indigo-600'            : '#3949ab',
 66 |   'indigo-700'            : '#303f9f',
 67 |   'indigo-800'            : '#283593',
 68 |   'indigo-900'            : '#1a237e',
 69 |   'indigo-a100'           : '#8c9eff',
 70 |   'indigo-a200'           : '#536dfe',
 71 |   'indigo-a400'           : '#3d5afe',
 72 |   'indigo-a700'           : '#304ffe',
 73 |   'blue-50'               : '#e3f2fd',
 74 |   'blue-100'              : '#bbdefb',
 75 |   'blue-200'              : '#90caf9',
 76 |   'blue-300'              : '#64b5f6',
 77 |   'blue-400'              : '#42a5f5',
 78 |   'blue-500'              : '#2196f3',
 79 |   'blue-600'              : '#1e88e5',
 80 |   'blue-700'              : '#1976d2',
 81 |   'blue-800'              : '#1565c0',
 82 |   'blue-900'              : '#0d47a1',
 83 |   'blue-a100'             : '#82b1ff',
 84 |   'blue-a200'             : '#448aff',
 85 |   'blue-a400'             : '#2979ff',
 86 |   'blue-a700'             : '#2962ff',
 87 |   'light-blue-50'         : '#e1f5fe',
 88 |   'light-blue-100'        : '#b3e5fc',
 89 |   'light-blue-200'        : '#81d4fa',
 90 |   'light-blue-300'        : '#4fc3f7',
 91 |   'light-blue-400'        : '#29b6f6',
 92 |   'light-blue-500'        : '#03a9f4',
 93 |   'light-blue-600'        : '#039be5',
 94 |   'light-blue-700'        : '#0288d1',
 95 |   'light-blue-800'        : '#0277bd',
 96 |   'light-blue-900'        : '#01579b',
 97 |   'light-blue-a100'       : '#80d8ff',
 98 |   'light-blue-a200'       : '#40c4ff',
 99 |   'light-blue-a400'       : '#00b0ff',
100 |   'light-blue-a700'       : '#0091ea',
101 |   'cyan-50'               : '#e0f7fa',
102 |   'cyan-100'              : '#b2ebf2',
103 |   'cyan-200'              : '#80deea',
104 |   'cyan-300'              : '#4dd0e1',
105 |   'cyan-400'              : '#26c6da',
106 |   'cyan-500'              : '#00bcd4',
107 |   'cyan-600'              : '#00acc1',
108 |   'cyan-700'              : '#0097a7',
109 |   'cyan-800'              : '#00838f',
110 |   'cyan-900'              : '#006064',
111 |   'cyan-a100'             : '#84ffff',
112 |   'cyan-a200'             : '#18ffff',
113 |   'cyan-a400'             : '#00e5ff',
114 |   'cyan-a700'             : '#00b8d4',
115 |   'teal-50'               : '#e0f2f1',
116 |   'teal-100'              : '#b2dfdb',
117 |   'teal-200'              : '#80cbc4',
118 |   'teal-300'              : '#4db6ac',
119 |   'teal-400'              : '#26a69a',
120 |   'teal-500'              : '#009688',
121 |   'teal-600'              : '#00897b',
122 |   'teal-700'              : '#00796b',
123 |   'teal-800'              : '#00695c',
124 |   'teal-900'              : '#004d40',
125 |   'teal-a100'             : '#a7ffeb',
126 |   'teal-a200'             : '#64ffda',
127 |   'teal-a400'             : '#1de9b6',
128 |   'teal-a700'             : '#00bfa5',
129 |   'green-50'              : '#e8f5e9',
130 |   'green-100'             : '#c8e6c9',
131 |   'green-200'             : '#a5d6a7',
132 |   'green-300'             : '#81c784',
133 |   'green-400'             : '#66bb6a',
134 |   'green-500'             : '#4caf50',
135 |   'green-600'             : '#43a047',
136 |   'green-700'             : '#388e3c',
137 |   'green-800'             : '#2e7d32',
138 |   'green-900'             : '#1b5e20',
139 |   'green-a100'            : '#b9f6ca',
140 |   'green-a200'            : '#69f0ae',
141 |   'green-a400'            : '#00e676',
142 |   'green-a700'            : '#00c853',
143 |   'light-green-50'        : '#f1f8e9',
144 |   'light-green-100'       : '#dcedc8',
145 |   'light-green-200'       : '#c5e1a5',
146 |   'light-green-300'       : '#aed581',
147 |   'light-green-400'       : '#9ccc65',
148 |   'light-green-500'       : '#8bc34a',
149 |   'light-green-600'       : '#7cb342',
150 |   'light-green-700'       : '#689f38',
151 |   'light-green-800'       : '#558b2f',
152 |   'light-green-900'       : '#33691e',
153 |   'light-green-a100'      : '#ccff90',
154 |   'light-green-a200'      : '#b2ff59',
155 |   'light-green-a400'      : '#76ff03',
156 |   'light-green-a700'      : '#64dd17',
157 |   'lime-50'               : '#f9fbe7',
158 |   'lime-100'              : '#f0f4c3',
159 |   'lime-200'              : '#e6ee9c',
160 |   'lime-300'              : '#dce775',
161 |   'lime-400'              : '#d4e157',
162 |   'lime-500'              : '#cddc39',
163 |   'lime-600'              : '#c0ca33',
164 |   'lime-700'              : '#afb42b',
165 |   'lime-800'              : '#9e9d24',
166 |   'lime-900'              : '#827717',
167 |   'lime-a100'             : '#f4ff81',
168 |   'lime-a200'             : '#eeff41',
169 |   'lime-a400'             : '#c6ff00',
170 |   'lime-a700'             : '#aeea00',
171 |   'yellow-50'             : '#fffde7',
172 |   'yellow-100'            : '#fff9c4',
173 |   'yellow-200'            : '#fff59d',
174 |   'yellow-300'            : '#fff176',
175 |   'yellow-400'            : '#ffee58',
176 |   'yellow-500'            : '#ffeb3b',
177 |   'yellow-600'            : '#fdd835',
178 |   'yellow-700'            : '#fbc02d',
179 |   'yellow-800'            : '#f9a825',
180 |   'yellow-900'            : '#f57f17',
181 |   'yellow-a100'           : '#ffff8d',
182 |   'yellow-a200'           : '#ffff00',
183 |   'yellow-a400'           : '#ffea00',
184 |   'yellow-a700'           : '#ffd600',
185 |   'amber-50'              : '#fff8e1',
186 |   'amber-100'             : '#ffecb3',
187 |   'amber-200'             : '#ffe082',
188 |   'amber-300'             : '#ffd54f',
189 |   'amber-400'             : '#ffca28',
190 |   'amber-500'             : '#ffc107',
191 |   'amber-600'             : '#ffb300',
192 |   'amber-700'             : '#ffa000',
193 |   'amber-800'             : '#ff8f00',
194 |   'amber-900'             : '#ff6f00',
195 |   'amber-a100'            : '#ffe57f',
196 |   'amber-a200'            : '#ffd740',
197 |   'amber-a400'            : '#ffc400',
198 |   'amber-a700'            : '#ffab00',
199 |   'orange-50'             : '#fff3e0',
200 |   'orange-100'            : '#ffe0b2',
201 |   'orange-200'            : '#ffcc80',
202 |   'orange-300'            : '#ffb74d',
203 |   'orange-400'            : '#ffa726',
204 |   'orange-500'            : '#ff9800',
205 |   'orange-600'            : '#fb8c00',
206 |   'orange-700'            : '#f57c00',
207 |   'orange-800'            : '#ef6c00',
208 |   'orange-900'            : '#e65100',
209 |   'orange-a100'           : '#ffd180',
210 |   'orange-a200'           : '#ffab40',
211 |   'orange-a400'           : '#ff9100',
212 |   'orange-a700'           : '#ff6d00',
213 |   'deep-orange-50'        : '#fbe9e7',
214 |   'deep-orange-100'       : '#ffccbc',
215 |   'deep-orange-200'       : '#ffab91',
216 |   'deep-orange-300'       : '#ff8a65',
217 |   'deep-orange-400'       : '#ff7043',
218 |   'deep-orange-500'       : '#ff5722',
219 |   'deep-orange-600'       : '#f4511e',
220 |   'deep-orange-700'       : '#e64a19',
221 |   'deep-orange-800'       : '#d84315',
222 |   'deep-orange-900'       : '#bf360c',
223 |   'deep-orange-a100'      : '#ff9e80',
224 |   'deep-orange-a200'      : '#ff6e40',
225 |   'deep-orange-a400'      : '#ff3d00',
226 |   'deep-orange-a700'      : '#dd2c00',
227 |   'brown-50'              : '#efebe9',
228 |   'brown-100'             : '#d7ccc8',
229 |   'brown-200'             : '#bcaaa4',
230 |   'brown-300'             : '#a1887f',
231 |   'brown-400'             : '#8d6e63',
232 |   'brown-500'             : '#795548',
233 |   'brown-600'             : '#6d4c41',
234 |   'brown-700'             : '#5d4037',
235 |   'brown-800'             : '#4e342e',
236 |   'brown-900'             : '#3e2723',
237 |   'grey-50'               : '#fafafa',
238 |   'grey-100'              : '#f5f5f5',
239 |   'grey-200'              : '#eeeeee',
240 |   'grey-300'              : '#e0e0e0',
241 |   'grey-400'              : '#bdbdbd',
242 |   'grey-500'              : '#9e9e9e',
243 |   'grey-600'              : '#757575',
244 |   'grey-700'              : '#616161',
245 |   'grey-800'              : '#424242',
246 |   'grey-900'              : '#212121',
247 |   'blue-grey-50'          : '#eceff1',
248 |   'blue-grey-100'         : '#cfd8dc',
249 |   'blue-grey-200'         : '#b0bec5',
250 |   'blue-grey-300'         : '#90a4ae',
251 |   'blue-grey-400'         : '#78909c',
252 |   'blue-grey-500'         : '#607d8b',
253 |   'blue-grey-600'         : '#546e7a',
254 |   'blue-grey-700'         : '#455a64',
255 |   'blue-grey-800'         : '#37474f',
256 |   'blue-grey-900'         : '#263238',
257 | };
258 | 
259 | const GREYS = {
260 |   'grey-100' : '#f9fafb',
261 |   'grey-200' : '#f2f3f5',
262 |   'grey-300' : '#e6eaf0',
263 |   'grey-400' : '#d3d9e3',
264 |   'grey-500' : '#b9c2d0',
265 |   'grey-600' : '#7c8695',
266 |   'grey-700' : '#72777a',
267 |   'grey-800' : '#565a5c',
268 |   'grey-900' : '#313435',
269 | };
270 | 
271 | export {
272 |   COLORS,
273 |   GREYS,
274 | };
275 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/datatable/index.js:
--------------------------------------------------------------------------------
1 | import 'datatables';
2 | 
3 | export default (function () {
4 |   $('#dataTable').DataTable();
5 | }());
6 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/datepicker/index.js:
--------------------------------------------------------------------------------
1 | import 'bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js';
2 | import 'bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css';
3 | 
4 | export default (function () {
5 |   $('.start-date').datepicker();
6 |   $('.end-date').datepicker();
7 | }())
8 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/email/index.js:
--------------------------------------------------------------------------------
 1 | export default (function () {
 2 |   $('.email-side-toggle').on('click', e => {
 3 |     $('.email-app').toggleClass('side-active');
 4 |     e.preventDefault();
 5 |   });
 6 | 
 7 |   $('.email-list-item, .back-to-mailbox').on('click', e => {
 8 |     $('.email-content').toggleClass('open');
 9 |     e.preventDefault();
10 |   });
11 | }())
12 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/fullcalendar/index.js:
--------------------------------------------------------------------------------
 1 | import 'fullcalendar/dist/fullcalendar.min.js';
 2 | import 'fullcalendar/dist/fullcalendar.min.css';
 3 | 
 4 | export default (function () {
 5 |   const date = new Date();
 6 |   const d    = date.getDate();
 7 |   const m    = date.getMonth();
 8 |   const y    = date.getFullYear();
 9 | 
10 |   const events = [{
11 |     title  : 'All Day Event',
12 |     start  : new Date(y, m, 1),
13 |     desc   : 'Meetings',
14 |     bullet : 'success',
15 |   }, {
16 |     title  : 'Long Event',
17 |     start  : new Date(y, m, d - 5),
18 |     end    : new Date(y, m, d - 2),
19 |     desc   : 'Hangouts',
20 |     bullet : 'success',
21 |   }, {
22 |     title  : 'Repeating Event',
23 |     start  : new Date(y, m, d - 3, 16, 0),
24 |     allDay : false,
25 |     desc   : 'Product Checkup',
26 |     bullet : 'warning',
27 |   }, {
28 |     title  : 'Repeating Event',
29 |     start  : new Date(y, m, d + 4, 16, 0),
30 |     allDay : false,
31 |     desc   : 'Conference',
32 |     bullet : 'danger',
33 |   }, {
34 |     title  : 'Birthday Party',
35 |     start  : new Date(y, m, d + 1, 19, 0),
36 |     end    : new Date(y, m, d + 1, 22, 30),
37 |     allDay : false,
38 |     desc   : 'Gathering',
39 |   }, {
40 |     title  : 'Click for Google',
41 |     start  : new Date(y, m, 28),
42 |     end    : new Date(y, m, 29),
43 |     url    : 'http ://google.com/',
44 |     desc   : 'Google',
45 |     bullet : 'success',
46 |   }];
47 | 
48 |   $('#full-calendar').fullCalendar({
49 |     events,
50 |     height   : 800,
51 |     editable : true,
52 |     header: {
53 |       left   : 'month,agendaWeek,agendaDay',
54 |       center : 'title',
55 |       right  : 'today prev,next',
56 |     },
57 |   });
58 | }())
59 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/googleMaps/index.js:
--------------------------------------------------------------------------------
 1 | import loadGoogleMapsAPI  from 'load-google-maps-api';
 2 | 
 3 | export default (function () {
 4 |   if ($('#google-map').length > 0) {
 5 |     loadGoogleMapsAPI({
 6 |       key: 'AIzaSyDW8td30_gj6sGXjiMU0ALeMu1SDEwUnEA',
 7 |     }).then(() => {
 8 |       const latitude  = 26.8206;
 9 |       const longitude = 30.8025;
10 |       const mapZoom   = 5;
11 |       const { google }    = window;
12 | 
13 |       const mapOptions = {
14 |         center    : new google.maps.LatLng(latitude, longitude),
15 |         zoom      : mapZoom,
16 |         mapTypeId : google.maps.MapTypeId.ROADMAP,
17 |         styles: [{
18 |           'featureType': 'landscape',
19 |           'stylers': [
20 |             { 'hue'        : '#FFBB00' },
21 |             { 'saturation' : 43.400000000000006 },
22 |             { 'lightness'  : 37.599999999999994 },
23 |             { 'gamma'      : 1 },
24 |           ],
25 |         }, {
26 |           'featureType': 'road.highway',
27 |           'stylers': [
28 |             { 'hue'        : '#FFC200' },
29 |             { 'saturation' : -61.8 },
30 |             { 'lightness'  : 45.599999999999994 },
31 |             { 'gamma'      : 1 },
32 |           ],
33 |         }, {
34 |           'featureType': 'road.arterial',
35 |           'stylers': [
36 |             { 'hue'        : '#FF0300' },
37 |             { 'saturation' : -100 },
38 |             { 'lightness'  : 51.19999999999999 },
39 |             { 'gamma'      : 1 },
40 |           ],
41 |         }, {
42 |           'featureType': 'road.local',
43 |           'stylers': [
44 |             { 'hue'        : '#FF0300' },
45 |             { 'saturation' : -100 },
46 |             { 'lightness'  : 52 },
47 |             { 'gamma'      : 1 },
48 |           ],
49 |         }, {
50 |           'featureType': 'water',
51 |           'stylers': [
52 |             { 'hue'        : '#0078FF' },
53 |             { 'saturation' : -13.200000000000003 },
54 |             { 'lightness'  : 2.4000000000000057 },
55 |             { 'gamma'      : 1 },
56 |           ],
57 |         }, {
58 |           'featureType': 'poi',
59 |           'stylers': [
60 |             { 'hue'        : '#00FF6A' },
61 |             { 'saturation' : -1.0989010989011234 },
62 |             { 'lightness'  : 11.200000000000017 },
63 |             { 'gamma'      : 1 },
64 |           ],
65 |         }],
66 |       };
67 | 
68 |       const map = new google.maps.Map(document.getElementById('google-map'), mapOptions);
69 | 
70 |       new google.maps.Marker({
71 |         map,
72 |         position : new google.maps.LatLng(latitude, longitude),
73 |         visible  : true,
74 |       });
75 |     });
76 |   }
77 | }())
78 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/index.js:
--------------------------------------------------------------------------------
 1 | // import '../styles/index.scss';
 2 | 
 3 | import './masonry';
 4 | import './charts';
 5 | import './popover';
 6 | import './scrollbar';
 7 | import './search';
 8 | import './sidebar';
 9 | import './skycons';
10 | import './vectorMaps';
11 | import './chat';
12 | import './datatable';
13 | import './datepicker';
14 | import './email';
15 | import './fullcalendar';
16 | import './googleMaps';
17 | import './utils';
18 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/masonry/index.js:
--------------------------------------------------------------------------------
 1 | import Masonry from 'masonry-layout';
 2 | 
 3 | export default (function () {
 4 |   window.addEventListener('load', () => {
 5 |     if ($('.masonry').length > 0) {
 6 |       new Masonry('.masonry', {
 7 |         itemSelector: '.masonry-item',
 8 |         columnWidth: '.masonry-sizer',
 9 |         percentPosition: true,
10 |       });
11 |     }
12 |   });
13 | }());
14 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/popover/index.js:
--------------------------------------------------------------------------------
 1 | import 'bootstrap';
 2 | 
 3 | export default (function () {
 4 |   // ------------------------------------------------------
 5 |   // @Popover
 6 |   // ------------------------------------------------------
 7 | 
 8 |   $('[data-toggle="popover"]').popover();
 9 | 
10 |   // ------------------------------------------------------
11 |   // @Tooltips
12 |   // ------------------------------------------------------
13 | 
14 |   $('[data-toggle="tooltip"]').tooltip();
15 | }());
16 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/scrollbar/index.js:
--------------------------------------------------------------------------------
 1 | import PerfectScrollbar from 'perfect-scrollbar';
 2 | 
 3 | export default (function () {
 4 |   const scrollables = $('.scrollable');
 5 |   if (scrollables.length > 0) {
 6 |     scrollables.each((index, el) => {
 7 |       new PerfectScrollbar(el);
 8 |     });
 9 |   }
10 | }());
11 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/search/index.js:
--------------------------------------------------------------------------------
1 | export default (function () {
2 |   $('.search-toggle').on('click', e => {
3 |     $('.search-box, .search-input').toggleClass('active');
4 |     $('.search-input input').focus();
5 |     e.preventDefault();
6 |   });
7 | }());
8 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/sidebar/index.js:
--------------------------------------------------------------------------------
 1 | export default (function () {
 2 |   // Sidebar links
 3 |   $('.sidebar .sidebar-menu li a').on('click', function () {
 4 |     const $this = $(this);
 5 | 
 6 |     if ($this.parent().hasClass('open')) {
 7 |       $this
 8 |         .parent()
 9 |         .children('.dropdown-menu')
10 |         .slideUp(200, () => {
11 |           $this.parent().removeClass('open');
12 |         });
13 |     } else {
14 |       $this
15 |         .parent()
16 |         .parent()
17 |         .children('li.open')
18 |         .children('.dropdown-menu')
19 |         .slideUp(200);
20 | 
21 |       $this
22 |         .parent()
23 |         .parent()
24 |         .children('li.open')
25 |         .children('a')
26 |         .removeClass('open');
27 | 
28 |       $this
29 |         .parent()
30 |         .parent()
31 |         .children('li.open')
32 |         .removeClass('open');
33 | 
34 |       $this
35 |         .parent()
36 |         .children('.dropdown-menu')
37 |         .slideDown(200, () => {
38 |           $this.parent().addClass('open');
39 |         });
40 |     }
41 |   });
42 | 
43 |   // Sidebar Activity Class
44 |   const sidebarLinks = $('.sidebar').find('.sidebar-link');
45 | 
46 |   sidebarLinks
47 |     .each((index, el) => {
48 |       $(el).removeClass('active');
49 |     })
50 |     .filter(function () {
51 |       const href = $(this).attr('href');
52 |       const pattern = href[0] === '/' ? href.substr(1) : href;
53 |       return pattern === (window.location.pathname).substr(1);
54 |     })
55 |     .addClass('active');
56 | 
57 |   // ٍSidebar Toggle
58 |   $('.sidebar-toggle').on('click', e => {
59 |     $('.app').toggleClass('is-collapsed');
60 |     e.preventDefault();
61 |   });
62 | 
63 |   /**
64 |    * Wait untill sidebar fully toggled (animated in/out)
65 |    * then trigger window resize event in order to recalculate
66 |    * masonry layout widths and gutters.
67 |    */
68 |   $('#sidebar-toggle').click(e => {
69 |     e.preventDefault();
70 |     setTimeout(() => {
71 |       window.dispatchEvent(window.EVENT);
72 |     }, 300);
73 |   });
74 | }());
75 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/skycons/index.js:
--------------------------------------------------------------------------------
 1 | import SkyconsInit from 'skycons';
 2 | 
 3 | const Skycons = SkyconsInit(window);
 4 | 
 5 | export default (function () {
 6 |   const icons = new Skycons({ 'color': '#ff6849' });
 7 |   const list  = [
 8 |     'clear-day',
 9 |     'clear-night',
10 |     'partly-cloudy-day',
11 |     'partly-cloudy-night',
12 |     'cloudy',
13 |     'rain',
14 |     'sleet',
15 |     'snow',
16 |     'wind',
17 |     'fog',
18 |   ];
19 |   let i = list.length;
20 | 
21 |   while (i--) {
22 |     const
23 |       weatherType = list[i],
24 |       elements    = document.getElementsByClassName(weatherType);
25 |     let j = elements.length;
26 | 
27 |     while (j--) {
28 |       icons.set(elements[j], weatherType);
29 |     }
30 |   }
31 | 
32 |   icons.play();
33 | }());
34 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/utils/index.js:
--------------------------------------------------------------------------------
 1 | export default (function () {
 2 |   // ------------------------------------------------------
 3 |   // @Window Resize
 4 |   // ------------------------------------------------------
 5 | 
 6 |   /**
 7 |    * NOTE: Register resize event for Masonry layout
 8 |    */
 9 |   const EVENT = document.createEvent('UIEvents');
10 |   window.EVENT = EVENT;
11 |   EVENT.initUIEvent('resize', true, false, window, 0);
12 | 
13 | 
14 |   window.addEventListener('load', () => {
15 |     /**
16 |      * Trigger window resize event after page load
17 |      * for recalculation of masonry layout.
18 |      */
19 |     window.dispatchEvent(EVENT);
20 |   });
21 | 
22 |   // ------------------------------------------------------
23 |   // @External Links
24 |   // ------------------------------------------------------
25 | 
26 |   // Open external links in new window
27 |   $('a')
28 |     .filter('[href^="http"], [href^="//"]')
29 |     .not(`[href*="${window.location.host}"]`)
30 |     .attr('rel', 'noopener noreferrer')
31 |     .attr('target', '_blank');
32 | 
33 |   // ------------------------------------------------------
34 |   // @Resize Trigger
35 |   // ------------------------------------------------------
36 | 
37 |   // Trigger resize on any element click
38 |   document.addEventListener('click', () => {
39 |     window.dispatchEvent(window.EVENT);
40 |   });
41 | }());
42 | 


--------------------------------------------------------------------------------
/resources/assets/js/admin/vectorMaps/index.js:
--------------------------------------------------------------------------------
 1 | import 'jvectormap';
 2 | import 'jvectormap/jquery-jvectormap.css';
 3 | import './jquery-jvectormap-world-mill.js';
 4 | import { debounce } from 'lodash';
 5 | 
 6 | export default (function () {
 7 |   const vectorMapInit = () => {
 8 |     if ($('#world-map-marker').length > 0) {
 9 |       // This is a hack, as the .empty() did not do the work
10 |       $('#vmap').remove();
11 | 
12 |       // we recreate (after removing it) the container div, to reset all the data of the map
13 |       $('#world-map-marker').append(`
14 |         <div
15 |           id="vmap"
16 |           style="
17 |             height: 490px;
18 |             position: relative;
19 |             overflow: hidden;
20 |             background-color: transparent;
21 |           "
22 |         >
23 |         </div>
24 |       `);
25 | 
26 |       $('#vmap').vectorMap({
27 |         map: 'world_mill',
28 |         backgroundColor: '#fff',
29 |         borderColor: '#fff',
30 |         borderOpacity: 0.25,
31 |         borderWidth: 0,
32 |         color: '#e6e6e6',
33 |         regionStyle : {
34 |           initial : {
35 |             fill : '#e4ecef',
36 |           },
37 |         },
38 | 
39 |         markerStyle: {
40 |           initial: {
41 |             r: 7,
42 |             'fill': '#fff',
43 |             'fill-opacity':1,
44 |             'stroke': '#000',
45 |             'stroke-width' : 2,
46 |             'stroke-opacity': 0.4,
47 |           },
48 |         },
49 | 
50 |         markers : [{
51 |           latLng : [21.00, 78.00],
52 |           name : 'INDIA : 350',
53 |         }, {
54 |           latLng : [-33.00, 151.00],
55 |           name : 'Australia : 250',
56 |         }, {
57 |           latLng : [36.77, -119.41],
58 |           name : 'USA : 250',
59 |         }, {
60 |           latLng : [55.37, -3.41],
61 |           name : 'UK   : 250',
62 |         }, {
63 |           latLng : [25.20, 55.27],
64 |           name : 'UAE : 250',
65 |         }],
66 |         series: {
67 |           regions: [{
68 |             values: {
69 |               'US': 298,
70 |               'SA': 200,
71 |               'AU': 760,
72 |               'IN': 200,
73 |               'GB': 120,
74 |             },
75 |             scale: ['#03a9f3', '#02a7f1'],
76 |             normalizeFunction: 'polynomial',
77 |           }],
78 |         },
79 |         hoverOpacity: null,
80 |         normalizeFunction: 'linear',
81 |         zoomOnScroll: false,
82 |         scaleColors: ['#b6d6ff', '#005ace'],
83 |         selectedColor: '#c9dfaf',
84 |         selectedRegions: [],
85 |         enableZoom: false,
86 |         hoverColor: '#fff',
87 |       });
88 |     }
89 |   };
90 | 
91 |   vectorMapInit();
92 |   $(window).resize(debounce(vectorMapInit, 150));
93 | })();
94 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin.scss:
--------------------------------------------------------------------------------
1 | // Admin styles
2 | @import "admin/index";


--------------------------------------------------------------------------------
/resources/assets/sass/admin/index.scss:
--------------------------------------------------------------------------------
1 | @import 'spec/settings/index';
2 | @import 'spec/tools/index';
3 | @import "~bootstrap/scss/bootstrap";
4 | @import 'spec/index';
5 | @import 'vendor/index';
6 | 
7 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/easyPieChart.scss:
--------------------------------------------------------------------------------
 1 | .easy-pie-chart {
 2 |   position: relative;
 3 | 
 4 |   span {
 5 |     position: absolute;
 6 |     top: 50%;
 7 |     left: 50%;
 8 |     transform: translate(-50%, -50%);
 9 |     line-height: 0;
10 |   }
11 | }
12 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/footer.scss:
--------------------------------------------------------------------------------
1 | footer {
2 |   z-index: 1;
3 |   position: relative;
4 | }
5 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/forms.scss:
--------------------------------------------------------------------------------
  1 | .checkbox label {
  2 |   display: inline-block;
  3 |   vertical-align: middle;
  4 |   position: relative;
  5 |   padding-left: 17px;
  6 |   margin-bottom: 0;
  7 | }
  8 | 
  9 | .checkbox label::before {
 10 |   content: "";
 11 |   display: inline-block;
 12 |   position: absolute;
 13 |   width: 17px;
 14 |   height: 17px;
 15 |   left: 0;
 16 |   top: 50%;
 17 |   transform: translateY(-50%);
 18 |   margin-left: -12px;
 19 |   border: 1px solid $grey-300;
 20 |   border-radius: 3px;
 21 |   background-color: $md-white;
 22 |   -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
 23 |   -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
 24 |   transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
 25 | }
 26 | 
 27 | .checkbox label::after {
 28 |   display: inline-block;
 29 |   position: absolute;
 30 |   width: 17px;
 31 |   height: 17px;
 32 |   text-align: center;
 33 |   font-size: 10px !important;
 34 |   line-height: 17px;
 35 |   left: 0;
 36 |   top: 50%;
 37 |   transform: translateY(-50%);
 38 |   margin-left: -12px;
 39 |   color: $grey-500;
 40 | }
 41 | 
 42 | .checkbox input[type="checkbox"] {
 43 |   opacity: 0;
 44 |   z-index: 1;
 45 | }
 46 | 
 47 | .checkbox input[type="checkbox"]:focus + label::before {
 48 |   outline: thin dotted;
 49 |   outline: 5px auto -webkit-focus-ring-color;
 50 |   outline-offset: -2px;
 51 | }
 52 | 
 53 | .checkbox input[type="checkbox"]:checked + label::after {
 54 |   font-family: 'FontAwesome';
 55 |   content: "\f00c";
 56 |   font-size: 13px;
 57 | }
 58 | 
 59 | .checkbox input[type="checkbox"]:disabled + label {
 60 |   opacity: 0.65;
 61 | }
 62 | 
 63 | .checkbox input[type="checkbox"]:disabled + label::before {
 64 |   background-color: $grey-400;
 65 |   cursor: not-allowed;
 66 | }
 67 | 
 68 | .checkbox.checkbox-circle label::before {
 69 |   border-radius: 50%;
 70 | }
 71 | 
 72 | .checkbox.checkbox-inline {
 73 |   margin-top: 0;
 74 | }
 75 | 
 76 | .checkbox-primary input[type="checkbox"]:checked + label::before {
 77 |   background-color: $default-primary;
 78 |   border-color: $default-primary;
 79 | }
 80 | 
 81 | .checkbox-primary input[type="checkbox"]:checked + label::after {
 82 |   color: #fff;
 83 | }
 84 | 
 85 | .checkbox-danger input[type="checkbox"]:checked + label::before {
 86 |   background-color: $default-danger;
 87 |   border-color: $default-danger;
 88 | }
 89 | 
 90 | .checkbox-danger input[type="checkbox"]:checked + label::after {
 91 |   color: $md-white;
 92 | }
 93 | 
 94 | .checkbox-info input[type="checkbox"]:checked + label::before {
 95 |   background-color: $default-info;
 96 |   border-color: $default-info;
 97 | }
 98 | 
 99 | .checkbox-info input[type="checkbox"]:checked + label::after {
100 |   color: $md-white;
101 | }
102 | 
103 | .checkbox-warning input[type="checkbox"]:checked + label::before {
104 |   background-color: $default-warning;
105 |   border-color: $default-warning;
106 | }
107 | 
108 | .checkbox-warning input[type="checkbox"]:checked + label::after {
109 |   color: $md-white;
110 | }
111 | 
112 | .checkbox-success input[type="checkbox"]:checked + label::before {
113 |   background-color: $default-success;
114 |   border-color: $default-success;
115 | }
116 | 
117 | .checkbox-success input[type="checkbox"]:checked + label::after {
118 |   color: $md-white;
119 | }
120 | 
121 | .radio {
122 |   padding-left: 20px;
123 | }
124 | 
125 | .radio label {
126 |   display: inline-block;
127 |   vertical-align: middle;
128 |   position: relative;
129 |   padding-left: 5px;
130 | }
131 | 
132 | .radio label::before {
133 |   content: "";
134 |   display: inline-block;
135 |   position: absolute;
136 |   width: 17px;
137 |   height: 17px;
138 |   left: 0;
139 |   margin-left: -20px;
140 |   border: 1px solid #cccccc;
141 |   border-radius: 50%;
142 |   background-color: #fff;
143 |   -webkit-transition: border 0.15s ease-in-out;
144 |   -o-transition: border 0.15s ease-in-out;
145 |   transition: border 0.15s ease-in-out;
146 | }
147 | 
148 | .radio label::after {
149 |   display: inline-block;
150 |   position: absolute;
151 |   content: " ";
152 |   width: 11px;
153 |   height: 11px;
154 |   left: 3px;
155 |   top: 3px;
156 |   margin-left: -20px;
157 |   border-radius: 50%;
158 |   background-color: #555555;
159 |   -webkit-transform: scale(0, 0);
160 |   -ms-transform: scale(0, 0);
161 |   -o-transform: scale(0, 0);
162 |   transform: scale(0, 0);
163 |   -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
164 |   -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
165 |   -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
166 |   transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
167 | }
168 | 
169 | .radio input[type="radio"] {
170 |   opacity: 0;
171 |   z-index: 1;
172 | }
173 | 
174 | .radio input[type="radio"]:focus + label::before {
175 |   outline: thin dotted;
176 |   outline: 5px auto -webkit-focus-ring-color;
177 |   outline-offset: -2px;
178 | }
179 | 
180 | .radio input[type="radio"]:checked + label::after {
181 |   -webkit-transform: scale(1, 1);
182 |   -ms-transform: scale(1, 1);
183 |   -o-transform: scale(1, 1);
184 |   transform: scale(1, 1);
185 | }
186 | 
187 | .radio input[type="radio"]:disabled + label {
188 |   opacity: 0.65;
189 | }
190 | 
191 | .radio input[type="radio"]:disabled + label::before {
192 |   cursor: not-allowed;
193 | }
194 | 
195 | .radio.radio-inline {
196 |   margin-top: 0;
197 | }
198 | 
199 | .radio-primary input[type="radio"] + label::after {
200 |   background-color: #428bca;
201 | }
202 | 
203 | .radio-primary input[type="radio"]:checked + label::before {
204 |   border-color: #428bca;
205 | }
206 | 
207 | .radio-primary input[type="radio"]:checked + label::after {
208 |   background-color: #428bca;
209 | }
210 | 
211 | .radio-danger input[type="radio"] + label::after {
212 |   background-color: #d9534f;
213 | }
214 | 
215 | .radio-danger input[type="radio"]:checked + label::before {
216 |   border-color: #d9534f;
217 | }
218 | 
219 | .radio-danger input[type="radio"]:checked + label::after {
220 |   background-color: #d9534f;
221 | }
222 | 
223 | .radio-info input[type="radio"] + label::after {
224 |   background-color: #5bc0de;
225 | }
226 | 
227 | .radio-info input[type="radio"]:checked + label::before {
228 |   border-color: #5bc0de;
229 | }
230 | 
231 | .radio-info input[type="radio"]:checked + label::after {
232 |   background-color: #5bc0de;
233 | }
234 | 
235 | .radio-warning input[type="radio"] + label::after {
236 |   background-color: #f0ad4e;
237 | }
238 | 
239 | .radio-warning input[type="radio"]:checked + label::before {
240 |   border-color: #f0ad4e;
241 | }
242 | 
243 | .radio-warning input[type="radio"]:checked + label::after {
244 |   background-color: #f0ad4e;
245 | }
246 | 
247 | .radio-success input[type="radio"] + label::after {
248 |   background-color: #5cb85c;
249 | }
250 | 
251 | .radio-success input[type="radio"]:checked + label::before {
252 |   border-color: #5cb85c;
253 | }
254 | 
255 | .radio-success input[type="radio"]:checked + label::after {
256 |   background-color: #5cb85c;
257 | }
258 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/index.scss:
--------------------------------------------------------------------------------
 1 | @import 'sidebar';
 2 | @import 'topbar';
 3 | @import 'pageContainer';
 4 | @import 'progressBar';
 5 | @import 'easyPieChart';
 6 | @import 'forms';
 7 | @import 'masonry';
 8 | @import 'loader';
 9 | @import 'footer';
10 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/loader.scss:
--------------------------------------------------------------------------------
 1 | #loader {
 2 |   transition: all 0.3s ease-in-out;
 3 |   opacity: 1;
 4 |   visibility: visible;
 5 | }
 6 | 
 7 | #loader.fadeOut {
 8 |   opacity: 0;
 9 |   visibility: hidden;
10 | }
11 | 
12 | 
13 | 
14 | .spinner {
15 |   width: 40px;
16 |   height: 40px;
17 |   position: absolute;
18 |   top: calc(50% - 20px);
19 |   left: calc(50% - 20px);
20 |   background-color: #333;
21 |   border-radius: 100%;
22 |   -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
23 |   animation: sk-scaleout 1.0s infinite ease-in-out;
24 | }
25 | 
26 | @-webkit-keyframes sk-scaleout {
27 |   0% { -webkit-transform: scale(0) }
28 |   100% {
29 |     -webkit-transform: scale(1.0);
30 |     opacity: 0;
31 |   }
32 | }
33 | 
34 | @keyframes sk-scaleout {
35 |   0% {
36 |     -webkit-transform: scale(0);
37 |     transform: scale(0);
38 |   } 100% {
39 |     -webkit-transform: scale(1.0);
40 |     transform: scale(1.0);
41 |     opacity: 0;
42 |   }
43 | }
44 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/masonry.scss:
--------------------------------------------------------------------------------
1 | 
2 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/pageContainer.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @TOC
 3 | // ---------------------------------------------------------
 4 | 
 5 | // + @Page Container
 6 | // + @Main Content
 7 | // + @Full Container
 8 | // + @Collapsed State
 9 | 
10 | // ---------------------------------------------------------
11 | // @Page Container
12 | // ---------------------------------------------------------
13 | 
14 | .page-container {
15 |   min-height: 100vh;
16 |   padding-left: $offscreen-size;
17 |   transition: all 0.2s ease;
18 | 
19 |   @include between($breakpoint-md, $breakpoint-xl) {
20 |     padding-left: $collapsed-size;
21 |   }
22 | 
23 |   @include to($breakpoint-md) {
24 |     padding-left: 0;
25 |   }
26 | }
27 | 
28 | // ---------------------------------------------------------
29 | // @Main Content
30 | // ---------------------------------------------------------
31 | 
32 | .main-content {
33 |   padding: 85px 20px 20px;
34 |   min-height: calc(100vh - 61px);
35 | 
36 |   @include to($breakpoint-md) {
37 |     padding: 85px 5px 5px;
38 |   }
39 | }
40 | 
41 | .remain-height {
42 |   height: calc(100vh - 126px);
43 | }
44 | 
45 | // ---------------------------------------------------------
46 | // @Full Container
47 | // ---------------------------------------------------------
48 | 
49 | .full-container {
50 |   left: $offscreen-size;
51 |   min-height: calc(100vh - #{$header-height});
52 |   position: absolute;
53 |   right: 0;
54 |   top: $header-height;
55 |   transition: all 0.2s ease;
56 | 
57 |   @include between($breakpoint-md, $breakpoint-xl) {
58 |     left: 0;
59 |     padding-left: $collapsed-size;
60 |   }
61 | 
62 |   @include to($breakpoint-md) {
63 |     left: 0;
64 |   }
65 | }
66 | 
67 | // ---------------------------------------------------------
68 | // @Collapsed State
69 | // ---------------------------------------------------------
70 | 
71 | .is-collapsed {
72 |   .page-container {
73 |     padding-left: $collapsed-size;
74 | 
75 |     @include to($breakpoint-md) {
76 |       padding-left: 0;
77 |     }
78 | 
79 |     @include between($breakpoint-md, $breakpoint-xl) {
80 |       padding-left: $offscreen-size;
81 |     }
82 |   }
83 | 
84 |   .full-container {
85 |     left: $collapsed-size;
86 | 
87 |     @include to($breakpoint-md) {
88 |       left: 0;
89 |     }
90 | 
91 |     @include between($breakpoint-md, $breakpoint-xl) {
92 |       left: $offscreen-size;
93 |       padding-left: 0;
94 |     }
95 |   }
96 | }
97 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/progressBar.scss:
--------------------------------------------------------------------------------
1 | .progress {
2 |   height: 4px;
3 |   background-color: #eaeef3;
4 |   border-radius: 4px;
5 |   margin-bottom: 10px;
6 | }
7 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/sidebar.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Sidebar
  6 | // + @Sidebar Inner
  7 | // + @Sidebar Header
  8 | // + @Sidebar Menu
  9 | // + @Sidebar Collapsed
 10 | 
 11 | // ---------------------------------------------------------
 12 | // @Sidebar
 13 | // ---------------------------------------------------------
 14 | 
 15 | .sidebar {
 16 |   background-color: $default-white;
 17 |   bottom: 0;
 18 |   overflow: hidden;
 19 |   position: fixed;
 20 |   top: 0;
 21 |   transition: all 0.2s ease;
 22 |   width: $offscreen-size;
 23 |   z-index: 1000;
 24 | 
 25 |   ul {
 26 |     list-style-type: none;
 27 |   }
 28 | 
 29 |   @include between($breakpoint-md, $breakpoint-xl) {
 30 |     width: $collapsed-size;
 31 | 
 32 |     .sidebar-inner {
 33 |       .sidebar-logo {
 34 |         border-bottom: 1px solid transparent;
 35 |         padding: 0;
 36 | 
 37 |         a {
 38 |           .logo {
 39 |             background-position: center center;
 40 |             width: $collapsed-size;
 41 |           }
 42 |         }
 43 |       }
 44 | 
 45 |       .sidebar-menu {
 46 |         overflow-x: hidden;
 47 | 
 48 |         > li {
 49 |           > a {
 50 |             .title {
 51 |               display: none;
 52 |             }
 53 |           }
 54 |         }
 55 | 
 56 |         li {
 57 |           &.dropdown {
 58 |             .arrow {
 59 |               opacity: 0;
 60 |             }
 61 | 
 62 |             &.open {
 63 |               ul.dropdown-menu {
 64 |                 display: none !important;
 65 |               }
 66 |             }
 67 |           }
 68 |         }
 69 |       }
 70 |     }
 71 | 
 72 |     &:hover {
 73 |       width: $offscreen-size;
 74 | 
 75 |       .sidebar-inner {
 76 |         .sidebar-logo {
 77 |           border-bottom: 1px solid $border-color;
 78 |           padding: 0 20px;
 79 |         }
 80 | 
 81 |         .sidebar-menu {
 82 |           > li {
 83 |             > a {
 84 |               .title {
 85 |                 display: inline-block;
 86 |               }
 87 |             }
 88 |           }
 89 | 
 90 |           li {
 91 |             &.dropdown {
 92 |               .arrow {
 93 |                 opacity: 1;
 94 |               }
 95 |             }
 96 | 
 97 |             &.open {
 98 |               > ul.dropdown-menu {
 99 |                 display: block !important;
100 |               }
101 |             }
102 |           }
103 |         }
104 |       }
105 |     }
106 |   }
107 | 
108 |   @include to($breakpoint-md) {
109 |     left: -$offscreen-size;
110 |     width: calc(#{$offscreen-size} - 30px);
111 |   }
112 | }
113 | 
114 | // ---------------------------------------------------------
115 | // @Sidebar Inner
116 | // ---------------------------------------------------------
117 | 
118 | .sidebar-inner {
119 |   position: relative;
120 |   height: 100%;
121 | }
122 | 
123 | // ---------------------------------------------------------
124 | // @Sidebar Header
125 | // ---------------------------------------------------------
126 | 
127 | .sidebar-logo {
128 |   border-bottom: 1px solid $border-color;
129 |   border-right: 1px solid $border-color;
130 |   line-height: 0;
131 |   padding: 0 20px;
132 |   transition: all 0.2s ease;
133 | 
134 |   a {
135 |     display: inline-block;
136 |     width: 100%;
137 | 
138 |     .logo {
139 |       background-position: center left;
140 |       background-repeat: no-repeat;
141 |       display: inline-block;
142 |       min-height: calc(#{$header-height} - 1px);
143 |       width: 100%;
144 |       width: 70px;
145 |     }
146 | 
147 |     .logo-text {
148 |       color: $grey-900;
149 |     }
150 |   }
151 | 
152 |   .mobile-toggle {
153 |     display: none;
154 |     float: right;
155 |     font-size: 18px;
156 |     line-height: calc(#{$header-height} - 1px);
157 | 
158 |     a {
159 |       color: $default-text-color;
160 |     }
161 | 
162 |     @include to($breakpoint-md) {
163 |       display: inline-block;
164 |     }
165 | 
166 |     @include between($breakpoint-md, $breakpoint-xl) {
167 |       display: none;
168 |     }
169 |   }
170 | }
171 | 
172 | // ---------------------------------------------------------
173 | // @Sidebar Menu
174 | // ---------------------------------------------------------
175 | 
176 | .sidebar-menu {
177 |   @include clearfix;
178 |   border-right: 1px solid $border-color;
179 |   height: calc(100vh - #{$header-height});
180 |   list-style: none;
181 |   margin: 0;
182 |   overflow: auto;
183 |   padding: 0;
184 |   position: relative;
185 | 
186 |   .dropdown-toggle::after {
187 |     display: none;
188 |   }
189 | 
190 |   .sidebar-link {
191 |     &.active::before {
192 |       background: $md-blue-500;
193 |       border-radius: 50%;
194 |       content: '';
195 |       display: block;
196 |       height: 8px;
197 |       left: -4px;
198 |       position: absolute;
199 |       top: calc(50% - 4px);
200 |       width: 8px;
201 |     }
202 |   }
203 | 
204 |   li {
205 |     position: relative;
206 | 
207 |     &.dropdown {
208 |       .arrow {
209 |         font-size: 10px;
210 |         line-height: 40px;
211 |         position: absolute;
212 |         right: 30px;
213 |         transition: all 0.05s ease-in;
214 | 
215 |         @include to($breakpoint-md) {
216 |           right: 25px;
217 |         }
218 |       }
219 | 
220 |       &.open {
221 |         > a {
222 |           color: $default-dark;
223 | 
224 |           .icon-holder {
225 |             color: $default-info;
226 |           }
227 | 
228 |           > .arrow {
229 |             transform: rotate(90deg);
230 |           }
231 |         }
232 | 
233 |         > .dropdown-menu {
234 |           display: block;
235 | 
236 |           .dropdown-menu {
237 |             padding-left: 20px;
238 |           }
239 | 
240 |           .arrow {
241 |             line-height: 25px;
242 |           }
243 |         }
244 |       }
245 |     }
246 | 
247 |     a {
248 |       color: $default-text-color;
249 |       transition: all 0.3s ease;
250 | 
251 |       &:hover,
252 |       &:focus {
253 |         color: $default-dark;
254 |         text-decoration: none;
255 | 
256 |         .icon-holder {
257 |           color: $default-info;
258 |         }
259 |       }
260 |     }
261 |   }
262 | 
263 |   > li {
264 |     &.dropdown {
265 |       ul {
266 |         &.dropdown-menu {
267 |           background-color: transparent;
268 |           border-radius: 0;
269 |           border: 0;
270 |           box-shadow: none;
271 |           float: none;
272 |           padding-left: 50px;
273 |           padding-top: 0;
274 |           position: relative;
275 |           width: 100%;
276 | 
277 |           > li {
278 |             > a {
279 |               display: block;
280 |               padding: 10px 15px;
281 | 
282 |               &:hover,
283 |               &:focus {
284 |                 background-color: transparent;
285 |                 color: $default-dark;
286 |               }
287 |             }
288 | 
289 |             &.active {
290 |               a {
291 |                 color: $default-dark;
292 |               }
293 |             }
294 |           }
295 |         }
296 |       }
297 |     }
298 | 
299 |     > a {
300 |       display: block;
301 |       font-size: 15px;
302 |       font-weight: 500;
303 |       padding: 5px 15px;
304 |       position: relative;
305 |       white-space: nowrap;
306 | 
307 |       .icon-holder {
308 |         border-radius: 6px;
309 |         display: inline-block;
310 |         font-size: 17px;
311 |         height: 35px;
312 |         left: 0;
313 |         line-height: 35px;
314 |         margin-right: 14px;
315 |         position: relative;
316 |         text-align: center;
317 |         transition: all 0.3s ease;
318 |         width: 35px;
319 |       }
320 |     }
321 |   }
322 | }
323 | 
324 | // ---------------------------------------------------------
325 | // @Sidebar Collapsed
326 | // ---------------------------------------------------------
327 | 
328 | .is-collapsed {
329 |   .sidebar {
330 |     @include from($breakpoint-xl) {
331 |       width: $collapsed-size;
332 | 
333 |       .sidebar-inner {
334 |         .sidebar-logo {
335 |           border-bottom: 1px solid transparent;
336 |           padding: 0;
337 |         }
338 | 
339 |         .sidebar-menu {
340 |           overflow-x: hidden;
341 | 
342 |           > li {
343 |             > a {
344 |               .title {
345 |                 display: none;
346 |               }
347 |             }
348 |           }
349 | 
350 |           li {
351 |             &.dropdown {
352 |               .arrow {
353 |                 opacity: 0;
354 |               }
355 | 
356 |               &.open {
357 |                 ul.dropdown-menu {
358 |                   display: none !important;
359 |                 }
360 |               }
361 |             }
362 |           }
363 |         }
364 |       }
365 | 
366 |       &:hover {
367 |         width: $offscreen-size;
368 | 
369 |         .sidebar-inner {
370 |           .sidebar-logo {
371 |             border-bottom: 1px solid $border-color;
372 |             padding: 0 20px;
373 |           }
374 | 
375 |           .sidebar-menu {
376 |             > li {
377 |               > a {
378 |                 .title {
379 |                   display: inline-block;
380 |                 }
381 |               }
382 |             }
383 | 
384 |             li {
385 |               &.dropdown {
386 |                 .arrow {
387 |                   opacity: 1;
388 |                 }
389 |               }
390 | 
391 |               &.open {
392 |                 > ul.dropdown-menu {
393 |                   display: block !important;
394 |                 }
395 |               }
396 |             }
397 |           }
398 |         }
399 |       }
400 |     }
401 | 
402 |     @include between($breakpoint-md, $breakpoint-xl) {
403 |       width: $offscreen-size;
404 | 
405 |       .sidebar-inner {
406 |         .sidebar-logo {
407 |           border-bottom: 1px solid $border-color;
408 |           padding: 0 20px;
409 | 
410 |           > a {
411 |             .logo {
412 |               background-position: center left;
413 |               width: 150px;
414 |             }
415 |           }
416 |         }
417 | 
418 |         .sidebar-menu {
419 |           > li {
420 |             > a {
421 |               .title {
422 |                 display: inline-block;
423 |               }
424 |             }
425 |           }
426 | 
427 |           li {
428 |             &.dropdown {
429 |               .arrow {
430 |                 opacity: 1;
431 |               }
432 |             }
433 | 
434 |             &.open {
435 |               > ul.dropdown-menu {
436 |                 display: block !important;
437 |               }
438 |             }
439 |           }
440 |         }
441 |       }
442 |     }
443 | 
444 |     @include to($breakpoint-md) {
445 |       left: 0;
446 |     }
447 |   }
448 | }
449 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/components/topbar.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | 
  4 | // + @Topbar
  5 | // + @Collapsed State
  6 | 
  7 | // ---------------------------------------------------------
  8 | // @Topbar
  9 | // ---------------------------------------------------------
 10 | 
 11 | .header {
 12 |   background-color: $default-white;
 13 |   border-bottom: 1px solid $border-color;
 14 |   display: block;
 15 |   height: $header-height;
 16 |   margin-bottom: 0;
 17 |   padding: 0;
 18 |   position: fixed;
 19 |   transition: all 0.2s ease;
 20 |   width: calc(100% - #{$offscreen-size});
 21 |   z-index: 800;
 22 | 
 23 |   @include to($breakpoint-md) {
 24 |     width: 100%;
 25 |   }
 26 | 
 27 |   @include between($breakpoint-md, $breakpoint-xl) {
 28 |     width: calc(100% - #{$collapsed-size});
 29 |   }
 30 | 
 31 |   .header-container {
 32 |     @include clearfix;
 33 | 
 34 |     .nav-left,
 35 |     .nav-right {
 36 |       list-style: none;
 37 |       margin-bottom: 0;
 38 |       padding-left: 0;
 39 |       position: relative;
 40 | 
 41 |       > li {
 42 |         float: left;
 43 | 
 44 |         > a {
 45 |           color: $default-text-color;
 46 |           display: block;
 47 |           line-height: $header-height;
 48 |           min-height: $header-height;
 49 |           padding: 0 15px;
 50 |           transition: all 0.2s ease-in-out;
 51 | 
 52 |           i {
 53 |             font-size: 17px;
 54 |           }
 55 | 
 56 |           &:hover,
 57 |           &:focus {
 58 |             color: $default-dark;
 59 |             text-decoration: none;
 60 |           }
 61 | 
 62 |           @include to($breakpoint-md) {
 63 |             padding: 0 15px;
 64 |           }
 65 |         }
 66 |       }
 67 | 
 68 |       .notifications {
 69 |         position: relative;
 70 | 
 71 |         .counter {
 72 |           background-color: $default-danger;
 73 |           border-radius: 50px;
 74 |           color: $default-white;
 75 |           font-size: 10px;
 76 |           line-height: 1;
 77 |           padding: 3px 5.5px;
 78 |           position: absolute;
 79 |           right: 6px;
 80 |           top: 12px;
 81 |         }
 82 | 
 83 |         .dropdown-menu {
 84 |           min-width: 350px;
 85 |           padding: 0;
 86 | 
 87 |           @include to($breakpoint-sm) {
 88 |             max-width: 300px;
 89 |           }
 90 |         }
 91 |       }
 92 |     }
 93 | 
 94 |     .dropdown-menu {
 95 |       display: block;
 96 |       margin: 0;
 97 |       transform-origin: top right;
 98 |       transform: scale(0, 0);
 99 |       transition: transform 0.15s ease-out;
100 | 
101 |       .divider {
102 |         border-bottom: 1px solid $border-color;
103 |         height: 1px;
104 |         overflow: hidden;
105 |       }
106 | 
107 |       > li {
108 |         > a {
109 |           transition: all 0.2s ease-out;
110 |         }
111 |       }
112 |     }
113 | 
114 |     .show {
115 |       .dropdown-menu {
116 |         transform: scale(1, 1);
117 |       }
118 |     }
119 | 
120 |     .nav-left {
121 |       float: left;
122 |       margin-left: 15px;
123 |     }
124 | 
125 |     .nav-right {
126 |       float: right;
127 | 
128 |       .dropdown-menu {
129 |         left: auto;
130 |         right: 0;
131 | 
132 |         > li {
133 |           width: 100%;
134 | 
135 |           > a {
136 |             line-height: 1.5;
137 |             min-height: auto;
138 |             padding: 10px 15px;
139 |           }
140 |         }
141 |       }
142 |     }
143 |   }
144 | 
145 |   .search-box {
146 |     .search-icon-close {
147 |       display: none;
148 |     }
149 | 
150 |     &.active {
151 |       .search-icon {
152 |         display: none;
153 |       }
154 | 
155 |       .search-icon-close {
156 |         display: inline-block;
157 |       }
158 |     }
159 |   }
160 | 
161 |   .search-input {
162 |     display: none;
163 | 
164 |     &.active {
165 |       display: inline-block;
166 |     }
167 | 
168 |     input {
169 |       background-color: transparent;
170 |       border: 0;
171 |       box-shadow: none;
172 |       font-size: 18px;
173 |       height: 40px;
174 |       margin-top: 12px;
175 |       outline: none;
176 |       padding: 5px;
177 | 
178 |       @include to($breakpoint-sm) {
179 |         width: 85px;
180 |       }
181 | 
182 |       @include placeholder {
183 |         color: lighten($default-text-color, 20%);
184 |         font-style: italic;
185 |       }
186 |     }
187 |   }
188 | }
189 | 
190 | // ---------------------------------------------------------
191 | // @Collapsed State
192 | // ---------------------------------------------------------
193 | 
194 | .is-collapsed {
195 |   .header {
196 |     width: calc(100% - #{$collapsed-size});
197 | 
198 |     @include to($breakpoint-md) {
199 |       width: 100%;
200 |     }
201 | 
202 |     @include between($breakpoint-md, $breakpoint-xl) {
203 |       width: calc(100% - #{$offscreen-size});
204 |     }
205 |   }
206 | }
207 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/generic/base.scss:
--------------------------------------------------------------------------------
 1 | html, html a, body {
 2 |   -webkit-font-smoothing: antialiased;
 3 | }
 4 | 
 5 | a {
 6 |   transition: all 0.3s ease-in-out;
 7 | }
 8 | 
 9 | body {
10 |   font-family: $font-primary;
11 |   font-size: 14px;
12 |   color: $default-text-color;
13 |   line-height: 1.5;
14 |   letter-spacing: 0.2px;
15 |   overflow-x: hidden;
16 | }
17 | 
18 | h1,
19 | h2,
20 | h3,
21 | h4,
22 | h5,
23 | h6 {
24 |   font-family: $font-secondary;
25 |   letter-spacing: 0.5px;
26 |   line-height: 1.5;
27 | 
28 |   a {
29 |     font-family: $font-secondary;
30 |   }
31 | 
32 |   small {
33 |     font-weight: 300;
34 |     color: lighten($default-dark, 5%);
35 |   }
36 | }
37 | 
38 | p {
39 |   font-family: $font-primary;
40 |   line-height: 1.9;
41 | }
42 | 
43 | .lead {
44 |   font-size: 18px;
45 | }
46 | 
47 | ul {
48 |   margin-bottom: 0;
49 | }
50 | 
51 | a {
52 |   color: $default-info;
53 | 
54 |   &:hover,
55 |   &:focus {
56 |     text-decoration: none;
57 |     color: darken($default-info, 10%);
58 |   }
59 | 
60 |   &:focus {
61 |     outline: none;
62 |   }
63 | 
64 |   &.text-gray {
65 |     &:hover,
66 |     &:focus,
67 |     &.active {
68 |       color: $default-dark !important;
69 |     }
70 |   }
71 | }
72 | 
73 | :focus {
74 |   outline: none;
75 | }
76 | 
77 | hr {
78 |   border-top: 1px solid $border-color;
79 | }
80 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/generic/index.scss:
--------------------------------------------------------------------------------
1 | @import 'base';
2 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/index.scss:
--------------------------------------------------------------------------------
1 | @import 'generic/index';
2 | @import 'components/index';
3 | @import 'screens/index';
4 | @import 'utils/index';
5 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/screens/chat.scss:
--------------------------------------------------------------------------------
 1 | #chat-sidebar {
 2 |   width: 250px;
 3 |   height: calc(100vh - #{$header-height} - 60px);
 4 |   overflow: auto;
 5 | 
 6 |   @include to($breakpoint-md) {
 7 |     transition: all 0.3s ease-in-out;
 8 |     margin-left: -250px;
 9 | 
10 |     &.open {
11 |       margin-left: 0;
12 |     }
13 |   }
14 | }
15 | 
16 | #chat-box {
17 |   height: calc(100vh - #{$header-height} - 60px);
18 |   overflow: auto;
19 | }
20 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/screens/email.scss:
--------------------------------------------------------------------------------
  1 | .email-app {
  2 |   .email-side-nav {
  3 |     background: $default-white;
  4 |     position: fixed;
  5 |     border-right: 1px solid $border-color;
  6 |     float: left;
  7 |     width: 250px;
  8 |     transition: all 0.3s ease-in-out;
  9 | 
 10 |     @include to($breakpoint-md) {
 11 |       z-index: 1;
 12 |       left: -250px;
 13 |     }
 14 |   }
 15 | 
 16 |   .email-wrapper {
 17 |     margin: 0;
 18 |     padding: 0;
 19 |     overflow: auto;
 20 |     min-height: 100%;
 21 |     transition: all 0.3s ease-in-out;
 22 | 
 23 |     @include to($breakpoint-md) {
 24 |       position: absolute;
 25 |       left: 0;
 26 |       width: 100%;
 27 |       overflow-x: hidden;
 28 |     }
 29 | 
 30 |     @include from($breakpoint-md) {
 31 |       margin-left: 250px;
 32 |     }
 33 | 
 34 |     .email-list {
 35 |       position: relative;
 36 |       padding: 0;
 37 |       width: 100%;
 38 |       overflow-y: hidden;
 39 |       background-color: $default-white;
 40 |       height: calc(100vh - #{$header-height});
 41 | 
 42 |       @include to($breakpoint-md) {
 43 |         max-height: calc(100vh - 65px);
 44 |       }
 45 | 
 46 |       @include from($breakpoint-md) {
 47 |         width: 40%;
 48 |         border-right: 1px solid $border-color;
 49 |         float: left;
 50 |       }
 51 |     }
 52 | 
 53 |     .email-content {
 54 |       float: left;
 55 |       width: 60%;
 56 |       position: relative;
 57 |       padding: 0;
 58 |       background-color: $default-white;
 59 |       // min-height: calc(100vh - #{$header-height});
 60 | 
 61 |       &.no-inbox-view {
 62 |         width: 100%;
 63 |       }
 64 | 
 65 |       @include to($breakpoint-md) {
 66 |         position: absolute;
 67 |         top: 0;
 68 |         left: 100%;
 69 |         width: 100%;
 70 |         height: 100%;
 71 |         transition: all 0.3s ease-in-out;
 72 |         max-height: calc(100vh - #{$header-height});
 73 |         overflow-y: scroll;
 74 | 
 75 |         &.open {
 76 |           left: 0;
 77 |         }
 78 |       }
 79 |     }
 80 | 
 81 |       .email-compose {
 82 |         position: relative;
 83 |       .email-compose-body {
 84 |         padding: 30px 20px;
 85 | 
 86 |       }
 87 |       }
 88 |     }
 89 | 
 90 | 
 91 |     &.side-active {
 92 |       .email-side-nav {
 93 |         @include to($breakpoint-md) {
 94 |           left: 0;
 95 |         }
 96 |       }
 97 | 
 98 |       .email-wrapper {
 99 |         @include to($breakpoint-md) {
100 |           left: 250px;
101 |         }
102 |       }
103 |     }
104 | }
105 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/screens/index.scss:
--------------------------------------------------------------------------------
1 | @import 'chat';
2 | @import 'email';
3 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/settings/baseColors.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Greyscale Colors
  6 | // + @Bootstrap Color System
  7 | // + @Default Colors
  8 | // + @Inverted Colors
  9 | // + @Others
 10 | // + @Header Themes
 11 | // + @Social Networks Colors
 12 | 
 13 | // ---------------------------------------------------------
 14 | // @Greyscale Colors
 15 | // ---------------------------------------------------------
 16 | 
 17 | // Colors below are ordered from lightest to darkest
 18 | 
 19 | $grey-100             : #f9fafb;
 20 | $grey-200             : #f2f3f5;
 21 | $grey-300             : #e6eaf0;
 22 | $grey-400             : #d3d9e3;
 23 | $grey-500             : #b9c2d0;
 24 | $grey-600             : #7c8695;
 25 | $grey-700             : #72777a;
 26 | $grey-800             : #565a5c;
 27 | $grey-900             : #313435;
 28 | 
 29 | $grey-colors-alt: (
 30 |   grey-100 : #f9fafb,
 31 |   grey-200 : #f2f3f5,
 32 |   grey-300 : #e6eaf0,
 33 |   grey-400 : #d3d9e3,
 34 |   grey-500 : #b9c2d0,
 35 |   grey-600 : #7c8695,
 36 |   grey-700 : #72777a,
 37 |   grey-800 : #565a5c,
 38 |   grey-900 : #313435,
 39 | );
 40 | 
 41 | // ---------------------------------------------------------
 42 | // @Bootstrap Color System
 43 | // ---------------------------------------------------------
 44 | 
 45 | $blue   : $md-blue-500;
 46 | $indigo : $md-indigo-500;
 47 | $purple : $md-purple-500;
 48 | $pink   : $md-pink-500;
 49 | $red    : $md-red-500;
 50 | $orange : $md-orange-500;
 51 | $yellow : $md-yellow-500;
 52 | $green  : $md-green-500;
 53 | $teal   : $md-teal-500;
 54 | $cyan   : $md-cyan-500;
 55 | 
 56 | // ---------------------------------------------------------
 57 | // @Default Colors
 58 | // ---------------------------------------------------------
 59 | 
 60 | $default-danger       : #ff3c7e;
 61 | $default-dark         : #313435;
 62 | $default-grey         : #565a5c;
 63 | $default-info         : #0f9aee;
 64 | $default-primary      : #7774e7;
 65 | $default-success      : #37c936;
 66 | $default-text-color   : #72777a;
 67 | $default-warning      : #fc0;
 68 | $default-white        : #fff;
 69 | 
 70 | // ---------------------------------------------------------
 71 | // @Inverted Colors
 72 | // ---------------------------------------------------------
 73 | 
 74 | $inverse-danger       : lighten($default-danger, 35%);
 75 | $inverse-info         : lighten($default-info, 45%);
 76 | $inverse-primary      : lighten($default-primary, 30%);
 77 | $inverse-success      : lighten($default-success, 45%);
 78 | $inverse-warning      : lighten($default-warning, 45%);
 79 | 
 80 | // ---------------------------------------------------------
 81 | // @Others
 82 | // ---------------------------------------------------------
 83 | 
 84 | $border-color         : #e6ecf5;
 85 | $collapsed-size       : 70px;
 86 | $header-height        : 65px;
 87 | $offscreen-size       : 280px;
 88 | $side-nav-dark        : #313644;
 89 | $side-nav-dark-border : rgba(120, 130, 140, 0.3);
 90 | $side-nav-dark-font   : #99abb4;
 91 | 
 92 | // ---------------------------------------------------------
 93 | // @Header Themes
 94 | // ---------------------------------------------------------
 95 | 
 96 | $theme-danger         : #f53f61;
 97 | $theme-dark           : lighten($side-nav-dark, 10%);
 98 | $theme-info           : $default-info;
 99 | $theme-primary        : $default-primary;
100 | $theme-success        : desaturate($default-success, 5%);
101 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/settings/borders.scss:
--------------------------------------------------------------------------------
1 | // ---------------------------------------------------------
2 | // @Borders
3 | // ---------------------------------------------------------
4 | 
5 | $border-width: 1px;
6 | $border-color: rgba(0, 0, 0, 0.0625);
7 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/settings/breakpoints.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @Breakpoints
 3 | // ---------------------------------------------------------
 4 | 
 5 | $breakpoint-xl : 1440px;
 6 | $breakpoint-lg : 1200px;
 7 | $breakpoint-md : 992px;
 8 | $breakpoint-sm : 768px;
 9 | $breakpoint-xs : 0;
10 | 
11 | $breakpoints: (
12 |   "xl\\+" "screen and (min-width: #{$breakpoint-xl})",
13 |   "lg\\+" "screen and (min-width: #{$breakpoint-lg})",
14 |   "md\\+" "screen and (min-width: #{$breakpoint-md})",
15 |   "sm\\+" "screen and (min-width: #{$breakpoint-sm})",
16 |   "xs\\+" "screen and (min-width: #{$breakpoint-xs})",
17 | 
18 |   "xl-" "screen and (max-width: #{$breakpoint-xl - 1px})",
19 |   "lg-" "screen and (max-width: #{$breakpoint-lg - 1px})",
20 |   "md-" "screen and (max-width: #{$breakpoint-md - 1px})",
21 |   "sm-" "screen and (max-width: #{$breakpoint-sm - 1px})",
22 | 
23 |   "lg" "screen and (min-width: #{$breakpoint-lg - 1px}) and (max-width: #{$breakpoint-xl - 1px})",
24 |   "md" "screen and (min-width: #{$breakpoint-md - 1px}) and (max-width: #{$breakpoint-lg - 1px})",
25 |   "sm" "screen and (min-width: #{$breakpoint-sm - 1px}) and (max-width: #{$breakpoint-md - 1px})",
26 | );
27 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/settings/fonts.scss:
--------------------------------------------------------------------------------
1 | $font-primary:
2 |   Roboto, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
3 | $font-secondary: $font-primary;
4 | $font-size-base:              0.875rem;
5 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/settings/index.scss:
--------------------------------------------------------------------------------
1 | @import 'breakpoints';
2 | @import 'fonts';
3 | @import 'brandColors';
4 | @import 'materialColors';
5 | @import 'baseColors';
6 | @import 'borders';
7 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/tools/index.scss:
--------------------------------------------------------------------------------
1 | @import 'mixins/index';
2 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/tools/mixins/clearfix.scss:
--------------------------------------------------------------------------------
 1 | //----------------------------------------------------------
 2 | // @Clearfix
 3 | //----------------------------------------------------------
 4 | 
 5 | @mixin clearfix {
 6 |   &::before,
 7 |   &::after {
 8 |     content: ' ';
 9 |     display: table;
10 |   }
11 | 
12 |   &::after {
13 |     clear: both;
14 |   }
15 | }
16 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/tools/mixins/index.scss:
--------------------------------------------------------------------------------
1 | @import 'placeholder';
2 | @import 'clearfix';
3 | @import 'mediaQueriesRanges';
4 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/tools/mixins/mediaQueriesRanges.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @TOC
 3 | // ---------------------------------------------------------
 4 | 
 5 | // + @General Media Query
 6 | // + @All Above Media Query
 7 | // + @All Under Media Query
 8 | // + @Between Two Devices Media Query
 9 | 
10 | // ---------------------------------------------------------
11 | // @General Media Query Mixin
12 | // ---------------------------------------------------------
13 | 
14 | // Mixin used for custom rules that don't follow
15 | // any of the following premade media queries.
16 | 
17 | @mixin mq($condition) {
18 |   @media #{$condition} {
19 |     @content;
20 |   }
21 | }
22 | 
23 | // ---------------------------------------------------------
24 | // @All Above Media Query Mixin
25 | // ---------------------------------------------------------
26 | 
27 | // Mixin used to match certain breakpoint
28 | // and all devices above it.
29 | 
30 | @mixin from($breakpoint) {
31 |   @media screen and (min-width: $breakpoint){
32 |     @content;
33 |   }
34 | }
35 | 
36 | // ---------------------------------------------------------
37 | // @All Under Media Query Mixin
38 | // ---------------------------------------------------------
39 | 
40 | // Mixin used to match all devices under certain breakpoint.
41 | 
42 | @mixin to($breakpoint) {
43 |   @media screen and (max-width: $breakpoint - 1px) {
44 |     @content;
45 |   }
46 | }
47 | 
48 | // ---------------------------------------------------------
49 | // @Between Two Devices Media Query Mixin
50 | // ---------------------------------------------------------
51 | 
52 | // Mixin used to match the devices between 2 breakpoints.
53 | 
54 | @mixin between($start, $end){
55 |   @media screen and (min-width: $start) and (max-width: $end - 1px) {
56 |     @content;
57 |   }
58 | }
59 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/tools/mixins/placeholder.scss:
--------------------------------------------------------------------------------
 1 | //----------------------------------------------------------
 2 | // @Placeholder
 3 | //----------------------------------------------------------
 4 | 
 5 | @mixin placeholder {
 6 |   &::-webkit-input-placeholder { @content; }
 7 |   &:-moz-placeholder { @content; }
 8 |   &::-moz-placeholder { @content; }
 9 |   &:-ms-input-placeholder { @content; }
10 | }
11 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/colors.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @TOC
 3 | // ---------------------------------------------------------
 4 | 
 5 | // + @Material Color
 6 | // + @Grey Colors
 7 | 
 8 | // ---------------------------------------------------------
 9 | // @Material Color
10 | // ---------------------------------------------------------
11 | 
12 | @each $item, $color in $md-colors {
13 |   .c-#{$item},     .cH-#{$item}:hover      { color: $color !important; }
14 |   .bgc-#{$item},   .bgcH-#{$item}:hover    { background-color: $color !important; }
15 |   .bdc-#{$item},   .bdcH-#{$item}:hover    { border-color: $color !important; }
16 |   .fill-#{$item},  .fillH-#{$item}:hover   { fill: $color !important; }
17 |   .str-#{$item},   .strH-#{$item}:hover    { stroke: $color !important; }
18 | }
19 | 
20 | // ---------------------------------------------------------
21 | // @Grey Colors
22 | // ---------------------------------------------------------
23 | 
24 | @each $item, $color in $grey-colors-alt {
25 |   .c-#{$item},     .cH-#{$item}:hover      { color: $color !important; }
26 |   .bgc-#{$item},   .bgcH-#{$item}:hover    { background-color: $color !important; }
27 |   .bdc-#{$item},   .bdcH-#{$item}:hover    { border-color: $color !important; }
28 |   .fill-#{$item},  .fillH-#{$item}:hover   { fill: $color !important; }
29 |   .str-#{$item},   .strH-#{$item}:hover    { stroke: $color !important; }
30 | }
31 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/index.scss:
--------------------------------------------------------------------------------
1 | @import 'layout/index';
2 | @import 'colors';
3 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/border.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @TOC
 3 | // ---------------------------------------------------------
 4 | 
 5 | // + @Quick Border Helpers
 6 | // + @Border Width
 7 | // + @Border Radius
 8 | // + @Border Style
 9 | 
10 | // ---------------------------------------------------------
11 | // @Quick Border Helpers
12 | // ---------------------------------------------------------
13 | 
14 | .bd  { border: #{$border-width} solid #{$border-color} !important; }
15 | .bdT { border-top: #{$border-width} solid #{$border-color} !important; }
16 | .bdR { border-right: #{$border-width} solid #{$border-color} !important; }
17 | .bdB { border-bottom: #{$border-width} solid #{$border-color} !important; }
18 | .bdL { border-left: #{$border-width} solid #{$border-color} !important; }
19 | 
20 | // ---------------------------------------------------------
21 | // @Border Width
22 | // ---------------------------------------------------------
23 | 
24 | @for $i from 0 through 5 {
25 |   .bdw-#{$i}  { border-width: #{$i}px !important; }
26 |   .bdwT-#{$i} { border-top-width: #{$i}px !important; }
27 |   .bdwR-#{$i} { border-right-width: #{$i}px !important; }
28 |   .bdwB-#{$i} { border-bottom-width: #{$i}px !important; }
29 |   .bdwL-#{$i} { border-left-width: #{$i}px !important; }
30 | }
31 | 
32 | // ---------------------------------------------------------
33 | // @Border Radius
34 | // ---------------------------------------------------------
35 | 
36 | @for $i from 0 to 5 {
37 |   .bdrs-#{$i} { border-radius: #{$i}px !important; }
38 | 
39 |   .bdrsT-#{$i} {
40 |     border-top-left-radius: #{$i}px !important;
41 |     border-top-right-radius: #{$i}px !important;
42 |   }
43 | 
44 |   .bdrsR-#{$i} {
45 |     border-top-right-radius: #{$i}px !important;
46 |     border-bottom-right-radius: #{$i}px !important;
47 |   }
48 | 
49 |   .bdrsB-#{$i} {
50 |     border-bottom-left-radius: #{$i}px !important;
51 |     border-bottom-right-radius: #{$i}px !important;
52 |   }
53 | 
54 |   .bdrsL-#{$i} {
55 |     border-top-left-radius: #{$i}px !important;
56 |     border-bottom-left-radius: #{$i}px !important;
57 |   }
58 | }
59 | 
60 | .bdrs-50p  { border-radius: 50% !important; }
61 | .bdrs-10em { border-radius: 10em !important; }
62 | 
63 | // ---------------------------------------------------------
64 | // @Border Style
65 | // ---------------------------------------------------------
66 | 
67 | .bds-n  { border-style: none !important; }
68 | .bds-s  { border-style: solid !important; }
69 | .bds-dt { border-style: dotted !important; }
70 | .bds-ds { border-style: dashed !important; }
71 | .bds-db { border-style: double !important; }
72 | .bds-g  { border-style: groove !important; }
73 | .bds-r  { border-style: ridge !important; }
74 | .bds-i  { border-style: inset !important; }
75 | .bds-o  { border-style: outset !important; }
76 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/flex.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Variables
  6 | // + @Flex Wrap
  7 | // + @Flex Direction
  8 | // + @Flex
  9 | // + @Flex Basis
 10 | // + @Flex Grow
 11 | // + @Flex Shrink
 12 | // + @Flex Order
 13 | 
 14 | // ---------------------------------------------------------
 15 | // @Variables
 16 | // ---------------------------------------------------------
 17 | 
 18 | $responsive: true;
 19 | 
 20 | // ---------------------------------------------------------
 21 | // @Display
 22 | // ---------------------------------------------------------
 23 | 
 24 | .d-f     { display: flex; }
 25 | .d-if    { display: inline-flex; }
 26 | 
 27 | @if ($responsive == true) {
 28 |   @include generateResponsive() {
 29 |     .d-f\@#{$breakpointAlias}     { display: flex; }
 30 |     .d-if\@#{$breakpointAlias}    { display: inline-flex; }
 31 |   }
 32 | }
 33 | 
 34 | // ---------------------------------------------------------
 35 | // @Flex Wrap
 36 | // ---------------------------------------------------------
 37 | 
 38 | .fxw-w   { flex-wrap: wrap; }
 39 | .fxw-wr  { flex-wrap: wrap-reverse; }
 40 | .fxw-nw  { flex-wrap: nowrap; }
 41 | 
 42 | @if ($responsive == true) {
 43 |   @include generateResponsive() {
 44 |     .fxw-w\@#{$breakpointAlias}   { flex-wrap: wrap; }
 45 |     .fxw-wr\@#{$breakpointAlias}  { flex-wrap: wrap-reverse; }
 46 |     .fxw-nw\@#{$breakpointAlias}  { flex-wrap: nowrap; }
 47 |   }
 48 | }
 49 | 
 50 | // ---------------------------------------------------------
 51 | // @Flex Direction
 52 | // ---------------------------------------------------------
 53 | 
 54 | .fxd-c   { flex-direction: column; }
 55 | .fxd-cr  { flex-direction: column-reverse; }
 56 | .fxd-r   { flex-direction: row; }
 57 | .fxd-rr  { flex-direction: row-reverse; }
 58 | 
 59 | @if ($responsive == true) {
 60 |   @include generateResponsive() {
 61 |     .fxd-c\@#{$breakpointAlias}   { flex-direction: column; }
 62 |     .fxd-cr\@#{$breakpointAlias}  { flex-direction: column-reverse; }
 63 |     .fxd-r\@#{$breakpointAlias}   { flex-direction: row; }
 64 |     .fxd-rr\@#{$breakpointAlias}  { flex-direction: row-reverse; }
 65 |   }
 66 | }
 67 | 
 68 | // ---------------------------------------------------------
 69 | // @Align Items
 70 | // ---------------------------------------------------------
 71 | 
 72 | .ai-fs   { align-items: flex-start; }
 73 | .ai-fe   { align-items: flex-end; }
 74 | .ai-c    { align-items: center; }
 75 | .ai-b    { align-items: baseline; }
 76 | .ai-s    { align-items: stretch; }
 77 | 
 78 | @if ($responsive == true) {
 79 |   @include generateResponsive() {
 80 |     .ai-fs\@#{$breakpointAlias}   { align-items: flex-start; }
 81 |     .ai-fe\@#{$breakpointAlias}   { align-items: flex-end; }
 82 |     .ai-c\@#{$breakpointAlias}    { align-items: center; }
 83 |     .ai-b\@#{$breakpointAlias}    { align-items: baseline; }
 84 |     .ai-s\@#{$breakpointAlias}    { align-items: stretch; }
 85 |   }
 86 | }
 87 | 
 88 | // ---------------------------------------------------------
 89 | // @Align Self
 90 | // ---------------------------------------------------------
 91 | 
 92 | .as-fs   { align-self: flex-start; }
 93 | .as-fe   { align-self: flex-end; }
 94 | .as-c    { align-self: center; }
 95 | .as-b    { align-self: baseline; }
 96 | .as-s    { align-self: stretch; }
 97 | 
 98 | @if ($responsive == true) {
 99 |   @include generateResponsive() {
100 |     .as-fs\@#{$breakpointAlias}   { align-self: flex-start; }
101 |     .as-fe\@#{$breakpointAlias}   { align-self: flex-end; }
102 |     .as-c\@#{$breakpointAlias}    { align-self: center; }
103 |     .as-b\@#{$breakpointAlias}    { align-self: baseline; }
104 |     .as-s\@#{$breakpointAlias}    { align-self: stretch; }
105 |   }
106 | }
107 | 
108 | // ---------------------------------------------------------
109 | // @Align Content
110 | // ---------------------------------------------------------
111 | 
112 | .ac-fs   { align-content: flex-start; }
113 | .ac-fe   { align-content: flex-end; }
114 | .ac-c    { align-content: center; }
115 | .ac-s    { align-content: stretch; }
116 | .ac-sb   { align-content: space-between; }
117 | .ac-sa   { align-content: space-around; }
118 | 
119 | @if ($responsive == true) {
120 |   @include generateResponsive() {
121 |     .ac-fs\@#{$breakpointAlias}   { align-content: flex-start; }
122 |     .ac-fe\@#{$breakpointAlias}   { align-content: flex-end; }
123 |     .ac-c\@#{$breakpointAlias}    { align-content: center; }
124 |     .ac-s\@#{$breakpointAlias}    { align-content: stretch; }
125 |     .ac-sb\@#{$breakpointAlias}   { align-content: space-between; }
126 |     .ac-sa\@#{$breakpointAlias}   { align-content: space-around; }
127 |   }
128 | }
129 | 
130 | // ---------------------------------------------------------
131 | // @Justify Content
132 | // ---------------------------------------------------------
133 | 
134 | .jc-fs   { justify-content: flex-start; }
135 | .jc-fe   { justify-content: flex-end; }
136 | .jc-c    { justify-content: center; }
137 | .jc-sb   { justify-content: space-between; }
138 | .jc-sa   { justify-content: space-around; }
139 | 
140 | @if ($responsive == true) {
141 |   @include generateResponsive() {
142 |     .jc-fs\@#{$breakpointAlias}   { justify-content: flex-start; }
143 |     .jc-fe\@#{$breakpointAlias}   { justify-content: flex-end; }
144 |     .jc-c\@#{$breakpointAlias}    { justify-content: center; }
145 |     .jc-sb\@#{$breakpointAlias}   { justify-content: space-between; }
146 |     .jc-sa\@#{$breakpointAlias}   { justify-content: space-around; }
147 |   }
148 | }
149 | 
150 | // ---------------------------------------------------------
151 | // @Flex
152 | // ---------------------------------------------------------
153 | 
154 | .fx-n    { flex: none; }
155 | .fx-1    { flex: 1; }
156 | 
157 | @if ($responsive == true) {
158 |   @include generateResponsive() {
159 |     .fx-n\@#{$breakpointAlias}    { flex: none; }
160 |     .fx-1\@#{$breakpointAlias}    { flex: 1; }
161 |   }
162 | }
163 | 
164 | // ---------------------------------------------------------
165 | // @Flex Basis
166 | // ---------------------------------------------------------
167 | 
168 | .fxb-a   { flex-basis: auto; }
169 | .fxb-0   { flex-basis: 0; }
170 | 
171 | @if ($responsive == true) {
172 |   @include generateResponsive() {
173 |     .fxb-a\@#{$breakpointAlias}   { flex-basis: auto; }
174 |     .fxb-0\@#{$breakpointAlias}   { flex-basis: 0; }
175 |   }
176 | }
177 | 
178 | // ---------------------------------------------------------
179 | // @Flex Grow
180 | // ---------------------------------------------------------
181 | 
182 | .fxg-1   { flex-grow: 1; }
183 | .fxg-0   { flex-grow: 0; }
184 | 
185 | @if ($responsive == true) {
186 |   @include generateResponsive() {
187 |     .fxg-1\@#{$breakpointAlias}   { flex-grow: 1; }
188 |     .fxg-0\@#{$breakpointAlias}   { flex-grow: 0; }
189 |   }
190 | }
191 | 
192 | // ---------------------------------------------------------
193 | // @Flex Shrink
194 | // ---------------------------------------------------------
195 | 
196 | .fxs-1   { flex-shrink: 1; }
197 | .fxs-0   { flex-shrink: 0; }
198 | 
199 | @if ($responsive == true) {
200 |   @include generateResponsive() {
201 |     .fxs-1\@#{$breakpointAlias}   { flex-shrink: 1; }
202 |     .fxs-0\@#{$breakpointAlias}   { flex-shrink: 0; }
203 |   }
204 | }
205 | 
206 | // ---------------------------------------------------------
207 | // @Flex Order
208 | // ---------------------------------------------------------
209 | 
210 | @for $i from 0 through 12 {
211 |   .ord-#{$i} { order: $i; }
212 | 
213 |   @if ($responsive == true) {
214 |     @include generateResponsive() {
215 |       .ord-#{$i}\@#{$breakpointAlias} { order: $i; }
216 |     }
217 |   }
218 | }
219 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/index.scss:
--------------------------------------------------------------------------------
 1 | @import 'flex';
 2 | @import 'layout';
 3 | @import 'lists';
 4 | @import 'margin';
 5 | @import 'objects';
 6 | @import 'padding';
 7 | @import 'positions';
 8 | @import 'sizes';
 9 | @import 'typography';
10 | @import 'border';
11 | @import 'pseudo';
12 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/layout.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Variables
  6 | // + @Display
  7 | // + @Overflow
  8 | // + @Float
  9 | // + @Vertical Align
 10 | // + @Position
 11 | // + @Z-Index
 12 | 
 13 | // ---------------------------------------------------------
 14 | // @Variables
 15 | // ---------------------------------------------------------
 16 | 
 17 | $responsive: true;
 18 | 
 19 | // ---------------------------------------------------------
 20 | // @Display
 21 | // ---------------------------------------------------------
 22 | 
 23 | .d-b          { display: block !important; }
 24 | .d-ib         { display: inline-block !important; }
 25 | .d-i          { display: inline !important; }
 26 | .d-tb         { display: table !important; }
 27 | .d-tbc        { display: table-cell !important; }
 28 | .d-n          { display: none !important; }
 29 | 
 30 | @if ($responsive == true) {
 31 |   @include generateResponsive() {
 32 |     .d-b\@#{$breakpointAlias}      { display: block !important; }
 33 |     .d-ib\@#{$breakpointAlias}     { display: inline-block !important; }
 34 |     .d-i\@#{$breakpointAlias}      { display: inline !important; }
 35 |     .d-tb\@#{$breakpointAlias}     { display: table !important; }
 36 |     .d-tbc\@#{$breakpointAlias}    { display: table-cell !important; }
 37 |     .d-n\@#{$breakpointAlias}      { display: none !important; }
 38 |   }
 39 | }
 40 | 
 41 | // ---------------------------------------------------------
 42 | // @Overflow
 43 | // ---------------------------------------------------------
 44 | 
 45 | .ov-h         { overflow: hidden !important; }
 46 | .ov-a         { overflow: auto !important; }
 47 | .ov-s         { overflow: scroll !important; }
 48 | 
 49 | .ovY-h        { overflow-y: hidden !important; }
 50 | .ovX-h        { overflow-x: hidden !important; }
 51 | .ovY-a        { overflow-y: auto !important; }
 52 | .ovX-a        { overflow-x: auto !important; }
 53 | .ovY-s        { overflow-y: scroll !important; }
 54 | .ovX-s        { overflow-x: scroll !important; }
 55 | 
 56 | @if ($responsive == true) {
 57 |   @include generateResponsive() {
 58 |     .ov-h\@#{$breakpointAlias}     { overflow: hidden !important; }
 59 |     .ov-a\@#{$breakpointAlias}     { overflow: auto !important; }
 60 |     .ov-s\@#{$breakpointAlias}     { overflow: scroll !important; }
 61 | 
 62 |     .ovY-h\@#{$breakpointAlias}    { overflow-y: hidden !important; }
 63 |     .ovX-h\@#{$breakpointAlias}    { overflow-x: hidden !important; }
 64 |     .ovY-a\@#{$breakpointAlias}    { overflow-y: auto !important; }
 65 |     .ovX-a\@#{$breakpointAlias}    { overflow-x: auto !important; }
 66 |     .ovY-s\@#{$breakpointAlias}    { overflow-y: scroll !important; }
 67 |     .ovX-s\@#{$breakpointAlias}    { overflow-x: scroll !important; }
 68 |   }
 69 | }
 70 | 
 71 | // ---------------------------------------------------------
 72 | // @Float
 73 | // ---------------------------------------------------------
 74 | 
 75 | .fl-l         { float: left !important; }
 76 | .fl-r         { float: right !important; }
 77 | .fl-n         { float: none !important; }
 78 | 
 79 | @if ($responsive == true) {
 80 |   @include generateResponsive() {
 81 |     .fl-l\@#{$breakpointAlias}     { float: left !important; }
 82 |     .fl-r\@#{$breakpointAlias}     { float: right !important; }
 83 |     .fl-n\@#{$breakpointAlias}     { float: none !important; }
 84 |   }
 85 | }
 86 | 
 87 | // ---------------------------------------------------------
 88 | // @Vertical Align
 89 | // ---------------------------------------------------------
 90 | 
 91 | .va-t         { vertical-align: top !important; }
 92 | .va-m         { vertical-align: middle !important; }
 93 | .va-b         { vertical-align: bottom !important; }
 94 | 
 95 | @if ($responsive == true) {
 96 |   @include generateResponsive() {
 97 |     .va-t\@#{$breakpointAlias}     { vertical-align: top !important; }
 98 |     .va-m\@#{$breakpointAlias}     { vertical-align: middle !important; }
 99 |     .va-b\@#{$breakpointAlias}     { vertical-align: bottom !important; }
100 |   }
101 | }
102 | 
103 | // ---------------------------------------------------------
104 | // @Position
105 | // ---------------------------------------------------------
106 | 
107 | .pos-s        { position: static !important; }
108 | .pos-st       { position: sticky !important; }
109 | .pos-r        { position: relative !important; }
110 | .pos-a        { position: absolute !important; }
111 | .pos-f        { position: fixed !important; }
112 | 
113 | @if ($responsive == true) {
114 |   @include generateResponsive() {
115 |     .pos-s\@#{$breakpointAlias}    { position: static !important; }
116 |     .pos-st\@#{$breakpointAlias}   { position: sticky !important; }
117 |     .pos-r\@#{$breakpointAlias}    { position: relative !important; }
118 |     .pos-a\@#{$breakpointAlias}    { position: absolute !important; }
119 |     .pos-f\@#{$breakpointAlias}    { position: fixed !important; }
120 |   }
121 | }
122 | 
123 | // ---------------------------------------------------------
124 | // @Z-Index
125 | // ---------------------------------------------------------
126 | 
127 | @for $i from 0 through 9 {
128 |   .z-#{$i} { z-index: ($i * 1000) !important; }
129 | 
130 |   @if ($responsive == true) {
131 |     @include generateResponsive() {
132 |       .z-#{$i}\@#{$breakpointAlias} { z-index: ($i * 1000) !important; }
133 |     }
134 |   }
135 | }
136 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/lists.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @TOC
 3 | // ---------------------------------------------------------
 4 | 
 5 | // + @List Style Position
 6 | // + @List Style Type
 7 | 
 8 | // ---------------------------------------------------------
 9 | // @List Style Position
10 | // ---------------------------------------------------------
11 | 
12 | .lisp-i { list-style-position: inside; }
13 | .lisp-o { list-style-position: outside; }
14 | 
15 | // ---------------------------------------------------------
16 | // @List Style Type
17 | // ---------------------------------------------------------
18 | 
19 | .lis-n  { list-style: none; }
20 | .list-c { list-style-type: circle; }
21 | .list-s { list-style-type: square; }
22 | .list-u { list-style-type: upper-roman; }
23 | .list-l { list-style-type: lower-alpha; }
24 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/margin.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Variables
  6 | // + @Margin (0 > 4 Step 1)
  7 | // + @Margin (5 > 35 Step 5)
  8 | // + @Margin (40 > 160 Step 10)
  9 | // + @Margin Auto
 10 | 
 11 | // ---------------------------------------------------------
 12 | // @Variables
 13 | // ---------------------------------------------------------
 14 | 
 15 | $responsive: true;
 16 | 
 17 | // ---------------------------------------------------------
 18 | // @Padding (0 > 4 Step 1)
 19 | // ---------------------------------------------------------
 20 | 
 21 | @for $i from 0 through 4 {
 22 |   .m-#{$i}  { margin: #{$i}px !important; }
 23 |   .mT-#{$i} { margin-top: #{$i}px !important; }
 24 |   .mR-#{$i} { margin-right: #{$i}px !important; }
 25 |   .mB-#{$i} { margin-bottom: #{$i}px !important; }
 26 |   .mL-#{$i} { margin-left: #{$i}px !important; }
 27 | 
 28 |   .mY-#{$i} {
 29 |     margin-top: #{$i}px !important;
 30 |     margin-bottom: #{$i}px !important;
 31 |   }
 32 | 
 33 |   .mX-#{$i} {
 34 |     margin-left: #{$i}px !important;
 35 |     margin-right: #{$i}px !important;
 36 |   }
 37 | 
 38 |   .m-nv-#{$i}  { margin: -#{$i}px !important; }
 39 |   .mT-nv-#{$i} { margin-top: -#{$i}px !important; }
 40 |   .mR-nv-#{$i} { margin-right: -#{$i}px !important; }
 41 |   .mB-nv-#{$i} { margin-bottom:- #{$i}px !important; }
 42 |   .mL-nv-#{$i} { margin-left: -#{$i}px !important; }
 43 | 
 44 |   .mY-nv-#{$i} {
 45 |     margin-top: -#{$i}px !important;
 46 |     margin-bottom: -#{$i}px !important;
 47 |   }
 48 | 
 49 |   .mX-nv-#{$i} {
 50 |     margin-left: -#{$i}px !important;
 51 |     margin-right: -#{$i}px !important;
 52 |   }
 53 | 
 54 |   @if ($responsive == true) {
 55 |     @include generateResponsive() {
 56 |       .m-#{$i}\@#{$breakpointAlias}  { margin: #{$i}px !important; }
 57 |       .mT-#{$i}\@#{$breakpointAlias} { margin-top: #{$i}px !important; }
 58 |       .mR-#{$i}\@#{$breakpointAlias} { margin-right: #{$i}px !important; }
 59 |       .mB-#{$i}\@#{$breakpointAlias} { margin-bottom: #{$i}px !important; }
 60 |       .mL-#{$i}\@#{$breakpointAlias} { margin-left: #{$i}px !important; }
 61 | 
 62 |       .mY-#{$i}\@#{$breakpointAlias} {
 63 |         margin-top: #{$i}px !important;
 64 |         margin-bottom: #{$i}px !important;
 65 |       }
 66 | 
 67 |       .mX-#{$i}\@#{$breakpointAlias} {
 68 |         margin-left: #{$i}px !important;
 69 |         margin-right: #{$i}px !important;
 70 |       }
 71 | 
 72 |       .m-nv-#{$i}\@#{$breakpointAlias}  { margin: -#{$i}px !important; }
 73 |       .mT-nv-#{$i}\@#{$breakpointAlias} { margin-top: -#{$i}px !important; }
 74 |       .mR-nv-#{$i}\@#{$breakpointAlias} { margin-right: -#{$i}px !important; }
 75 |       .mB-nv-#{$i}\@#{$breakpointAlias} { margin-bottom: -#{$i}px !important; }
 76 |       .mL-nv-#{$i}\@#{$breakpointAlias} { margin-left: -#{$i}px !important; }
 77 | 
 78 |       .mY-nv-#{$i}\@#{$breakpointAlias} {
 79 |         margin-top: -#{$i}px !important;
 80 |         margin-bottom: -#{$i}px !important;
 81 |       }
 82 | 
 83 |       .mX-nv-#{$i}\@#{$breakpointAlias} {
 84 |         margin-left: -#{$i}px !important;
 85 |         margin-right: -#{$i}px !important;
 86 |       }
 87 |     }
 88 |   }
 89 | }
 90 | 
 91 | // ---------------------------------------------------------
 92 | // @Padding (5 > 35 Step 5)
 93 | // ---------------------------------------------------------
 94 | 
 95 | @for $i from 5 through 35 {
 96 |   @if $i % 5 == 0 {
 97 |     .m-#{$i}  { margin: #{$i}px !important; }
 98 |     .mT-#{$i} { margin-top: #{$i}px !important; }
 99 |     .mR-#{$i} { margin-right: #{$i}px !important; }
100 |     .mB-#{$i} { margin-bottom: #{$i}px !important; }
101 |     .mL-#{$i} { margin-left: #{$i}px !important; }
102 | 
103 |     .mY-#{$i} {
104 |       margin-top: #{$i}px !important;
105 |       margin-bottom: #{$i}px !important;
106 |     }
107 | 
108 |     .mX-#{$i} {
109 |       margin-left: #{$i}px !important;
110 |       margin-right: #{$i}px !important;
111 |     }
112 | 
113 |     .m-nv-#{$i}  { margin: -#{$i}px !important; }
114 |     .mT-nv-#{$i} { margin-top: -#{$i}px !important; }
115 |     .mR-nv-#{$i} { margin-right: -#{$i}px !important; }
116 |     .mB-nv-#{$i} { margin-bottom: -#{$i}px !important; }
117 |     .mL-nv-#{$i} { margin-left: -#{$i}px !important; }
118 | 
119 |     .mY-nv-#{$i} {
120 |       margin-top: -#{$i}px !important;
121 |       margin-bottom: -#{$i}px !important;
122 |     }
123 | 
124 |     .mX-nv-#{$i} {
125 |       margin-left: -#{$i}px !important;
126 |       margin-right: -#{$i}px !important;
127 |     }
128 | 
129 |     @if ($responsive == true) {
130 |       @include generateResponsive() {
131 |         .m-#{$i}\@#{$breakpointAlias}  { margin: #{$i}px !important; }
132 |         .mT-#{$i}\@#{$breakpointAlias} { margin-top: #{$i}px !important; }
133 |         .mR-#{$i}\@#{$breakpointAlias} { margin-right: #{$i}px !important; }
134 |         .mB-#{$i}\@#{$breakpointAlias} { margin-bottom: #{$i}px !important; }
135 |         .mL-#{$i}\@#{$breakpointAlias} { margin-left: #{$i}px !important; }
136 | 
137 |         .mY-#{$i}\@#{$breakpointAlias} {
138 |           margin-top: #{$i}px !important;
139 |           margin-bottom: #{$i}px !important;
140 |         }
141 | 
142 |         .mX-#{$i}\@#{$breakpointAlias} {
143 |           margin-left: #{$i}px !important;
144 |           margin-right: #{$i}px !important;
145 |         }
146 | 
147 |         .m-nv-#{$i}\@#{$breakpointAlias}  { margin: -#{$i}px !important; }
148 |         .mT-nv-#{$i}\@#{$breakpointAlias} { margin-top: -#{$i}px !important; }
149 |         .mR-nv-#{$i}\@#{$breakpointAlias} { margin-right: -#{$i}px !important; }
150 |         .mB-nv-#{$i}\@#{$breakpointAlias} { margin-bottom: -#{$i}px !important; }
151 |         .mL-nv-#{$i}\@#{$breakpointAlias} { margin-left: -#{$i}px !important; }
152 | 
153 |         .mY-nv-#{$i}\@#{$breakpointAlias} {
154 |           margin-top: -#{$i}px !important;
155 |           margin-bottom: -#{$i}px !important;
156 |         }
157 | 
158 |         .mX-nv-#{$i}\@#{$breakpointAlias} {
159 |           margin-left: -#{$i}px !important;
160 |           margin-right: -#{$i}px !important;
161 |         }
162 |       }
163 |     }
164 |   }
165 | }
166 | 
167 | // ---------------------------------------------------------
168 | // @Padding (40 > 160 Step 10)
169 | // ---------------------------------------------------------
170 | 
171 | @for $i from 40 through 160 {
172 |   @if $i % 10 == 0 {
173 | 
174 |     .m-#{$i}  { margin: #{$i}px !important; }
175 |     .mT-#{$i} { margin-top: #{$i}px !important; }
176 |     .mR-#{$i} { margin-right: #{$i}px !important; }
177 |     .mB-#{$i} { margin-bottom: #{$i}px !important; }
178 |     .mL-#{$i} { margin-left: #{$i}px !important; }
179 | 
180 |     .mY-#{$i} {
181 |       margin-top: #{$i}px !important;
182 |       margin-bottom: #{$i}px !important;
183 |     }
184 | 
185 |     .mX-#{$i} {
186 |       margin-left: #{$i}px !important;
187 |       margin-right: #{$i}px !important;
188 |     }
189 | 
190 |     .m-nv-#{$i}  { margin: -#{$i}px !important; }
191 |     .mT-nv-#{$i} { margin-top: -#{$i}px !important; }
192 |     .mR-nv-#{$i} { margin-right: -#{$i}px !important; }
193 |     .mB-nv-#{$i} { margin-bottom: -#{$i}px !important; }
194 |     .mL-nv-#{$i} { margin-left: -#{$i}px !important; }
195 | 
196 |     .mY-nv-#{$i} {
197 |       margin-top: -#{$i}px !important;
198 |       margin-bottom: -#{$i}px !important;
199 |     }
200 | 
201 |     .mX-nv-#{$i} {
202 |       margin-left: -#{$i}px !important;
203 |       margin-right: -#{$i}px !important;
204 |     }
205 | 
206 |     @if ($responsive == true) {
207 |       @include generateResponsive() {
208 |         .m-#{$i}\@#{$breakpointAlias}  { margin: #{$i}px !important; }
209 |         .mT-#{$i}\@#{$breakpointAlias} { margin-top: #{$i}px !important; }
210 |         .mR-#{$i}\@#{$breakpointAlias} { margin-right: #{$i}px !important; }
211 |         .mB-#{$i}\@#{$breakpointAlias} { margin-bottom: #{$i}px !important; }
212 |         .mL-#{$i}\@#{$breakpointAlias} { margin-left: #{$i}px !important; }
213 | 
214 |         .mY-#{$i}\@#{$breakpointAlias} {
215 |           margin-top: #{$i}px !important;
216 |           margin-bottom: #{$i}px !important;
217 |         }
218 | 
219 |         .mX-#{$i}\@#{$breakpointAlias} {
220 |           margin-left: #{$i}px !important;
221 |           margin-right: #{$i}px !important;
222 |         }
223 | 
224 |         .m-nv-#{$i}\@#{$breakpointAlias}  { margin: -#{$i}px !important; }
225 |         .mT-nv-#{$i}\@#{$breakpointAlias} { margin-top: -#{$i}px !important; }
226 |         .mR-nv-#{$i}\@#{$breakpointAlias} { margin-right: -#{$i}px !important; }
227 |         .mB-nv-#{$i}\@#{$breakpointAlias} { margin-bottom: -#{$i}px !important; }
228 |         .mL-nv-#{$i}\@#{$breakpointAlias} { margin-left: -#{$i}px !important; }
229 | 
230 |         .mY-nv-#{$i}\@#{$breakpointAlias} {
231 |           margin-top: -#{$i}px !important;
232 |           margin-bottom: -#{$i}px !important;
233 |         }
234 | 
235 |         .mX-nv-#{$i}\@#{$breakpointAlias} {
236 |           margin-left: -#{$i}px !important;
237 |           margin-right: -#{$i}px !important;
238 |         }
239 |       }
240 |     }
241 |   }
242 | }
243 | 
244 | // ---------------------------------------------------------
245 | // @Padding Auto
246 | // ---------------------------------------------------------
247 | 
248 | .m-a  { margin: auto !important; }
249 | .mX-a { margin-left: auto !important; margin-right: auto !important; }
250 | .mT-a { margin-top: auto !important; }
251 | .mR-a { margin-right: auto !important; }
252 | .mB-a { margin-bottom: auto !important; }
253 | .mL-a { margin-left: auto !important; }
254 | 
255 | @if ($responsive == true) {
256 |   @include generateResponsive() {
257 |     .m-a\@#{$breakpointAlias}  { margin: auto !important; }
258 |     .mX-a\@#{$breakpointAlias} { margin-left: auto !important; margin-right: auto !important; }
259 |     .mT-a\@#{$breakpointAlias} { margin-top: auto !important; }
260 |     .mR-a\@#{$breakpointAlias} { margin-right: auto !important; }
261 |     .mB-a\@#{$breakpointAlias} { margin-bottom: auto !important; }
262 |     .mL-a\@#{$breakpointAlias} { margin-left: auto !important; }
263 |   }
264 | }
265 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/objects.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @TOC
 3 | // ---------------------------------------------------------
 4 | 
 5 | // + @Background Size
 6 | // + @Background Position
 7 | // + @Background Repeat
 8 | // + @Object Fit
 9 | // + @Resize
10 | // + @Opacity
11 | // + @Cursor
12 | // + @Visibility
13 | 
14 | // ---------------------------------------------------------
15 | // @Background Size
16 | // ---------------------------------------------------------
17 | 
18 | .bgsz-cv   { background-size: cover; }
19 | .bgsz-ct   { background-size: contain; }
20 | .bgsz-full { background-size: 100% 100%; }
21 | 
22 | // ---------------------------------------------------------
23 | // @Background Position
24 | // ---------------------------------------------------------
25 | 
26 | .bgpX-c    { background-position-x: center; }
27 | .bgpX-t    { background-position-x: top; }
28 | .bgpX-r    { background-position-x: right; }
29 | .bgpX-l    { background-position-x: left; }
30 | .bgpX-b    { background-position-x: bottom; }
31 | .bgpY-c    { background-position-y: center; }
32 | .bgpY-t    { background-position-y: top; }
33 | .bgpY-r    { background-position-y: right; }
34 | .bgpY-l    { background-position-y: left; }
35 | .bgpY-b    { background-position-y: bottom; }
36 | 
37 | // ---------------------------------------------------------
38 | // @Background Repeat
39 | // ---------------------------------------------------------
40 | 
41 | .bgr-n     { background-repeat: no-repeat; }
42 | .bgr-y     { background-repeat: repeat-y; }
43 | .bgr-x     { background-repeat: repeat-x; }
44 | 
45 | // ---------------------------------------------------------
46 | // @Object Fit
47 | // ---------------------------------------------------------
48 | 
49 | .of-ct     { object-fit: contain; }
50 | .of-cv     { object-fit: cover; }
51 | .of-f      { object-fit: fill; }
52 | .of-n      { object-fit: none; }
53 | .of-sd     { object-fit: scale-down; }
54 | 
55 | // ---------------------------------------------------------
56 | // @Resize
57 | // ---------------------------------------------------------
58 | 
59 | .rsz-v     { resize: vertical; }
60 | .rsz-h     { resize: horizontal; }
61 | 
62 | // ---------------------------------------------------------
63 | // @Opacity
64 | // ---------------------------------------------------------
65 | 
66 | .op-0      { opacity: 0; }
67 | .op-10p    { opacity: 0.1; }
68 | .op-20p    { opacity: 0.2; }
69 | .op-30p    { opacity: 0.3; }
70 | .op-40p    { opacity: 0.4; }
71 | .op-50p    { opacity: 0.5; }
72 | .op-60p    { opacity: 0.6; }
73 | .op-70p    { opacity: 0.7; }
74 | .op-80p    { opacity: 0.8; }
75 | .op-90p    { opacity: 0.9; }
76 | .op-100p   { opacity: 1; }
77 | 
78 | // ---------------------------------------------------------
79 | // @Cursor
80 | // ---------------------------------------------------------
81 | 
82 | .cur-na    { cursor: not-allowed; }
83 | .cur-p     { cursor: pointer; }
84 | .cur-a     { cursor: auto; }
85 | 
86 | // ---------------------------------------------------------
87 | // @Visibility
88 | // ---------------------------------------------------------
89 | 
90 | .vis-v     { visibility: visible; }
91 | .vis-h     { visibility: hidden; }
92 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/padding.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Variables
  6 | // + @Padding (0 > 4 Step 1)
  7 | // + @Padding (5 > 35 Step 5)
  8 | // + @Padding (40 > 160 Step 10)
  9 | // + @Padding Auto
 10 | 
 11 | // ---------------------------------------------------------
 12 | // @Variables
 13 | // ---------------------------------------------------------
 14 | 
 15 | $responsive: true;
 16 | 
 17 | // ---------------------------------------------------------
 18 | // @Padding (0 > 4 Step 1)
 19 | // ---------------------------------------------------------
 20 | 
 21 | @for $i from 0 through 4 {
 22 |   .p-#{$i}  { padding: #{$i}px !important; }
 23 |   .pT-#{$i} { padding-top: #{$i}px !important; }
 24 |   .pR-#{$i} { padding-right: #{$i}px !important; }
 25 |   .pB-#{$i} { padding-bottom: #{$i}px !important; }
 26 |   .pL-#{$i} { padding-left: #{$i}px !important; }
 27 | 
 28 |   .pY-#{$i} {
 29 |     padding-top: #{$i}px !important;
 30 |     padding-bottom: #{$i}px !important;
 31 |   }
 32 | 
 33 |   .pX-#{$i} {
 34 |     padding-left: #{$i}px !important;
 35 |     padding-right: #{$i}px !important;
 36 |   }
 37 | 
 38 |   @if ($responsive == true) {
 39 |     @include generateResponsive() {
 40 |       .p-#{$i}\@#{$breakpointAlias}  { padding: #{$i}px !important; }
 41 |       .pT-#{$i}\@#{$breakpointAlias} { padding-top: #{$i}px !important; }
 42 |       .pR-#{$i}\@#{$breakpointAlias} { padding-right: #{$i}px !important; }
 43 |       .pB-#{$i}\@#{$breakpointAlias} { padding-bottom: #{$i}px !important; }
 44 |       .pL-#{$i}\@#{$breakpointAlias} { padding-left: #{$i}px !important; }
 45 | 
 46 |       .pY-#{$i}\@#{$breakpointAlias} {
 47 |         padding-top: #{$i}px !important;
 48 |         padding-bottom: #{$i}px !important;
 49 |       }
 50 | 
 51 |       .pX-#{$i}\@#{$breakpointAlias} {
 52 |         padding-left: #{$i}px !important;
 53 |         padding-right: #{$i}px !important;
 54 |       }
 55 |     }
 56 |   }
 57 | }
 58 | 
 59 | // ---------------------------------------------------------
 60 | // @Padding (5 > 35 Step 5)
 61 | // ---------------------------------------------------------
 62 | 
 63 | @for $i from 5 through 35 {
 64 |   @if $i % 5 == 0 {
 65 |     .p-#{$i}  { padding: #{$i}px !important; }
 66 |     .pT-#{$i} { padding-top: #{$i}px !important; }
 67 |     .pR-#{$i} { padding-right: #{$i}px !important; }
 68 |     .pB-#{$i} { padding-bottom: #{$i}px !important; }
 69 |     .pL-#{$i} { padding-left: #{$i}px !important; }
 70 | 
 71 |     .pY-#{$i} {
 72 |       padding-top: #{$i}px !important;
 73 |       padding-bottom: #{$i}px !important;
 74 |     }
 75 | 
 76 |     .pX-#{$i} {
 77 |       padding-left: #{$i}px !important;
 78 |       padding-right: #{$i}px !important;
 79 |     }
 80 | 
 81 |     @if ($responsive == true) {
 82 |       @include generateResponsive() {
 83 |         .p-#{$i}\@#{$breakpointAlias}  { padding: #{$i}px !important; }
 84 |         .pT-#{$i}\@#{$breakpointAlias} { padding-top: #{$i}px !important; }
 85 |         .pR-#{$i}\@#{$breakpointAlias} { padding-right: #{$i}px !important; }
 86 |         .pB-#{$i}\@#{$breakpointAlias} { padding-bottom: #{$i}px !important; }
 87 |         .pL-#{$i}\@#{$breakpointAlias} { padding-left: #{$i}px !important; }
 88 | 
 89 |         .pY-#{$i}\@#{$breakpointAlias} {
 90 |           padding-top: #{$i}px !important;
 91 |           padding-bottom: #{$i}px !important;
 92 |         }
 93 | 
 94 |         .pX-#{$i}\@#{$breakpointAlias} {
 95 |           padding-left: #{$i}px !important;
 96 |           padding-right: #{$i}px !important;
 97 |         }
 98 |       }
 99 |     }
100 |   }
101 | }
102 | 
103 | // ---------------------------------------------------------
104 | // @Padding (40 > 160 Step 10)
105 | // ---------------------------------------------------------
106 | 
107 | @for $i from 40 through 160 {
108 |   @if $i % 10 == 0 {
109 |     .p-#{$i}  { padding: #{$i}px !important; }
110 |     .pT-#{$i} { padding-top: #{$i}px !important; }
111 |     .pR-#{$i} { padding-right: #{$i}px !important; }
112 |     .pB-#{$i} { padding-bottom: #{$i}px !important; }
113 |     .pL-#{$i} { padding-left: #{$i}px !important; }
114 | 
115 |     .pY-#{$i} {
116 |       padding-top: #{$i}px !important;
117 |       padding-bottom: #{$i}px !important;
118 |     }
119 | 
120 |     .pX-#{$i} {
121 |       padding-left: #{$i}px !important;
122 |       padding-right: #{$i}px !important;
123 |     }
124 | 
125 |     @if ($responsive == true) {
126 |       @include generateResponsive() {
127 |         .p-#{$i}\@#{$breakpointAlias}  { padding: #{$i}px !important; }
128 |         .pT-#{$i}\@#{$breakpointAlias} { padding-top: #{$i}px !important; }
129 |         .pR-#{$i}\@#{$breakpointAlias} { padding-right: #{$i}px !important; }
130 |         .pB-#{$i}\@#{$breakpointAlias} { padding-bottom: #{$i}px !important; }
131 |         .pL-#{$i}\@#{$breakpointAlias} { padding-left: #{$i}px !important; }
132 | 
133 |         .pY-#{$i}\@#{$breakpointAlias} {
134 |           padding-top: #{$i}px !important;
135 |           padding-bottom: #{$i}px !important;
136 |         }
137 | 
138 |         .pX-#{$i}\@#{$breakpointAlias} {
139 |           padding-left: #{$i}px !important;
140 |           padding-right: #{$i}px !important;
141 |         }
142 |       }
143 |     }
144 |   }
145 | }
146 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/positions.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Variables
  6 | // + @Position (0 > 4 Step 1)
  7 | // + @Position (5 > 35 Step 5)
  8 | // + @Position (40 > 160 Step 10)
  9 | 
 10 | // ---------------------------------------------------------
 11 | // @Variables
 12 | // ---------------------------------------------------------
 13 | 
 14 | $responsive: true;
 15 | 
 16 | // ---------------------------------------------------------
 17 | // @Position (0 > 4 Step 1)
 18 | // ---------------------------------------------------------
 19 | 
 20 | @for $i from 0 through 4 {
 21 |   .t-#{$i} { top: #{$i}px; }
 22 |   .r-#{$i} { right: #{$i}px; }
 23 |   .b-#{$i} { bottom: #{$i}px; }
 24 |   .l-#{$i} { left: #{$i}px; }
 25 | 
 26 |   @if ($responsive == true) {
 27 |     @include generateResponsive() {
 28 |       .t-#{$i}\@#{$breakpointAlias} { top: #{$i}px; }
 29 |       .r-#{$i}\@#{$breakpointAlias} { right: #{$i}px; }
 30 |       .b-#{$i}\@#{$breakpointAlias} { bottom: #{$i}px; }
 31 |       .l-#{$i}\@#{$breakpointAlias} { left: #{$i}px; }
 32 |     }
 33 |   }
 34 | }
 35 | 
 36 | // ---------------------------------------------------------
 37 | // @Position (5 > 35 Step 5)
 38 | // ---------------------------------------------------------
 39 | 
 40 | @for $i from 5 through 35 {
 41 |   @if $i % 5 == 0 {
 42 |     .t-#{$i} { top: #{$i}px; }
 43 |     .r-#{$i} { right: #{$i}px; }
 44 |     .b-#{$i} { bottom: #{$i}px; }
 45 |     .l-#{$i} { left: #{$i}px; }
 46 | 
 47 |     @if ($responsive == true) {
 48 |       @include generateResponsive() {
 49 |         .t-#{$i}\@#{$breakpointAlias} { top: #{$i}px; }
 50 |         .r-#{$i}\@#{$breakpointAlias} { right: #{$i}px; }
 51 |         .b-#{$i}\@#{$breakpointAlias} { bottom: #{$i}px; }
 52 |         .l-#{$i}\@#{$breakpointAlias} { left: #{$i}px; }
 53 |       }
 54 |     }
 55 |   }
 56 | }
 57 | 
 58 | // ---------------------------------------------------------
 59 | // @Position (40 > 160 Step 10)
 60 | // ---------------------------------------------------------
 61 | 
 62 | @for $i from 40 through 160 {
 63 |   @if $i % 10 == 0 {
 64 |     .t-#{$i} { top: #{$i}px; }
 65 |     .r-#{$i} { right: #{$i}px; }
 66 |     .b-#{$i} { bottom: #{$i}px; }
 67 |     .l-#{$i} { left: #{$i}px; }
 68 | 
 69 |     @if ($responsive == true) {
 70 |       @include generateResponsive() {
 71 |         .t-#{$i}\@#{$breakpointAlias} { top: #{$i}px; }
 72 |         .r-#{$i}\@#{$breakpointAlias} { right: #{$i}px; }
 73 |         .b-#{$i}\@#{$breakpointAlias} { bottom: #{$i}px; }
 74 |         .l-#{$i}\@#{$breakpointAlias} { left: #{$i}px; }
 75 |       }
 76 |     }
 77 |   }
 78 | }
 79 | 
 80 | // ---------------------------------------------------------
 81 | // @Position (50%)
 82 | // ---------------------------------------------------------
 83 | 
 84 | .tl-50p {
 85 |   top: 50%;
 86 |   left: 50%;
 87 | }
 88 | 
 89 | .tr-50p {
 90 |   top: 50%;
 91 |   right: 50%;
 92 | }
 93 | 
 94 | .t-50p { top: 50%; }
 95 | .r-50p { right: 50%; }
 96 | .b-50p { bottom: 50%; }
 97 | .l-50p { left: 50%; }
 98 | 
 99 | @if ($responsive == true) {
100 |   @include generateResponsive() {
101 |     .tl-50p\@#{$breakpointAlias} {
102 |       top: 50%;
103 |       left: 50%;
104 |     }
105 | 
106 |     .tr-50p\@#{$breakpointAlias} {
107 |       top: 50%;
108 |       right: 50%;
109 |     }
110 | 
111 |     .t-50p\@#{$breakpointAlias} { top: 50%; }
112 |     .r-50p\@#{$breakpointAlias} { right: 50%; }
113 |     .b-50p\@#{$breakpointAlias} { bottom: 50%; }
114 |     .l-50p\@#{$breakpointAlias} { left: 50%; }
115 |   }
116 | }
117 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/pseudo.scss:
--------------------------------------------------------------------------------
1 | // ---------------------------------------------------------
2 | // @Pseudo Elements
3 | // ---------------------------------------------------------
4 | 
5 | .no-after::after   { display: none !important; }
6 | .no-before::before { display: none !important; }
7 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/sizes.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Variables
  6 | // + @Fixed Width
  7 | // + @Relative Width
  8 | // + @Fixed Height
  9 | // + @Max Size
 10 | 
 11 | // ---------------------------------------------------------
 12 | // @Variables
 13 | // ---------------------------------------------------------
 14 | 
 15 | $responsive: true;
 16 | 
 17 | // ---------------------------------------------------------
 18 | // @Fixed Width
 19 | // ---------------------------------------------------------
 20 | 
 21 | .w-1\/4r, .sz-1\/4r    { width: 0.25rem; }
 22 | .w-1\/2r, .sz-1\/2r    { width: 0.5rem; }
 23 | .w-3\/4r, .sz-3\/4r    { width: 0.75rem; }
 24 | .w-1r, .sz-1r          { width: 1rem; }
 25 | .w-3\/2r, .sz-3\/2r    { width: 1.5rem; }
 26 | .w-2r, .sz-2r          { width: 2rem; }
 27 | .w-5\/2r, .sz-5\/2r    { width: 2.5rem; }
 28 | .w-3r, .sz-3r          { width: 3rem; }
 29 | .w-7\/2r, .sz-7\/2r    { width: 3.5rem; }
 30 | .w-4r, .sz-4r          { width: 4rem; }
 31 | .w-9\/2r, .sz-9\/2r    { width: 4.5rem; }
 32 | .w-5r, .sz-5r          { width: 5rem; }
 33 | .w-11\/2r, .sz-11\/2r  { width: 5.5rem; }
 34 | .w-6r, .sz-6r          { width: 6rem; }
 35 | 
 36 | @if ($responsive == true) {
 37 |   @include generateResponsive() {
 38 |     .w-1\/4r\@#{$breakpointAlias}, .sz-1\/4r\@#{$breakpointAlias}    { width: 0.25rem; }
 39 |     .w-1\/2r\@#{$breakpointAlias}, .sz-1\/2r\@#{$breakpointAlias}    { width: 0.5rem; }
 40 |     .w-3\/4r\@#{$breakpointAlias}, .sz-3\/4r\@#{$breakpointAlias}    { width: 0.75rem; }
 41 |     .w-1r\@#{$breakpointAlias}, .sz-1r\@#{$breakpointAlias}          { width: 1rem; }
 42 |     .w-3\/2r\@#{$breakpointAlias}, .sz-3\/2r\@#{$breakpointAlias}    { width: 1.5rem; }
 43 |     .w-2r\@#{$breakpointAlias}, .sz-2r\@#{$breakpointAlias}          { width: 2rem; }
 44 |     .w-5\/2r\@#{$breakpointAlias}, .sz-5\/2r\@#{$breakpointAlias}    { width: 2.5rem; }
 45 |     .w-3r\@#{$breakpointAlias}, .sz-3r\@#{$breakpointAlias}          { width: 3rem; }
 46 |     .w-7\/2r\@#{$breakpointAlias}, .sz-7\/2r\@#{$breakpointAlias}    { width: 3.5rem; }
 47 |     .w-4r\@#{$breakpointAlias}, .sz-4r\@#{$breakpointAlias}          { width: 4rem; }
 48 |     .w-9\/2r\@#{$breakpointAlias}, .sz-9\/2r\@#{$breakpointAlias}    { width: 4.5rem; }
 49 |     .w-5r\@#{$breakpointAlias}, .sz-5r\@#{$breakpointAlias}          { width: 5rem; }
 50 |     .w-11\/2r\@#{$breakpointAlias}, .sz-11\/2r\@#{$breakpointAlias}  { width: 5.5rem; }
 51 |     .w-6r\@#{$breakpointAlias}, .sz-6r\@#{$breakpointAlias}          { width: 6rem; }
 52 |   }
 53 | }
 54 | 
 55 | // ---------------------------------------------------------
 56 | // @Relative Width
 57 | // ---------------------------------------------------------
 58 | 
 59 | .w-0     { width: 0px; }
 60 | .w-10p   { width: 10%; }
 61 | .w-20p   { width: 20%; }
 62 | .w-30p   { width: 30%; }
 63 | .w-40p   { width: 40%; }
 64 | .w-50p   { width: 50%; }
 65 | .w-60p   { width: 60%; }
 66 | .w-70p   { width: 70%; }
 67 | .w-80p   { width: 80%; }
 68 | .w-90p   { width: 90%; }
 69 | .w-100p  { width: 100%; }
 70 | .w-1px   { width: 1px; }
 71 | .w-a     { width: auto; }
 72 | 
 73 | @if ($responsive == true) {
 74 |   @include generateResponsive() {
 75 |     .w-0\@#{$breakpointAlias}     { width: 0px; }
 76 |     .w-10p\@#{$breakpointAlias}   { width: 10%; }
 77 |     .w-20p\@#{$breakpointAlias}   { width: 20%; }
 78 |     .w-30p\@#{$breakpointAlias}   { width: 30%; }
 79 |     .w-40p\@#{$breakpointAlias}   { width: 40%; }
 80 |     .w-50p\@#{$breakpointAlias}   { width: 50%; }
 81 |     .w-60p\@#{$breakpointAlias}   { width: 60%; }
 82 |     .w-70p\@#{$breakpointAlias}   { width: 70%; }
 83 |     .w-80p\@#{$breakpointAlias}   { width: 80%; }
 84 |     .w-90p\@#{$breakpointAlias}   { width: 90%; }
 85 |     .w-100p\@#{$breakpointAlias}  { width: 100%; }
 86 |     .w-1px\@#{$breakpointAlias}   { width: 1px; }
 87 |     .w-a\@#{$breakpointAlias}     { width: auto; }
 88 |   }
 89 | }
 90 | 
 91 | // ---------------------------------------------------------
 92 | // @Fixed Height
 93 | // ---------------------------------------------------------
 94 | 
 95 | .h-1\/4r, .sz-1\/4r    { height: 0.25rem; }
 96 | .h-1\/2r, .sz-1\/2r    { height: 0.5rem; }
 97 | .h-3\/4r, .sz-3\/4r    { height: 0.75rem; }
 98 | .h-1r, .sz-1r          { height: 1rem; }
 99 | .h-3\/2r, .sz-3\/2r    { height: 1.5rem; }
100 | .h-2r, .sz-2r          { height: 2rem; }
101 | .h-5\/2r, .sz-5\/2r    { height: 2.5rem; }
102 | .h-3r, .sz-3r          { height: 3rem; }
103 | .h-7\/2r, .sz-7\/2r    { height: 3.5rem; }
104 | .h-4r, .sz-4r          { height: 4rem; }
105 | .h-9\/2r, .sz-9\/2r    { height: 4.5rem; }
106 | .h-5r, .sz-5r          { height: 5rem; }
107 | .h-11\/2r, .sz-11\/2r  { height: 5.5rem; }
108 | .h-6r, .sz-6r          { height: 6rem; }
109 | 
110 | @if ($responsive == true) {
111 |   @include generateResponsive() {
112 |     .h-1\/4r\@#{$breakpointAlias}, .sz-1\/4r\@#{$breakpointAlias}    { height: 0.25rem; }
113 |     .h-1\/2r\@#{$breakpointAlias}, .sz-1\/2r\@#{$breakpointAlias}    { height: 0.5rem; }
114 |     .h-3\/4r\@#{$breakpointAlias}, .sz-3\/4r\@#{$breakpointAlias}    { height: 0.75rem; }
115 |     .h-1r\@#{$breakpointAlias}, .sz-1r\@#{$breakpointAlias}          { height: 1rem; }
116 |     .h-3\/2r\@#{$breakpointAlias}, .sz-3\/2r\@#{$breakpointAlias}    { height: 1.5rem; }
117 |     .h-2r\@#{$breakpointAlias}, .sz-2r\@#{$breakpointAlias}          { height: 2rem; }
118 |     .h-5\/2r\@#{$breakpointAlias}, .sz-5\/2r\@#{$breakpointAlias}    { height: 2.5rem; }
119 |     .h-3r\@#{$breakpointAlias}, .sz-3r\@#{$breakpointAlias}          { height: 3rem; }
120 |     .h-7\/2r\@#{$breakpointAlias}, .sz-7\/2r\@#{$breakpointAlias}    { height: 3.5rem; }
121 |     .h-4r\@#{$breakpointAlias}, .sz-4r\@#{$breakpointAlias}          { height: 4rem; }
122 |     .h-9\/2r\@#{$breakpointAlias}, .sz-9\/2r\@#{$breakpointAlias}    { height: 4.5rem; }
123 |     .h-5r\@#{$breakpointAlias}, .sz-5r\@#{$breakpointAlias}          { height: 5rem; }
124 |     .h-11\/2r\@#{$breakpointAlias}, .sz-11\/2r\@#{$breakpointAlias}  { height: 5.5rem; }
125 |     .h-6r\@#{$breakpointAlias}, .sz-6r\@#{$breakpointAlias}          { height: 6rem; }
126 |   }
127 | }
128 | 
129 | .h-0     { height: 0; }
130 | .h-auto  { height: auto; }
131 | .h-100p  { height: 100%; }
132 | .h-100vh { height: 100vh; }
133 | 
134 | @if ($responsive == true) {
135 |   @include generateResponsive() {
136 |     .h-0\@#{$breakpointAlias}     { height: 0; }
137 |     .h-auto\@#{$breakpointAlias}  { height: auto; }
138 |     .h-100p\@#{$breakpointAlias}  { height: 100%; }
139 |     .h-100vh\@#{$breakpointAlias} { height: 100vh; }
140 |   }
141 | }
142 | 
143 | // ---------------------------------------------------------
144 | // @Max Size
145 | // ---------------------------------------------------------
146 | 
147 | .mw-100p { max-width: 100%; }
148 | .mh-100p { max-height: 100%; }
149 | 
150 | @if ($responsive == true) {
151 |   @include generateResponsive() {
152 |     .mw-100p\@#{$breakpointAlias} { max-width: 100%; }
153 |     .mh-100p\@#{$breakpointAlias} { max-height: 100%; }
154 |   }
155 | }
156 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/helpers/typography.scss:
--------------------------------------------------------------------------------
  1 | 
  2 | // ---------------------------------------------------------
  3 | // @TOC
  4 | // ---------------------------------------------------------
  5 | 
  6 | // + @Variables
  7 | // + @Text Align
  8 | // + @Text Transform
  9 | // + @Font Style
 10 | // + @Text Decoration
 11 | // + @White Space
 12 | // + @Word Break
 13 | // + @Word Wrap
 14 | // + @Text Overflow
 15 | // + @Font Size
 16 | // + @Font Weight
 17 | // + @Line Height
 18 | 
 19 | // ---------------------------------------------------------
 20 | // @Variables
 21 | // ---------------------------------------------------------
 22 | 
 23 | $responsive: true;
 24 | 
 25 | // ---------------------------------------------------------
 26 | // @Text Align
 27 | // ---------------------------------------------------------
 28 | 
 29 | .ta-c { text-align: center !important; }
 30 | .ta-l { text-align: left !important; }
 31 | .ta-r { text-align: right !important; }
 32 | 
 33 | @if ($responsive == true) {
 34 |   @include generateResponsive() {
 35 |     .ta-c\@#{$breakpointAlias} { text-align: center !important; }
 36 |     .ta-l\@#{$breakpointAlias} { text-align: left !important; }
 37 |     .ta-r\@#{$breakpointAlias} { text-align: right !important; }
 38 |   }
 39 | }
 40 | 
 41 | // ---------------------------------------------------------
 42 | // @Text Transform
 43 | // ---------------------------------------------------------
 44 | 
 45 | .tt-n { text-transform: none !important; }
 46 | .tt-u { text-transform: uppercase !important; }
 47 | .tt-l { text-transform: lowercase !important; }
 48 | .tt-c { text-transform: capitalize !important; }
 49 | 
 50 | // ---------------------------------------------------------
 51 | // @Font Style
 52 | // ---------------------------------------------------------
 53 | 
 54 | .fs-i { font-style: italic !important; }
 55 | .fs-o { font-style: oblique !important; }
 56 | 
 57 | // ---------------------------------------------------------
 58 | // @Text Decoration
 59 | // ---------------------------------------------------------
 60 | 
 61 | .td-n { text-decoration: none !important; }
 62 | .td-o { text-decoration: overline !important; }
 63 | .td-lt { text-decoration: line-through !important; }
 64 | .td-u { text-decoration: underline !important; }
 65 | 
 66 | // ---------------------------------------------------------
 67 | // @White Space
 68 | // ---------------------------------------------------------
 69 | 
 70 | .whs-nw { white-space: nowrap !important; }
 71 | .whs-p { white-space: pre !important; }
 72 | .whs-n { white-space: normal !important; }
 73 | 
 74 | // ---------------------------------------------------------
 75 | // @Word Break
 76 | // ---------------------------------------------------------
 77 | 
 78 | .wob-n { word-break: normal !important; }
 79 | .wob-ba { word-break: break-all !important; }
 80 | .wob-k { word-break: keep-all !important; }
 81 | 
 82 | // ---------------------------------------------------------
 83 | // @Word Wrap
 84 | // ---------------------------------------------------------
 85 | 
 86 | .wow-bw { word-wrap: break-word !important; }
 87 | .wow-n { word-wrap: normal !important; }
 88 | 
 89 | // ---------------------------------------------------------
 90 | // @Text Overflow
 91 | // ---------------------------------------------------------
 92 | 
 93 | .tov-e { text-overflow: ellipsis !important; }
 94 | 
 95 | // ---------------------------------------------------------
 96 | // @Font Size
 97 | // ---------------------------------------------------------
 98 | 
 99 | .fsz-xs   { font-size: 0.75rem !important; }
100 | .fsz-sm   { font-size: 0.87rem !important; }
101 | .fsz-def  { font-size: 1rem !important; }
102 | .fsz-md   { font-size: 1.15rem !important; }
103 | .fsz-lg   { font-size: 1.4rem !important; }
104 | .fsz-xl   { font-size: 1.7rem !important; }
105 | 
106 | // ---------------------------------------------------------
107 | // @Font Weight
108 | // ---------------------------------------------------------
109 | 
110 | .fw-100 { font-weight: 100 !important; }
111 | .fw-200 { font-weight: 200 !important; }
112 | .fw-300 { font-weight: 300 !important; }
113 | .fw-400 { font-weight: 400 !important; }
114 | .fw-500 { font-weight: 500 !important; }
115 | .fw-600 { font-weight: 600 !important; }
116 | .fw-700 { font-weight: 700 !important; }
117 | .fw-800 { font-weight: 800 !important; }
118 | .fw-900 { font-weight: 900 !important; }
119 | 
120 | // ---------------------------------------------------------
121 | // @Line Height
122 | // ---------------------------------------------------------
123 | 
124 | .lh-0    { line-height: 0 !important; }
125 | .lh-1    { line-height: 1 !important; }
126 | .lh-3\/2 { line-height: 1.5 !important; }
127 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/index.scss:
--------------------------------------------------------------------------------
1 | @import 'mixins/index';
2 | @import 'utils/index';
3 | @import 'helpers/index';
4 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/mixins/generateResponsive.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @Responsive Suffix Generator
 3 | // ---------------------------------------------------------
 4 | 
 5 | // Mixin used to generate responsive suffixes for classes (i.e. m-10@sm+).
 6 | 
 7 | 
 8 | @mixin generateResponsive() {
 9 |   @each $breakpoint in $breakpoints {
10 |     $breakpointAlias     : nth($breakpoint, 1) !global;
11 |     $breakpointCondition : nth($breakpoint, 2);
12 | 
13 |     @include mediaQueryCondition($breakpointAlias) {
14 |       @content;
15 |     }
16 | 
17 |     $breakpointAlias: null !global;
18 |   }
19 | }
20 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/mixins/index.scss:
--------------------------------------------------------------------------------
1 | @import 'mediaQueryCondition';
2 | @import 'generateResponsive';
3 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/mixins/mediaQueryCondition.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @Media Queries Generator
 3 | // ---------------------------------------------------------
 4 | 
 5 | // Mixin used to generate responsive versions of css rules.
 6 | 
 7 | @mixin mediaQueryCondition($mq) {
 8 |   $breakpointFound: false;
 9 | 
10 |   @each $breakpoint in $breakpoints {
11 |     $alias: nth($breakpoint, 1);
12 |     $condition: nth($breakpoint, 2);
13 | 
14 |     @if $mq == $alias and $condition {
15 |       $breakpointFound: true;
16 | 
17 |       @media #{$condition} {
18 |         @content;
19 |       }
20 |     }
21 |   }
22 | 
23 |   @if $breakpointFound == false {
24 |     @warn "Oops! Breakpoint ‘#{$mq}’ does not exist \:";
25 |   }
26 | }
27 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/utils/center.scss:
--------------------------------------------------------------------------------
 1 | // ---------------------------------------------------------
 2 | // @TOC
 3 | // ---------------------------------------------------------
 4 | 
 5 | // + @Variables
 6 | // + @Centering
 7 | 
 8 | // ---------------------------------------------------------
 9 | // @Variables
10 | // ---------------------------------------------------------
11 | 
12 | $responsive: true;
13 | 
14 | // ---------------------------------------------------------
15 | // @Centering
16 | // ---------------------------------------------------------
17 | 
18 | .centerY {
19 |   top: 50%;
20 |   transform: translateY(-50%);
21 | }
22 | 
23 | .centerX {
24 |   left: 50%;
25 |   transform: translateX(-50%);
26 | }
27 | 
28 | .centerXY {
29 |   top: 50%;
30 |   left: 50%;
31 |   transform: translate(-50%, -50%);
32 | }
33 | 
34 | @if ($responsive == true) {
35 |   @include generateResponsive() {
36 |     .centerY\@#{$breakpointAlias} {
37 |       top: 50%;
38 |       transform: translateY(-50%);
39 |     }
40 | 
41 |     .centerX\@#{$breakpointAlias} {
42 |       left: 50%;
43 |       transform: translateX(-50%);
44 |     }
45 | 
46 |     .centerXY\@#{$breakpointAlias} {
47 |       top: 50%;
48 |       left: 50%;
49 |       transform: translate(-50%, -50%);
50 |     }
51 |   }
52 | }
53 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/utils/gap.scss:
--------------------------------------------------------------------------------
  1 | // ---------------------------------------------------------
  2 | // @TOC
  3 | // ---------------------------------------------------------
  4 | 
  5 | // + @Variables
  6 | // + @Base
  7 | // + @Gap (0 > 4 Step 1)
  8 | // + @Gap (5 > 35 Step 5)
  9 | // + @Gap (40 > 160 Step 10)
 10 | 
 11 | // ---------------------------------------------------------
 12 | // @Variables
 13 | // ---------------------------------------------------------
 14 | 
 15 | $responsive: true;
 16 | 
 17 | // ---------------------------------------------------------
 18 | // @Base
 19 | // ---------------------------------------------------------
 20 | 
 21 | [class*='gap'] {
 22 |   width: auto !important;
 23 |   overflow: hidden !important;
 24 | }
 25 | 
 26 | // ---------------------------------------------------------
 27 | // @Gap (0 > 4 Step 1)
 28 | // ---------------------------------------------------------
 29 | 
 30 | @for $i from 0 through 4 {
 31 |   .gapX-#{$i} {
 32 |     margin-left: #{($i / -2)}px !important;
 33 |     margin-right: #{($i / -2)}px !important;
 34 | 
 35 |     & > * {
 36 |       padding-left: #{($i / 2)}px !important;
 37 |       padding-right: #{($i / 2)}px !important;
 38 |     }
 39 |   }
 40 | 
 41 |   .gapY-#{$i} {
 42 |     margin-top: #{($i / -2)}px !important;
 43 |     margin-bottom: #{($i / -2)}px !important;
 44 | 
 45 |     & > * {
 46 |       padding-top: #{($i / 2)}px !important;
 47 |       padding-bottom: #{($i / 2)}px !important;
 48 |     }
 49 |   }
 50 | 
 51 |   .gap-#{$i} {
 52 |     margin: #{($i / -2)}px !important;
 53 | 
 54 |     & > * {
 55 |       padding: #{($i / 2)}px !important;
 56 |     }
 57 |   }
 58 | 
 59 |   @if ($responsive == true) {
 60 |     @include generateResponsive() {
 61 |       .gapX-#{$i}\@#{$breakpointAlias} {
 62 |         margin-left: #{($i / -2)}px !important;
 63 |         margin-right: #{($i / -2)}px !important;
 64 | 
 65 |         & > * {
 66 |           padding-left: #{($i / 2)}px !important;
 67 |           padding-right: #{($i / 2)}px !important;
 68 |         }
 69 |       }
 70 | 
 71 |       .gapY-#{$i}\@#{$breakpointAlias} {
 72 |         margin-top: #{($i / -2)}px !important;
 73 |         margin-bottom: #{($i / -2)}px !important;
 74 | 
 75 |         & > * {
 76 |           padding-top: #{($i / 2)}px !important;
 77 |           padding-bottom: #{($i / 2)}px !important;
 78 |         }
 79 |       }
 80 | 
 81 |       .gap-#{$i}\@#{$breakpointAlias} {
 82 |         margin: #{($i / -2)}px !important;
 83 | 
 84 |         & > * {
 85 |           padding: #{($i / 2)}px !important;
 86 |         }
 87 |       }
 88 |     }
 89 |   }
 90 | }
 91 | 
 92 | // ---------------------------------------------------------
 93 | // @Gap (5 > 35 Step 5)
 94 | // ---------------------------------------------------------
 95 | 
 96 | @for $i from 5 through 35 {
 97 |   @if $i % 5 == 0 {
 98 |     .gapX-#{$i} {
 99 |       margin-left: #{($i / -2)}px !important;
100 |       margin-right: #{($i / -2)}px !important;
101 | 
102 |       & > * {
103 |         padding-left: #{($i / 2)}px !important;
104 |         padding-right: #{($i / 2)}px !important;
105 |       }
106 |     }
107 | 
108 |     .gapY-#{$i} {
109 |       margin-top: #{($i / -2)}px !important;
110 |       margin-bottom: #{($i / -2)}px !important;
111 | 
112 |       & > * {
113 |         padding-top: #{($i / 2)}px !important;
114 |         padding-bottom: #{($i / 2)}px !important;
115 |       }
116 |     }
117 | 
118 |     .gap-#{$i} {
119 |       margin: #{($i / -2)}px !important;
120 | 
121 |       & > * {
122 |         padding: #{($i / 2)}px !important;
123 |       }
124 |     }
125 | 
126 |     @if ($responsive == true) {
127 |       @include generateResponsive() {
128 |         .gapX-#{$i}\@#{$breakpointAlias} {
129 |           margin-left: #{($i / -2)}px !important;
130 |           margin-right: #{($i / -2)}px !important;
131 | 
132 |           & > * {
133 |             padding-left: #{($i / 2)}px !important;
134 |             padding-right: #{($i / 2)}px !important;
135 |           }
136 |         }
137 | 
138 |         .gapY-#{$i}\@#{$breakpointAlias} {
139 |           margin-top: #{($i / -2)}px !important;
140 |           margin-bottom: #{($i / -2)}px !important;
141 | 
142 |           & > * {
143 |             padding-top: #{($i / 2)}px !important;
144 |             padding-bottom: #{($i / 2)}px !important;
145 |           }
146 |         }
147 | 
148 |         .gap-#{$i}\@#{$breakpointAlias} {
149 |           margin: #{($i / -2)}px !important;
150 | 
151 |           & > * {
152 |             padding: #{($i / 2)}px !important;
153 |           }
154 |         }
155 |       }
156 |     }
157 |   }
158 | }
159 | 
160 | // ---------------------------------------------------------
161 | // @Gap (40 > 160 Step 10)
162 | // ---------------------------------------------------------
163 | 
164 | @for $i from 40 through 160 {
165 |   @if $i % 10 == 0 {
166 |     .gapX-#{$i} {
167 |       margin-left: #{($i / -2)}px !important;
168 |       margin-right: #{($i / -2)}px !important;
169 | 
170 |       & > * {
171 |         padding-left: #{($i / 2)}px !important;
172 |         padding-right: #{($i / 2)}px !important;
173 |       }
174 |     }
175 | 
176 |     .gapY-#{$i} {
177 |       margin-top: #{($i / -2)}px !important;
178 |       margin-bottom: #{($i / -2)}px !important;
179 | 
180 |       & > * {
181 |         padding-top: #{($i / 2)}px !important;
182 |         padding-bottom: #{($i / 2)}px !important;
183 |       }
184 |     }
185 | 
186 |     .gap-#{$i} {
187 |       margin: #{($i / -2)}px !important;
188 | 
189 |       & > * {
190 |         padding: #{($i / 2)}px !important;
191 |       }
192 |     }
193 | 
194 |     @if ($responsive == true) {
195 |       @include generateResponsive() {
196 |         .gapX-#{$i}\@#{$breakpointAlias} {
197 |           margin-left: #{($i / -2)}px !important;
198 |           margin-right: #{($i / -2)}px !important;
199 | 
200 |           & > * {
201 |             padding-left: #{($i / 2)}px !important;
202 |             padding-right: #{($i / 2)}px !important;
203 |           }
204 |         }
205 | 
206 |         .gapY-#{$i}\@#{$breakpointAlias} {
207 |           margin-top: #{($i / -2)}px !important;
208 |           margin-bottom: #{($i / -2)}px !important;
209 | 
210 |           & > * {
211 |             padding-top: #{($i / 2)}px !important;
212 |             padding-bottom: #{($i / 2)}px !important;
213 |           }
214 |         }
215 | 
216 |         .gap-#{$i}\@#{$breakpointAlias} {
217 |           margin: #{($i / -2)}px !important;
218 | 
219 |           & > * {
220 |             padding: #{($i / 2)}px !important;
221 |           }
222 |         }
223 |       }
224 |     }
225 |   }
226 | }
227 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/utils/index.scss:
--------------------------------------------------------------------------------
1 | @import 'center';
2 | @import 'gap';
3 | @import 'peers';
4 | @import 'layers';
5 | 
6 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/utils/layers.scss:
--------------------------------------------------------------------------------
1 | .layers {
2 |   display: flex;
3 |   flex-flow: column nowrap;
4 |   align-items: center;
5 | }
6 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/spec/utils/layout/utils/peers.scss:
--------------------------------------------------------------------------------
 1 | .peers {
 2 |   box-sizing: border-box;
 3 |   display: flex !important;
 4 |   align-items: flex-start;
 5 |   justify-content: flex-start;
 6 |   flex-flow: row wrap;
 7 |   height: auto;
 8 |   max-width: 100%;
 9 |   margin: 0;
10 |   padding: 0;
11 | }
12 | 
13 | .peer {
14 |   display: block;
15 |   height: auto;
16 |   flex: 0 0 auto;
17 | }
18 | 
19 | .peer-greed {
20 |   flex: 1 1 auto;
21 |   // overflow: hidden;
22 | }
23 | 
24 | .peers-greed > .peer,
25 | .peers-greed > .peers {
26 |   flex: 1 1 auto;
27 | }
28 | 
29 | .peer > img {
30 |   max-width: none;
31 | }
32 | 
33 | .peer-greed > img {
34 |   max-width: 100%;
35 | }
36 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/vendor/datepicker.scss:
--------------------------------------------------------------------------------
  1 | .datepicker {
  2 |   border-radius: 0;
  3 |   padding: 25px;
  4 |   box-shadow: none;
  5 |   border: 1px solid $border-color;
  6 | 
  7 |   table {
  8 |     tr {
  9 |       th,
 10 |       td {
 11 |         border-radius: 0;
 12 |         width: 40px;
 13 |         height: 35px;
 14 |       }
 15 | 
 16 |       td {
 17 |         transition: all 0.2s ease-in-out;
 18 | 
 19 |         span {
 20 |           border-radius: 0;
 21 |         }
 22 |       }
 23 |     }
 24 |   }
 25 | }
 26 | 
 27 | .datepicker table tr td span.active:active,
 28 | .datepicker table tr td span.active:hover:active,
 29 | .datepicker table tr td span.active.disabled:active,
 30 | .datepicker table tr td span.active.disabled:hover:active,
 31 | .datepicker table tr td span.active.active,
 32 | .datepicker table tr td span.active:hover.active,
 33 | .datepicker table tr td span.active.disabled.active,
 34 | .datepicker table tr td span.active.disabled:hover.active,
 35 | .datepicker table tr td span.active.active:hover,
 36 | .datepicker table tr td span.active:hover.active:hover,
 37 | .datepicker table tr td.active:active,
 38 | .datepicker table tr td.active.highlighted:active,
 39 | .datepicker table tr td.active.active,
 40 | .datepicker table tr td.active.highlighted.active,
 41 | .datepicker table tr td.active:active:hover,
 42 | .datepicker table tr td.active.highlighted:active:hover,
 43 | .datepicker table tr td.active.active:hover,
 44 | .datepicker table tr td.active.highlighted.active:hover,
 45 | .datepicker table tr td.active:active:focus,
 46 | .datepicker table tr td.active.highlighted:active:focus,
 47 | .datepicker table tr td.active.active:focus,
 48 | .datepicker table tr td.active.highlighted.active:focus,
 49 | .datepicker table tr td.active:active.focus,
 50 | .datepicker table tr td.active.highlighted:active.focus,
 51 | .datepicker table tr td.active.active.focus,
 52 | .datepicker table tr td.active.highlighted.active.focus {
 53 |   color: $default-white;
 54 |   background-color: $default-primary;
 55 |   border-color: transparent;
 56 | }
 57 | 
 58 | .datepicker table tr td span:hover,
 59 | .datepicker table tr td span.focused {
 60 |   background: $default-primary;
 61 |   color: #fff;
 62 | }
 63 | 
 64 | .datepicker table tr td.day:hover,
 65 | .datepicker table tr td.focused {
 66 |   background: $default-primary;
 67 |   color: #fff;
 68 |   cursor: pointer;
 69 | }
 70 | 
 71 | .datepicker .datepicker-switch:hover,
 72 | .datepicker .prev:hover,
 73 | .datepicker .next:hover,
 74 | .datepicker tfoot tr th:hover {
 75 |   background: $default-primary;
 76 |   color: #fff;
 77 |   cursor: pointer;
 78 | }
 79 | 
 80 | .datepicker-inline {
 81 |   width: 330px;
 82 | }
 83 | 
 84 | .daterangepicker {
 85 |   border-radius: 0;
 86 |   padding: 30px;
 87 |   box-shadow: none;
 88 |   border: 1px solid $border-color;
 89 | 
 90 |   .input-mini {
 91 |     border-radius: 0;
 92 |     margin-bottom: 20px;
 93 |     height: 40px;
 94 |     padding: 0 6px 0 35px;
 95 | 
 96 |     &.active {
 97 |       border-radius: 0;
 98 |       border-color: lighten($default-info, 20%);
 99 |     }
100 |   }
101 | 
102 |   .daterangepicker_input {
103 |     i {
104 |       position: absolute;
105 |       left: 10px;
106 |       top: 13px;
107 |     }
108 |   }
109 | 
110 |   td,
111 |   th {
112 |     border-radius: 0;
113 |     width: 40px;
114 |     height: 35px;
115 | 
116 |     &.available{
117 |       &:hover{
118 |         background: $default-primary;
119 |         color: #fff;
120 |       }
121 |     }
122 |   }
123 | 
124 |   td {
125 |     &.in-range {
126 |       background-color: transparent;
127 |       color: $default-primary;
128 |     }
129 | 
130 |     &.active {
131 |       background-color: $default-primary;
132 |       border-color: transparent;
133 |       color: #fff;
134 | 
135 |       &:hover {
136 |         background-color: $default-primary;
137 |         border-color: transparent;
138 |         color: #fff;
139 |       }
140 |     }
141 | 
142 |     &.start-date {
143 |       border-radius: 0;
144 | 
145 |       &.end-date {
146 |         border-radius: 0;
147 |       }
148 |     }
149 | 
150 |     &.end-date {
151 |       border-radius: 0;
152 |     }
153 |   }
154 | 
155 |   select {
156 |     &.hourselect,
157 |     &.minuteselect,
158 |     &.secondselect,
159 |     &.ampmselect {
160 |       border: 1px solid $border-color;
161 |       min-height: 30px;
162 |     }
163 |   }
164 | 
165 |   .calendar-time {
166 |     i {
167 |       top: 8px;
168 |       left: 35px;
169 |     }
170 |   }
171 | 
172 |   @include from($breakpoint-sm) {
173 |     .calendar {
174 |       margin-right: 20px !important;
175 |     }
176 |   }
177 | }
178 | 
179 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/vendor/fullcalendar.scss:
--------------------------------------------------------------------------------
 1 | .fc {
 2 |   background-color: $default-white;
 3 |   border: 1px solid $border-color;
 4 | 
 5 |   th {
 6 |     text-align: center;
 7 |     padding: 15px;
 8 |     background-color: transparent;
 9 |     color: $default-text-color;
10 |     font-size: 12px;
11 |     text-transform: uppercase;
12 |     border-right-width: 0;
13 |     border-left-width: 0;
14 |   }
15 | 
16 |   button {
17 |     background-color: $default-white;
18 |     background-image: none;
19 |     height: 37px;
20 |     padding: 0 15px;
21 |     color: darken($default-text-color, 10%);
22 | 
23 |     &.fc-state-default {
24 |       border-color: $border-color;
25 |       box-shadow: none;
26 |     }
27 | 
28 |     &.fc-state-active {
29 |       box-shadow: none;
30 |       background-color: $border-color;
31 |     }
32 |   }
33 | }
34 | 
35 | .fc-toolbar {
36 |   padding: 20px 20px 0;
37 | }
38 | 
39 | .fc-view,
40 | .fc-view > table {
41 |   background-color: $default-white;
42 | }
43 | 
44 | .fc-basic-view td.fc-day-number,
45 | .fc-basic-view td.fc-week-number span {
46 |   padding: 7px 15px;
47 | }
48 | 
49 | .fc-unthemed {
50 |   .fc-content,
51 |   .fc-divider,
52 |   .fc-popover,
53 |   .fc-row,
54 |   tbody,
55 |   td,
56 |   th,
57 |   thead {
58 |     border-color: $border-color;
59 |   }
60 | 
61 |   .fc-today {
62 |     background-color: transparent;
63 |   }
64 | }
65 | 
66 | .fc-basic-view {
67 |   .fc-day-number {
68 |     &.fc-today {
69 |       background-color: $default-info;
70 |       color: $default-white;
71 |       display: inline-block;
72 |       float: right;
73 |       border-radius: 50%;
74 |       padding: 6px 8px;
75 |       line-height: 1;
76 |       margin: 4px 4px 0 0;
77 |     }
78 |   }
79 | }
80 | 
81 | .fc-event-container {
82 |   .fc-event {
83 |     border-radius: 0;
84 |     border: 0;
85 |     background-color: $inverse-info;
86 |     color: $default-info !important;
87 |     font-size: 12px;
88 |     line-height: 2.5;
89 |     padding: 0 15px;
90 |   }
91 | 
92 |   .fc-day-grid-event {
93 |     margin: 1px 5px 5px;
94 |   }
95 | }
96 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/vendor/index.scss:
--------------------------------------------------------------------------------
1 | @import '~perfect-scrollbar/css/perfect-scrollbar';
2 | @import 'themify-icons';
3 | @import 'font-awesome';
4 | @import 'perfectScrollbar';
5 | @import 'sparkline';
6 | @import 'jquery.datatables';
7 | @import 'fullcalendar';
8 | @import 'datepicker';
9 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/vendor/jquery.datatables.scss:
--------------------------------------------------------------------------------
  1 | table {
  2 |   &.dataTable {
  3 |     &.no-footer {
  4 |       border-bottom: 1px solid $border-color;
  5 |       margin-bottom: 20px;
  6 |     }
  7 |   }
  8 | }
  9 | 
 10 | .sorting_asc {
 11 |   &:focus {
 12 |     outline: none;
 13 |   }
 14 | }
 15 | 
 16 | .dataTables_wrapper {
 17 |   overflow: hidden;
 18 |   padding-bottom: 5px;
 19 | 
 20 |   .dataTables_length{
 21 |     color: $default-dark;
 22 |     float: left;
 23 | 
 24 |     @include to($breakpoint-sm) {
 25 |       text-align: left;
 26 |     }
 27 | 
 28 |     select {
 29 |       border: 1px solid $border-color;
 30 |       border-radius: 2px;
 31 |       box-shadow: none;
 32 |       height: 35px;
 33 |       font-size: 14px;
 34 |       padding: 5px;
 35 |       margin-left: 5px;
 36 |       margin-right: 5px;
 37 |       color: $default-text-color;
 38 |       transition: all 0.2s ease-in;
 39 |     }
 40 |   }
 41 | 
 42 |   .dataTables_filter {
 43 |     color: $default-dark;
 44 |     float: right;
 45 | 
 46 |     @include to($breakpoint-sm) {
 47 |       text-align: left;
 48 |     }
 49 | 
 50 |     input {
 51 |       border: 1px solid $border-color;
 52 |       border-radius: 2px;
 53 |       box-shadow: none;
 54 |       height: 35px;
 55 |       font-size: 14px;
 56 |       margin-left: 15px;
 57 |       padding: 5px;
 58 |       color: $default-text-color;
 59 |       transition: all 0.2s ease-in;
 60 |     }
 61 |   }
 62 | 
 63 |   .dataTables_info {
 64 |     color: $default-text-color;
 65 |     float: left;
 66 |   }
 67 | 
 68 |   .dataTables_processing {
 69 |     color: $default-dark;
 70 |   }
 71 | 
 72 |   .dataTables_paginate {
 73 |     color: $default-text-color;
 74 |     float: right;
 75 | 
 76 |     .paginate_button {
 77 |       color: $default-text-color !important;
 78 |       padding: 6px 12px;
 79 |       border-radius: 2px;
 80 |       margin-right: 10px;
 81 |       transition: all 0.2s ease-in-out;
 82 |       text-decoration: none;
 83 | 
 84 |       &.next,
 85 |       &.previous,
 86 |       &.first,
 87 |       &.last {
 88 |         border-radius: 2px;
 89 |         text-decoration: none;
 90 | 
 91 |         &:hover,
 92 |         &:focus {
 93 |           color: #fff !important;
 94 |         }
 95 | 
 96 |         &.disabled {
 97 |           opacity: 0.4;
 98 |           pointer-events: none;
 99 |         }
100 |       }
101 | 
102 |       &:hover {
103 |         color: #fff !important;
104 |         background: $default-primary;
105 |       }
106 | 
107 |       &.current {
108 |         color: #fff !important;
109 |         background: $default-primary;
110 | 
111 |         &:hover {
112 |           color: $default-white !important;
113 |           background: $default-primary;
114 |         }
115 |       }
116 |     }
117 |   }
118 | 
119 |   .status {
120 |     width: 5px;
121 |     height: 5px;
122 |   }
123 | }
124 | 
125 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/vendor/perfectScrollbar.scss:
--------------------------------------------------------------------------------
1 | .ps__rail-y {
2 |   right: 0 !important;
3 |   left: auto !important;
4 | }
5 | 


--------------------------------------------------------------------------------
/resources/assets/sass/admin/vendor/sparkline.scss:
--------------------------------------------------------------------------------
1 | #jqstooltip {
2 |   width: auto !important;
3 |   height: auto !important;
4 |   padding: 5px 10px !important;
5 |   border-radius: 2px !important;
6 | }
7 | 


--------------------------------------------------------------------------------
/resources/assets/static/fonts/icons/fontawesome/FontAwesome.otf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/resources/assets/static/fonts/icons/fontawesome/FontAwesome.otf


--------------------------------------------------------------------------------
/resources/assets/static/fonts/icons/fontawesome/fontawesome-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/resources/assets/static/fonts/icons/fontawesome/fontawesome-webfont.eot


--------------------------------------------------------------------------------
/resources/assets/static/fonts/icons/fontawesome/fontawesome-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/resources/assets/static/fonts/icons/fontawesome/fontawesome-webfont.ttf


--------------------------------------------------------------------------------
/resources/assets/static/fonts/icons/fontawesome/fontawesome-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/resources/assets/static/fonts/icons/fontawesome/fontawesome-webfont.woff


--------------------------------------------------------------------------------
/resources/assets/static/fonts/icons/fontawesome/fontawesome-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/resources/assets/static/fonts/icons/fontawesome/fontawesome-webfont.woff2


--------------------------------------------------------------------------------
/resources/assets/static/fonts/icons/themify/themify.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/resources/assets/static/fonts/icons/themify/themify.eot


--------------------------------------------------------------------------------
/resources/assets/static/fonts/icons/themify/themify.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/resources/assets/static/fonts/icons/themify/themify.ttf


--------------------------------------------------------------------------------
/resources/assets/static/fonts/icons/themify/themify.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hafeez1042/Adminator-HTML5-Admin-Template-Laravel-Implementation/f73c6c67cca716ecd1b11416bc8498b5b1819ea7/resources/assets/static/fonts/icons/themify/themify.woff


--------------------------------------------------------------------------------
/resources/views/admin/404.blade.php:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html>
 3 | <head>
 4 |     <meta charset="utf-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 6 |     <title>404 - Page not found...</title>
 7 |     <link rel="stylesheet" href="{{  mix('/css/admin.css') }}">
 8 | </head>
 9 | <body class="app">
10 | <div class='pos-a t-0 l-0 bgc-white w-100 h-100 d-f fxd-r fxw-w ai-c jc-c pos-r p-30'>
11 |     <div class='mR-60'>
12 |         <img alt='#' src='/assets/static/images/404.png'/>
13 |     </div>
14 | 
15 |     <div class='d-f jc-c fxd-c'>
16 |         <h1 class='mB-30 fw-900 lh-1 c-red-500' style="font-size: 60px;">404</h1>
17 |         <h3 class='mB-10 fsz-lg c-grey-900 tt-c'>Oops Page Not Found</h3>
18 |         <p class='mB-30 fsz-def c-grey-700'>The page you are looking for does not exist or has been moved.</p>
19 |         <div>
20 |             <a href="/admin/dashboard" type='primary' class='btn btn-primary'>Go to Home</a>
21 |         </div>
22 |     </div>
23 | </div>
24 | </body>
25 | </html>
26 | 


--------------------------------------------------------------------------------
/resources/views/admin/500.blade.php:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html>
 3 | <head>
 4 |     <meta charset="utf-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 6 |     <title>500 - Internal server error</title>
 7 |     <link rel="stylesheet" href="{{  mix('/css/admin.css') }}">
 8 | </head>
 9 | <body class="app">
10 | <div class='pos-a t-0 l-0 bgc-white w-100 h-100 d-f fxd-r fxw-w ai-c jc-c pos-r p-30'>
11 |     <div class='mR-60'>
12 |         <img alt='#' src='/assets/static/images/500.png'/>
13 |     </div>
14 | 
15 |     <div class='d-f jc-c fxd-c'>
16 |         <h1 class='mB-30 fw-900 lh-1 c-red-500' style="font-size: 60px;">500</h1>
17 |         <h3 class='mB-10 fsz-lg c-grey-900 tt-c'>Internal server error</h3>
18 |         <p class='mB-30 fsz-def c-grey-700'>Something goes wrong with our servers, please try again later.</p>
19 |         <div>
20 |             <a href="/admin/dashboard" type='primary' class='btn btn-primary'>Go to Home</a>
21 |         </div>
22 |     </div>
23 | </div>
24 | </body>
25 | </html>
26 | 


--------------------------------------------------------------------------------
/resources/views/admin/basic-table.blade.php:
--------------------------------------------------------------------------------
  1 | @extends('admin.layout.layout')
  2 | 
  3 | @section('title', 'Basic Tables')
  4 | @section('mainContent')
  5 |     <div class="container-fluid">
  6 |         <h4 class="c-grey-900 mT-10 mB-30">Basic Tables</h4>
  7 |         <div class="row">
  8 |             <div class="col-md-12">
  9 |                 <div class="bgc-white bd bdrs-3 p-20 mB-20">
 10 |                     <h4 class="c-grey-900 mB-20">Simple Table</h4>
 11 |                     <p>Using the most basic table markup, here’s how <code class="highlighter-rouge">.table</code>-based
 12 |                         tables look in Bootstrap. <strong>All table styles are inherited in Bootstrap 4</strong>,
 13 |                         meaning any nested tables will be styled in the same manner as the parent.</p>
 14 |                     <table class="table">
 15 |                         <thead>
 16 |                         <tr>
 17 |                             <th scope="col">#</th>
 18 |                             <th scope="col">First Name</th>
 19 |                             <th scope="col">Last Name</th>
 20 |                             <th scope="col">Username</th>
 21 |                         </tr>
 22 |                         </thead>
 23 |                         <tbody>
 24 |                         <tr>
 25 |                             <th scope="row">1</th>
 26 |                             <td>Mark</td>
 27 |                             <td>Otto</td>
 28 |                             <td>@mdo</td>
 29 |                         </tr>
 30 |                         <tr>
 31 |                             <th scope="row">2</th>
 32 |                             <td>Jacob</td>
 33 |                             <td>Thornton</td>
 34 |                             <td>@fat</td>
 35 |                         </tr>
 36 |                         <tr>
 37 |                             <th scope="row">3</th>
 38 |                             <td>Larry</td>
 39 |                             <td>the Bird</td>
 40 |                             <td>@twitter</td>
 41 |                         </tr>
 42 |                         </tbody>
 43 |                     </table>
 44 |                 </div>
 45 |             </div>
 46 |         </div>
 47 |         <div class="row">
 48 |             <div class="col-md-12">
 49 |                 <div class="bgc-white bd bdrs-3 p-20 mB-20">
 50 |                     <h4 class="c-grey-900 mB-20">Table head options</h4>
 51 |                     <p>Similar to tables and dark tables, use the modifier classes <code class="highlighter-rouge">.thead-light</code>
 52 |                         or <code class="highlighter-rouge">.thead-dark</code> to make <code class="highlighter-rouge">&lt;thead&gt;</code>s
 53 |                         appear light or dark gray.</p>
 54 |                     <table class="table">
 55 |                         <thead class="thead-dark">
 56 |                         <tr>
 57 |                             <th scope="col">#</th>
 58 |                             <th scope="col">First Name</th>
 59 |                             <th scope="col">Last Name</th>
 60 |                             <th scope="col">Username</th>
 61 |                         </tr>
 62 |                         </thead>
 63 |                         <tbody>
 64 |                         <tr>
 65 |                             <th scope="row">1</th>
 66 |                             <td>Mark</td>
 67 |                             <td>Otto</td>
 68 |                             <td>@mdo</td>
 69 |                         </tr>
 70 |                         <tr>
 71 |                             <th scope="row">2</th>
 72 |                             <td>Jacob</td>
 73 |                             <td>Thornton</td>
 74 |                             <td>@fat</td>
 75 |                         </tr>
 76 |                         <tr>
 77 |                             <th scope="row">3</th>
 78 |                             <td>Larry</td>
 79 |                             <td>the Bird</td>
 80 |                             <td>@twitter</td>
 81 |                         </tr>
 82 |                         </tbody>
 83 |                     </table>
 84 |                 </div>
 85 |             </div>
 86 |         </div>
 87 |         <div class="row">
 88 |             <div class="col-md-12">
 89 |                 <div class="bgc-white bd bdrs-3 p-20 mB-20">
 90 |                     <h4 class="c-grey-900 mB-20">Striped rows</h4>
 91 |                     <p>Use <code class="highlighter-rouge">.table-striped</code> to add zebra-striping to any table row
 92 |                         within the <code class="highlighter-rouge">&lt;tbody&gt;</code>.</p>
 93 |                     <table class="table table-striped">
 94 |                         <thead>
 95 |                         <tr>
 96 |                             <th scope="col">#</th>
 97 |                             <th scope="col">First Name</th>
 98 |                             <th scope="col">Last Name</th>
 99 |                             <th scope="col">Username</th>
100 |                         </tr>
101 |                         </thead>
102 |                         <tbody>
103 |                         <tr>
104 |                             <th scope="row">1</th>
105 |                             <td>Mark</td>
106 |                             <td>Otto</td>
107 |                             <td>@mdo</td>
108 |                         </tr>
109 |                         <tr>
110 |                             <th scope="row">2</th>
111 |                             <td>Jacob</td>
112 |                             <td>Thornton</td>
113 |                             <td>@fat</td>
114 |                         </tr>
115 |                         <tr>
116 |                             <th scope="row">3</th>
117 |                             <td>Larry</td>
118 |                             <td>the Bird</td>
119 |                             <td>@twitter</td>
120 |                         </tr>
121 |                         </tbody>
122 |                     </table>
123 |                 </div>
124 |             </div>
125 |         </div>
126 |         <div class="row">
127 |             <div class="col-md-12">
128 |                 <div class="bgc-white bd bdrs-3 p-20 mB-20">
129 |                     <h4 class="c-grey-900 mB-20">Bordered table</h4>
130 |                     <p>Add <code class="highlighter-rouge">.table-bordered</code> for borders on all sides of the table
131 |                         and cells.</p>
132 |                     <table class="table table-bordered">
133 |                         <thead>
134 |                         <tr>
135 |                             <th scope="col">#</th>
136 |                             <th scope="col">First Name</th>
137 |                             <th scope="col">Last Name</th>
138 |                             <th scope="col">Username</th>
139 |                         </tr>
140 |                         </thead>
141 |                         <tbody>
142 |                         <tr>
143 |                             <th scope="row">1</th>
144 |                             <td>Mark</td>
145 |                             <td>Otto</td>
146 |                             <td>@mdo</td>
147 |                         </tr>
148 |                         <tr>
149 |                             <th scope="row">2</th>
150 |                             <td>Mark</td>
151 |                             <td>Otto</td>
152 |                             <td>@TwBootstrap</td>
153 |                         </tr>
154 |                         <tr>
155 |                             <th scope="row">3</th>
156 |                             <td>Jacob</td>
157 |                             <td>Thornton</td>
158 |                             <td>@fat</td>
159 |                         </tr>
160 |                         <tr>
161 |                             <th scope="row">4</th>
162 |                             <td colspan="2">Larry the Bird</td>
163 |                             <td>@twitter</td>
164 |                         </tr>
165 |                         </tbody>
166 |                     </table>
167 |                 </div>
168 |             </div>
169 |         </div>
170 |         <div class="row">
171 |             <div class="col-md-12">
172 |                 <div class="bgc-white bd bdrs-3 p-20">
173 |                     <h4 class="c-grey-900 mB-20">Hoverable rows</h4>
174 |                     <p>Add <code class="highlighter-rouge">.table-hover</code> to enable a hover state on table rows
175 |                         within a <code class="highlighter-rouge">&lt;tbody&gt;</code>.</p>
176 |                     <table class="table table-hover">
177 |                         <thead>
178 |                         <tr>
179 |                             <th scope="col">#</th>
180 |                             <th scope="col">First Name</th>
181 |                             <th scope="col">Last Name</th>
182 |                             <th scope="col">Username</th>
183 |                         </tr>
184 |                         </thead>
185 |                         <tbody>
186 |                         <tr>
187 |                             <th scope="row">1</th>
188 |                             <td>Mark</td>
189 |                             <td>Otto</td>
190 |                             <td>@mdo</td>
191 |                         </tr>
192 |                         <tr>
193 |                             <th scope="row">2</th>
194 |                             <td>Jacob</td>
195 |                             <td>Thornton</td>
196 |                             <td>@fat</td>
197 |                         </tr>
198 |                         <tr>
199 |                             <th scope="row">3</th>
200 |                             <td colspan="2">Larry the Bird</td>
201 |                             <td>@twitter</td>
202 |                         </tr>
203 |                         </tbody>
204 |                     </table>
205 |                 </div>
206 |             </div>
207 |         </div>
208 |     </div>
209 | @endsection
210 | 


--------------------------------------------------------------------------------
/resources/views/admin/blank.blade.php:
--------------------------------------------------------------------------------
1 | @extends('admin.layout.layout')
2 | 
3 | @section('title', 'Blank Page')
4 | @section('mainContent')
5 |     <div class="full-container"></div>
6 | @endsection
7 | 


--------------------------------------------------------------------------------
/resources/views/admin/buttons.blade.php:
--------------------------------------------------------------------------------
1 | @extends('admin.layout.layout')
2 | 
3 | @section('title', 'Buttons')
4 | @section('mainContent')
5 | @endsection
6 | 


--------------------------------------------------------------------------------
/resources/views/admin/charts.blade.php:
--------------------------------------------------------------------------------
  1 | @extends('admin.layout.layout')
  2 | 
  3 | @section('title', 'Charts')
  4 | @section('mainContent')
  5 |     <div class="row gap-20 masonry pos-r">
  6 |         <div class="masonry-sizer col-md-6 pos-a"></div>
  7 |         <div class="masonry-item col-md-6">
  8 |             <div class="bgc-white p-20 bd">
  9 |                 <h6 class="c-grey-900">Line Chart</h6>
 10 |                 <div class="mT-30">
 11 |                     <canvas id="line-chart" height="220"></canvas>
 12 |                 </div>
 13 |             </div>
 14 |         </div>
 15 |         <div class="masonry-item col-md-6">
 16 |             <div class="bgc-white p-20 bd">
 17 |                 <h6 class="c-grey-900">Area Chart</h6>
 18 |                 <div class="mT-30">
 19 |                     <canvas id="area-chart" height="220"></canvas>
 20 |                 </div>
 21 |             </div>
 22 |         </div>
 23 |         <div class="masonry-item col-md-6">
 24 |             <div class="bgc-white p-20 bd">
 25 |                 <h6 class="c-grey-900">Scatter Chart</h6>
 26 |                 <div class="mT-30">
 27 |                     <canvas id="scatter-chart" height="220"></canvas>
 28 |                 </div>
 29 |             </div>
 30 |         </div>
 31 |         <div class="masonry-item col-md-6">
 32 |             <div class="bgc-white p-20 bd">
 33 |                 <h6 class="c-grey-900">Bar Chart</h6>
 34 |                 <div class="mT-30">
 35 |                     <canvas id="bar-chart" height="220"></canvas>
 36 |                 </div>
 37 |             </div>
 38 |         </div>
 39 |         <div class="masonry-item col-md-6">
 40 |             <div class="bgc-white p-20 bd">
 41 |                 <h6 class="c-grey-900">jQuery Sparkline</h6>
 42 |                 <div class="mT-30">
 43 |                     <div class="peers ai-c jc-sb fxw-nw bdB pY-15">
 44 |                         <div class="peer">
 45 |                             <span>Spark Line</span>
 46 |                         </div>
 47 |                         <div class="peer">
 48 |                             <span class="sparkline">&nbsp;</span>
 49 |                         </div>
 50 |                     </div>
 51 |                     <div class="peers ai-c jc-sb fxw-nw bdB pY-15">
 52 |                         <div class="peer">
 53 |                             <span>Spark Bar</span>
 54 |                         </div>
 55 |                         <div class="peer">
 56 |                             <span class="sparkbar">&nbsp;</span>
 57 |                         </div>
 58 |                     </div>
 59 |                     <div class="peers ai-c jc-sb fxw-nw bdB pY-15">
 60 |                         <div class="peer">
 61 |                             <span>Spark Tristate</span>
 62 |                         </div>
 63 |                         <div class="peer">
 64 |                             <span class="sparktri">&nbsp;</span>
 65 |                         </div>
 66 |                     </div>
 67 |                     <div class="peers ai-c jc-sb fxw-nw bdB pY-15">
 68 |                         <div class="peer">
 69 |                             <span>Spark Discrete</span>
 70 |                         </div>
 71 |                         <div class="peer">
 72 |                             <span class="sparkdisc">&nbsp;</span>
 73 |                         </div>
 74 |                     </div>
 75 |                     <div class="peers ai-c jc-sb fxw-nw bdB pY-15">
 76 |                         <div class="peer">
 77 |                             <span>Spark Bullet</span>
 78 |                         </div>
 79 |                         <div class="peer">
 80 |                             <span class="sparkbull">&nbsp;</span>
 81 |                         </div>
 82 |                     </div>
 83 |                     <div class="peers ai-c jc-sb fxw-nw pT-15">
 84 |                         <div class="peer">
 85 |                             <span>Spark Box</span>
 86 |                         </div>
 87 |                         <div class="peer">
 88 |                             <span class="sparkbox">&nbsp;</span>
 89 |                         </div>
 90 |                     </div>
 91 |                 </div>
 92 |             </div>
 93 |         </div>
 94 |         <div class="masonry-item col-md-6">
 95 |             <div class="bgc-white p-20 bd">
 96 |                 <h6 class="c-grey-900">Easy Pie Charts</h6>
 97 |                 <div class="mT-30">
 98 |                     <div class="peers mT-20 fxw-nw@lg+ jc-sb ta-c gap-10">
 99 |                         <div class="peer">
100 |                             <div class="easy-pie-chart" data-size='80' data-percent="75" data-bar-color='#f44336'>
101 |                                 <span></span>
102 |                             </div>
103 |                             <h6 class="fsz-sm">New Users</h6>
104 |                         </div>
105 |                         <div class="peer">
106 |                             <div class="easy-pie-chart" data-size='80' data-percent="50" data-bar-color='#2196f3'>
107 |                                 <span></span>
108 |                             </div>
109 |                             <h6 class="fsz-sm">New Purchases</h6>
110 |                         </div>
111 |                         <div class="peer">
112 |                             <div class="easy-pie-chart" data-size='80' data-percent="65" data-bar-color='#f44336'>
113 |                                 <span></span>
114 |                             </div>
115 |                             <h6 class="fsz-sm">New Customers</h6>
116 |                         </div>
117 |                         <div class="peer">
118 |                             <div class="easy-pie-chart" data-size='80' data-percent="90" data-bar-color='#ff9800'>
119 |                                 <span></span>
120 |                             </div>
121 |                             <h6 class="fsz-sm">Bounce Rate</h6>
122 |                         </div>
123 |                     </div>
124 |                 </div>
125 |             </div>
126 |         </div>
127 |     </div>
128 | @endsection
129 | 


--------------------------------------------------------------------------------
/resources/views/admin/compose.blade.php:
--------------------------------------------------------------------------------
  1 | @extends('admin.layout.layout')
  2 | 
  3 | @section('title', 'Compose')
  4 | @section('mainContent')
  5 |     <div class="full-container">
  6 |         <div class="email-app">
  7 |             <div class="email-side-nav remain-height ov-h">
  8 |                 <div class="h-100 layers">
  9 |                     <div class="p-20 bgc-grey-100 layer w-100">
 10 |                         <a href="/compose" class="btn btn-danger btn-block">New Message</a>
 11 |                     </div>
 12 |                     <div class="scrollable pos-r bdT layer w-100 fxg-1">
 13 |                         <ul class="p-20 nav flex-column">
 14 |                             <li class="nav-item">
 15 |                                 <a href="javascript:void(0)" class="nav-link c-grey-800 cH-blue-500 active">
 16 |                                     <div class="peers ai-c jc-sb">
 17 |                                         <div class="peer peer-greed">
 18 |                                             <i class="mR-10 ti-email"></i>
 19 |                                             <span>Inbox</span>
 20 |                                         </div>
 21 |                                         <div class="peer">
 22 |                                             <span class="badge badge-pill bgc-deep-purple-50 c-deep-purple-700">+99</span>
 23 |                                         </div>
 24 |                                     </div>
 25 |                                 </a>
 26 |                             </li>
 27 |                             <li class="nav-item">
 28 |                                 <a href="" class="nav-link c-grey-800 cH-blue-500">
 29 |                                     <div class="peers ai-c jc-sb">
 30 |                                         <div class="peer peer-greed">
 31 |                                             <i class="mR-10 ti-share"></i>
 32 |                                             <span>Sent</span>
 33 |                                         </div>
 34 |                                         <div class="peer">
 35 |                                             <span class="badge badge-pill bgc-green-50 c-green-700">12</span>
 36 |                                         </div>
 37 |                                     </div>
 38 |                                 </a>
 39 |                             </li>
 40 |                             <li class="nav-item">
 41 |                                 <a href="" class="nav-link c-grey-800 cH-blue-500">
 42 |                                     <div class="peers ai-c jc-sb">
 43 |                                         <div class="peer peer-greed">
 44 |                                             <i class="mR-10 ti-star"></i>
 45 |                                             <span>Important</span>
 46 |                                         </div>
 47 |                                         <div class="peer">
 48 |                                             <span class="badge badge-pill bgc-blue-50 c-blue-700">3</span>
 49 |                                         </div>
 50 |                                     </div>
 51 |                                 </a>
 52 |                             </li>
 53 |                             <li class="nav-item">
 54 |                                 <a href="" class="nav-link c-grey-800 cH-blue-500">
 55 |                                     <div class="peers ai-c jc-sb">
 56 |                                         <div class="peer peer-greed">
 57 |                                             <i class="mR-10 ti-file"></i>
 58 |                                             <span>Drafts</span>
 59 |                                         </div>
 60 |                                         <div class="peer">
 61 |                                             <span class="badge badge-pill bgc-amber-50 c-amber-700">5</span>
 62 |                                         </div>
 63 |                                     </div>
 64 |                                 </a>
 65 |                             </li>
 66 |                             <li class="nav-item">
 67 |                                 <a href="" class="nav-link c-grey-800 cH-blue-500">
 68 |                                     <div class="peers ai-c jc-sb">
 69 |                                         <div class="peer peer-greed">
 70 |                                             <i class="mR-10 ti-alert"></i>
 71 |                                             <span>Spam</span>
 72 |                                         </div>
 73 |                                         <div class="peer">
 74 |                                             <span class="badge badge-pill bgc-red-50 c-red-700">1</span>
 75 |                                         </div>
 76 |                                     </div>
 77 |                                 </a>
 78 |                             </li>
 79 |                             <li class="nav-item">
 80 |                                 <a href="" class="nav-link c-grey-800 cH-blue-500">
 81 |                                     <div class="peers ai-c jc-sb">
 82 |                                         <div class="peer peer-greed">
 83 |                                             <i class="mR-10 ti-trash"></i>
 84 |                                             <span>Trash</span>
 85 |                                         </div>
 86 |                                         <div class="peer">
 87 |                                             <span class="badge badge-pill bgc-red-50 c-red-700">+99</span>
 88 |                                         </div>
 89 |                                     </div>
 90 |                                 </a>
 91 |                             </li>
 92 |                         </ul>
 93 |                     </div>
 94 |                 </div>
 95 |             </div>
 96 |             <div class="email-wrapper row remain-height pos-r scrollable bgc-white">
 97 |                 <div class="email-content open no-inbox-view">
 98 |                     <div class="email-compose">
 99 |                         <div class="d-n@md+ p-20">
100 |                             <a class="email-side-toggle c-grey-900 cH-blue-500 td-n" href="javascript:void(0)">
101 |                                 <i class="ti-menu"></i>
102 |                             </a>
103 |                         </div>
104 |                         <form class="email-compose-body">
105 |                             <h4 class="c-grey-900 mB-20">Send Message</h4>
106 |                             <div class="send-header">
107 |                                 <div class="form-group">
108 |                                     <input type="text" class='form-control' placeholder="To">
109 |                                 </div>
110 |                                 <div class="form-group">
111 |                                     <input type="text" class='form-control' placeholder="CC">
112 |                                 </div>
113 |                                 <div class="form-group">
114 |                                     <input class="form-control" placeholder="Email Subject">
115 |                                 </div>
116 |                                 <div class="form-group">
117 |                                     <textarea name="compose" class="form-control" placeholder="Say Hi..."
118 |                                               rows='10'></textarea>
119 |                                 </div>
120 |                             </div>
121 |                             <div id="compose-area"></div>
122 |                             <div class="text-right mrg-top-30">
123 |                                 <button class="btn btn-danger">Send</button>
124 |                             </div>
125 |                         </form>
126 |                     </div>
127 |                 </div>
128 |             </div>
129 |         </div>
130 |     </div>
131 | @endsection
132 | 


--------------------------------------------------------------------------------
/resources/views/admin/google-maps.blade.php:
--------------------------------------------------------------------------------
 1 | @extends('admin.layout.layout')
 2 | 
 3 | @section('title', 'Google Maps')
 4 | @section('mainContent')
 5 |     <div class="container-fluid">
 6 |         <h4 class="c-grey-900 mT-10 mB-30">Google Maps</h4>
 7 |         <div class="row">
 8 |             <div class="col-md-12">
 9 |                 <div class="bgc-white bd bdrs-3 p-20 mB-20">
10 |                     <h6 class="c-grey-900 mB-20">Google Maps</h6>
11 |                     <div id="google-map" style="padding-bottom: 75%;"></div>
12 |                 </div>
13 |             </div>
14 |         </div>
15 |     </div>
16 | @endsection
17 | 


--------------------------------------------------------------------------------
/resources/views/admin/layout/footer.blade.php:
--------------------------------------------------------------------------------
1 | <footer class="bdT ta-c p-30 lh-0 fsz-sm c-grey-600">
2 |     <span>Copyright © 2017 Designed by <a href="https://colorlib.com" target='_blank' title="Colorlib">Colorlib</a>. All rights reserved.</span>
3 | </footer>


--------------------------------------------------------------------------------
/resources/views/admin/layout/layout.blade.php:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html>
  3 | <head>
  4 |     <meta charset="utf-8">
  5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6 |     <title>Adminator - @yield('title')</title>
  7 |     <link rel="stylesheet" href="{{  mix('/css/admin.css') }}">
  8 |     <style>
  9 |         #loader {
 10 |             transition: all 0.3s ease-in-out;
 11 |             opacity: 1;
 12 |             visibility: visible;
 13 |             position: fixed;
 14 |             height: 100vh;
 15 |             width: 100%;
 16 |             background: #fff;
 17 |             z-index: 90000;
 18 |         }
 19 | 
 20 |         #loader.fadeOut {
 21 |             opacity: 0;
 22 |             visibility: hidden;
 23 |         }
 24 | 
 25 |         .spinner {
 26 |             width: 40px;
 27 |             height: 40px;
 28 |             position: absolute;
 29 |             top: calc(50% - 20px);
 30 |             left: calc(50% - 20px);
 31 |             background-color: #333;
 32 |             border-radius: 100%;
 33 |             -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
 34 |             animation: sk-scaleout 1.0s infinite ease-in-out;
 35 |         }
 36 | 
 37 |         @-webkit-keyframes sk-scaleout {
 38 |             0% { -webkit-transform: scale(0) }
 39 |             100% {
 40 |                 -webkit-transform: scale(1.0);
 41 |                 opacity: 0;
 42 |             }
 43 |         }
 44 | 
 45 |         @keyframes sk-scaleout {
 46 |             0% {
 47 |                 -webkit-transform: scale(0);
 48 |                 transform: scale(0);
 49 |             } 100% {
 50 |                   -webkit-transform: scale(1.0);
 51 |                   transform: scale(1.0);
 52 |                   opacity: 0;
 53 |               }
 54 |         }
 55 |     </style>
 56 | </head>
 57 | <body class="app">
 58 | <!-- @TOC -->
 59 | <!-- =================================================== -->
 60 | <!--
 61 |   + @Page Loader
 62 |   + @App Content
 63 |       - #Left Sidebar
 64 |           > $Sidebar Header
 65 |           > $Sidebar Menu
 66 | 
 67 |       - #Main
 68 |           > $Topbar
 69 |           > $App Screen Content
 70 | -->
 71 | 
 72 | <!-- @Page Loader -->
 73 | <!-- =================================================== -->
 74 | <div id='loader'>
 75 |     <div class="spinner"></div>
 76 | </div>
 77 | 
 78 | <script>
 79 |     window.addEventListener('load', () => {
 80 |         const loader = document.getElementById('loader');
 81 |         setTimeout(() => {
 82 |             loader.classList.add('fadeOut');
 83 |         }, 300);
 84 |     });
 85 | </script>
 86 | 
 87 | <!-- @App Content -->
 88 | <!-- =================================================== -->
 89 | <div>
 90 |     <!-- #Left Sidebar ==================== -->
 91 |     @include('admin.layout.sideBar')
 92 | 
 93 |     <!-- #Main ============================ -->
 94 |     <div class="page-container">
 95 |         <!-- ### $Topbar ### -->
 96 |         @include('admin.layout.topBar')
 97 | 
 98 |         <!-- ### $App Screen Content ### -->
 99 |         <main class='main-content bgc-grey-100'>
100 |             <div id='mainContent'>
101 |                 @yield('mainContent')
102 |             </div>
103 |         </main>
104 | 
105 |         <!-- ### $App Screen Footer ### -->
106 |         @include('admin.layout.footer')
107 |     </div>
108 | </div>
109 | <script src="{{ mix('/js/admin.js') }}"></script>
110 | </body>
111 | </html>
112 | 


--------------------------------------------------------------------------------
/resources/views/admin/layout/sideBar.blade.php:
--------------------------------------------------------------------------------
  1 | <div class="sidebar">
  2 |     <div class="sidebar-inner">
  3 |         <!-- ### $Sidebar Header ### -->
  4 |         <div class="sidebar-logo">
  5 |             <div class="peers ai-c fxw-nw">
  6 |                 <div class="peer peer-greed">
  7 |                     <a class="sidebar-link td-n" href="index.html">
  8 |                         <div class="peers ai-c fxw-nw">
  9 |                             <div class="peer">
 10 |                                 <div class="logo">
 11 |                                     <img src="/assets/static/images/logo.png" alt="">
 12 |                                 </div>
 13 |                             </div>
 14 |                             <div class="peer peer-greed">
 15 |                                 <h5 class="lh-1 mB-0 logo-text">Adminator</h5>
 16 |                             </div>
 17 |                         </div>
 18 |                     </a>
 19 |                 </div>
 20 |                 <div class="peer">
 21 |                     <div class="mobile-toggle sidebar-toggle">
 22 |                         <a href="" class="td-n">
 23 |                             <i class="ti-arrow-circle-left"></i>
 24 |                         </a>
 25 |                     </div>
 26 |                 </div>
 27 |             </div>
 28 |         </div>
 29 | 
 30 |         <!-- ### $Sidebar Menu ### -->
 31 |         <ul class="sidebar-menu scrollable pos-r">
 32 |             <li class="nav-item mT-30 active">
 33 |                 <a class="sidebar-link" href="/admin/dashboard">
 34 |                 <span class="icon-holder">
 35 |                   <i class="c-blue-500 ti-home"></i>
 36 |                 </span>
 37 |                     <span class="title">Dashboard</span>
 38 |                 </a>
 39 |             </li>
 40 |             <li class="nav-item">
 41 |                 <a class='sidebar-link' href="/admin/email">
 42 |                 <span class="icon-holder">
 43 |                   <i class="c-brown-500 ti-email"></i>
 44 |                 </span>
 45 |                     <span class="title">Email</span>
 46 |                 </a>
 47 |             </li>
 48 |             <li class="nav-item">
 49 |                 <a class='sidebar-link' href="/admin/compose">
 50 |                 <span class="icon-holder">
 51 |                   <i class="c-blue-500 ti-share"></i>
 52 |                 </span>
 53 |                     <span class="title">Compose</span>
 54 |                 </a>
 55 |             </li>
 56 |             <li class="nav-item">
 57 |                 <a class='sidebar-link' href="/admin/calendar">
 58 |                 <span class="icon-holder">
 59 |                   <i class="c-deep-orange-500 ti-calendar"></i>
 60 |                 </span>
 61 |                     <span class="title">Calendar</span>
 62 |                 </a>
 63 |             </li>
 64 |             <li class="nav-item">
 65 |                 <a class='sidebar-link' href="/admin/chat">
 66 |                 <span class="icon-holder">
 67 |                   <i class="c-deep-purple-500 ti-comment-alt"></i>
 68 |                 </span>
 69 |                     <span class="title">Chat</span>
 70 |                 </a>
 71 |             </li>
 72 |             <li class="nav-item">
 73 |                 <a class='sidebar-link' href="/admin/charts">
 74 |                 <span class="icon-holder">
 75 |                   <i class="c-indigo-500 ti-bar-chart"></i>
 76 |                 </span>
 77 |                     <span class="title">Charts</span>
 78 |                 </a>
 79 |             </li>
 80 |             <li class="nav-item">
 81 |                 <a class='sidebar-link' href="/admin/forms">
 82 |                 <span class="icon-holder">
 83 |                   <i class="c-light-blue-500 ti-pencil"></i>
 84 |                 </span>
 85 |                     <span class="title">Forms</span>
 86 |                 </a>
 87 |             </li>
 88 |             <li class="nav-item dropdown">
 89 |                 <a class="sidebar-link" href="/admin/ui">
 90 |                 <span class="icon-holder">
 91 |                     <i class="c-pink-500 ti-palette"></i>
 92 |                   </span>
 93 |                     <span class="title">UI Elements</span>
 94 |                 </a>
 95 |             </li>
 96 |             <li class="nav-item dropdown">
 97 |                 <a class="dropdown-toggle" href="javascript:void(0);">
 98 |                 <span class="icon-holder">
 99 |                   <i class="c-orange-500 ti-layout-list-thumb"></i>
100 |                 </span>
101 |                     <span class="title">Tables</span>
102 |                     <span class="arrow">
103 |                   <i class="ti-angle-right"></i>
104 |                 </span>
105 |                 </a>
106 |                 <ul class="dropdown-menu">
107 |                     <li>
108 |                         <a class='sidebar-link' href="/admin/basic-table">Basic Table</a>
109 |                     </li>
110 |                     <li>
111 |                         <a class='sidebar-link' href="/admin/datatable">Data Table</a>
112 |                     </li>
113 |                 </ul>
114 |             </li>
115 |             <li class="nav-item dropdown">
116 |                 <a class="dropdown-toggle" href="javascript:void(0);">
117 |                 <span class="icon-holder">
118 |                     <i class="c-purple-500 ti-map"></i>
119 |                   </span>
120 |                     <span class="title">Maps</span>
121 |                     <span class="arrow">
122 |                     <i class="ti-angle-right"></i>
123 |                   </span>
124 |                 </a>
125 |                 <ul class="dropdown-menu">
126 |                     <li>
127 |                         <a href="/admin/google-maps">Google Map</a>
128 |                     </li>
129 |                     <li>
130 |                         <a href="/admin/vector-maps">Vector Map</a>
131 |                     </li>
132 |                 </ul>
133 |             </li>
134 |             <li class="nav-item dropdown">
135 |                 <a class="dropdown-toggle" href="javascript:void(0);">
136 |                 <span class="icon-holder">
137 |                     <i class="c-red-500 ti-files"></i>
138 |                   </span>
139 |                     <span class="title">Pages</span>
140 |                     <span class="arrow">
141 |                     <i class="ti-angle-right"></i>
142 |                   </span>
143 |                 </a>
144 |                 <ul class="dropdown-menu">
145 |                     <li>
146 |                         <a class='sidebar-link' href="/admin/blank">Blank</a>
147 |                     </li>
148 |                     <li>
149 |                         <a class='sidebar-link' href="/admin/404">404</a>
150 |                     </li>
151 |                     <li>
152 |                         <a class='sidebar-link' href="/admin/500">500</a>
153 |                     </li>
154 |                     <li>
155 |                         <a class='sidebar-link' href="/admin/signin">Sign In</a>
156 |                     </li>
157 |                     <li>
158 |                         <a class='sidebar-link' href="/admin/signup">Sign Up</a>
159 |                     </li>
160 |                 </ul>
161 |             </li>
162 |             <li class="nav-item dropdown">
163 |                 <a class="dropdown-toggle" href="javascript:void(0);">
164 |                 <span class="icon-holder">
165 |                   <i class="c-teal-500 ti-view-list-alt"></i>
166 |                 </span>
167 |                     <span class="title">Multiple Levels</span>
168 |                     <span class="arrow">
169 |                   <i class="ti-angle-right"></i>
170 |                 </span>
171 |                 </a>
172 |                 <ul class="dropdown-menu">
173 |                     <li class="nav-item dropdown">
174 |                         <a href="javascript:void(0);">
175 |                             <span>Menu Item</span>
176 |                         </a>
177 |                     </li>
178 |                     <li class="nav-item dropdown">
179 |                         <a href="javascript:void(0);">
180 |                             <span>Menu Item</span>
181 |                             <span class="arrow">
182 |                       <i class="ti-angle-right"></i>
183 |                     </span>
184 |                         </a>
185 |                         <ul class="dropdown-menu">
186 |                             <li>
187 |                                 <a href="javascript:void(0);">Menu Item</a>
188 |                             </li>
189 |                             <li>
190 |                                 <a href="javascript:void(0);">Menu Item</a>
191 |                             </li>
192 |                         </ul>
193 |                     </li>
194 |                 </ul>
195 |             </li>
196 |         </ul>
197 |     </div>
198 | </div>


--------------------------------------------------------------------------------
/resources/views/admin/signin.blade.php:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html>
  3 | <head>
  4 |     <meta charset="utf-8">
  5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6 |     <title>Adminator - Sign In</title>
  7 |     <link rel="stylesheet" href="{{ mix('/css/admin.css') }}">
  8 |     <style>
  9 |         #loader {
 10 |             transition: all 0.3s ease-in-out;
 11 |             opacity: 1;
 12 |             visibility: visible;
 13 |             position: fixed;
 14 |             height: 100vh;
 15 |             width: 100%;
 16 |             background: #fff;
 17 |             z-index: 90000;
 18 |         }
 19 | 
 20 |         #loader.fadeOut {
 21 |             opacity: 0;
 22 |             visibility: hidden;
 23 |         }
 24 | 
 25 |         .spinner {
 26 |             width: 40px;
 27 |             height: 40px;
 28 |             position: absolute;
 29 |             top: calc(50% - 20px);
 30 |             left: calc(50% - 20px);
 31 |             background-color: #333;
 32 |             border-radius: 100%;
 33 |             -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
 34 |             animation: sk-scaleout 1.0s infinite ease-in-out;
 35 |         }
 36 | 
 37 |         @-webkit-keyframes sk-scaleout {
 38 |             0% {
 39 |                 -webkit-transform: scale(0)
 40 |             }
 41 |             100% {
 42 |                 -webkit-transform: scale(1.0);
 43 |                 opacity: 0;
 44 |             }
 45 |         }
 46 | 
 47 |         @keyframes sk-scaleout {
 48 |             0% {
 49 |                 -webkit-transform: scale(0);
 50 |                 transform: scale(0);
 51 |             }
 52 |             100% {
 53 |                 -webkit-transform: scale(1.0);
 54 |                 transform: scale(1.0);
 55 |                 opacity: 0;
 56 |             }
 57 |         }
 58 |     </style>
 59 | </head>
 60 | <body class="app">
 61 | <div id='loader'>
 62 |     <div class="spinner"></div>
 63 | </div>
 64 | 
 65 | <script>
 66 |     window.addEventListener('load', () => {
 67 |         const loader = document.getElementById('loader');
 68 |         setTimeout(() => {
 69 |             loader.classList.add('fadeOut');
 70 |         }, 300);
 71 |     });
 72 | </script>
 73 | <div class="peers ai-s fxw-nw h-100vh">
 74 |     <div class="d-n@sm- peer peer-greed h-100 pos-r bgr-n bgpX-c bgpY-c bgsz-cv"
 75 |          style='background-image: url("/assets/static/images/bg.jpg")'>
 76 |         <div class="pos-a centerXY">
 77 |             <div class="bgc-white bdrs-50p pos-r" style='width: 120px; height: 120px;'>
 78 |                 <img class="pos-a centerXY" src="/assets/static/images/logo.png" alt="">
 79 |             </div>
 80 |         </div>
 81 |     </div>
 82 |     <div class="col-12 col-md-4 peer pX-40 pY-80 h-100 bgc-white scrollable pos-r" style='min-width: 320px;'>
 83 |         <h4 class="fw-300 c-grey-900 mB-40">Login</h4>
 84 |         <form>
 85 |             <div class="form-group">
 86 |                 <label class="text-normal text-dark">Username</label>
 87 |                 <input type="email" class="form-control" placeholder="John Doe">
 88 |             </div>
 89 |             <div class="form-group">
 90 |                 <label class="text-normal text-dark">Password</label>
 91 |                 <input type="password" class="form-control" placeholder="Password">
 92 |             </div>
 93 |             <div class="form-group">
 94 |                 <div class="peers ai-c jc-sb fxw-nw">
 95 |                     <div class="peer">
 96 |                         <div class="checkbox checkbox-circle checkbox-info peers ai-c">
 97 |                             <input type="checkbox" id="inputCall1" name="inputCheckboxesCall" class="peer">
 98 |                             <label for="inputCall1" class=" peers peer-greed js-sb ai-c">
 99 |                                 <span class="peer peer-greed">Remember Me</span>
100 |                             </label>
101 |                         </div>
102 |                     </div>
103 |                     <div class="peer">
104 |                         <button class="btn btn-primary">Login</button>
105 |                     </div>
106 |                 </div>
107 |             </div>
108 |         </form>
109 |     </div>
110 | </div>
111 | </body>
112 | </html>
113 | 


--------------------------------------------------------------------------------
/resources/views/admin/signup.blade.php:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html>
  3 | <head>
  4 |     <meta charset="utf-8">
  5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6 |     <title>Adminator - Sign Up</title>
  7 |     <link rel="stylesheet" href="{{ mix('/css/admin.css') }}">
  8 |     <style>
  9 |         #loader {
 10 |             transition: all 0.3s ease-in-out;
 11 |             opacity: 1;
 12 |             visibility: visible;
 13 |             position: fixed;
 14 |             height: 100vh;
 15 |             width: 100%;
 16 |             background: #fff;
 17 |             z-index: 90000;
 18 |         }
 19 | 
 20 |         #loader.fadeOut {
 21 |             opacity: 0;
 22 |             visibility: hidden;
 23 |         }
 24 | 
 25 |         .spinner {
 26 |             width: 40px;
 27 |             height: 40px;
 28 |             position: absolute;
 29 |             top: calc(50% - 20px);
 30 |             left: calc(50% - 20px);
 31 |             background-color: #333;
 32 |             border-radius: 100%;
 33 |             -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
 34 |             animation: sk-scaleout 1.0s infinite ease-in-out;
 35 |         }
 36 | 
 37 |         @-webkit-keyframes sk-scaleout {
 38 |             0% {
 39 |                 -webkit-transform: scale(0)
 40 |             }
 41 |             100% {
 42 |                 -webkit-transform: scale(1.0);
 43 |                 opacity: 0;
 44 |             }
 45 |         }
 46 | 
 47 |         @keyframes sk-scaleout {
 48 |             0% {
 49 |                 -webkit-transform: scale(0);
 50 |                 transform: scale(0);
 51 |             }
 52 |             100% {
 53 |                 -webkit-transform: scale(1.0);
 54 |                 transform: scale(1.0);
 55 |                 opacity: 0;
 56 |             }
 57 |         }
 58 |     </style>
 59 | </head>
 60 | <body class="app">
 61 | <div id='loader'>
 62 |     <div class="spinner"></div>
 63 | </div>
 64 | 
 65 | <script>
 66 |     window.addEventListener('load', () => {
 67 |         const loader = document.getElementById('loader');
 68 |         setTimeout(() => {
 69 |             loader.classList.add('fadeOut');
 70 |         }, 300);
 71 |     });
 72 | </script>
 73 | <div class="peers ai-s fxw-nw h-100vh">
 74 |     <div class="peer peer-greed h-100 pos-r bgr-n bgpX-c bgpY-c bgsz-cv"
 75 |          style='background-image: url("/assets/static/images/bg.jpg")'>
 76 |         <div class="pos-a centerXY">
 77 |             <div class="bgc-white bdrs-50p pos-r" style='width: 120px; height: 120px;'>
 78 |                 <img class="pos-a centerXY" src="/assets/static/images/logo.png" alt="">
 79 |             </div>
 80 |         </div>
 81 |     </div>
 82 |     <div class="col-12 col-md-4 peer pX-40 pY-80 h-100 bgc-white scrollable pos-r" style='min-width: 320px;'>
 83 |         <h4 class="fw-300 c-grey-900 mB-40">Register</h4>
 84 |         <form>
 85 |             <div class="form-group">
 86 |                 <label class="text-normal text-dark">Username</label>
 87 |                 <input type="text" class="form-control" Placeholder='John Doe'>
 88 |             </div>
 89 |             <div class="form-group">
 90 |                 <label class="text-normal text-dark">Email Address</label>
 91 |                 <input type="email" class="form-control" Placeholder='name@email.com'>
 92 |             </div>
 93 |             <div class="form-group">
 94 |                 <label class="text-normal text-dark">Password</label>
 95 |                 <input type="password" class="form-control" placeholder="Password">
 96 |             </div>
 97 |             <div class="form-group">
 98 |                 <label class="text-normal text-dark">Confirm Password</label>
 99 |                 <input type="password" class="form-control" placeholder="Password">
100 |             </div>
101 |             <div class="form-group">
102 |                 <button class="btn btn-primary">Register</button>
103 |             </div>
104 |         </form>
105 |     </div>
106 | </div>
107 | 
108 | </body>
109 | </html>
110 | 


--------------------------------------------------------------------------------
/resources/views/admin/vector-maps.blade.php:
--------------------------------------------------------------------------------
 1 | @extends('admin.layout.layout')
 2 | 
 3 | @section('title', 'Vector Maps')
 4 | @section('mainContent')
 5 |     <div class="container-fluid">
 6 |         <h4 class="c-grey-900 mT-10 mB-30">Vector Maps</h4>
 7 |         <div class="row">
 8 |             <div class="col-md-12">
 9 |                 <div class="bgc-white bd bdrs-3 p-20 mB-20">
10 |                     <h6 class="c-grey-900 mB-20">Jquery Vector Maps</h6>
11 |                     <div id="world-map-marker"></div>
12 |                 </div>
13 |             </div>
14 |         </div>
15 |     </div>
16 | @endsection
17 | 


--------------------------------------------------------------------------------
/routes/admin.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /*
 4 | |--------------------------------------------------------------------------
 5 | | Web Routes
 6 | |--------------------------------------------------------------------------
 7 | |
 8 | | Here is where you can register web routes for your application. These
 9 | | routes are loaded by the RouteServiceProvider within a group which
10 | | contains the "web" middleware group. Now create something great!
11 | |
12 | */
13 | 
14 | Route::get('/login', function () { return view('admin.signin'); });
15 | Route::get('/register', function () { return view('admin.signup'); });
16 | 
17 | Route::get('/dashboard', function () { return view('admin.dashboard'); });
18 | Route::get('/basic-table', function () { return view('admin.basic-table'); });
19 | Route::get('/blank', function () { return view('admin.blank'); });
20 | Route::get('/buttons', function () { return view('admin.buttons'); });
21 | Route::get('/calendar', function () { return view('admin.calendar'); });
22 | Route::get('/charts', function () { return view('admin.charts'); });
23 | Route::get('/chat', function () { return view('admin.chat'); });
24 | Route::get('/compose', function () { return view('admin.compose'); });
25 | Route::get('/datatable', function () { return view('admin.datatable'); });
26 | Route::get('/email', function () { return view('admin.email'); });
27 | Route::get('/forms', function () { return view('admin.forms'); });
28 | Route::get('/google-maps', function () { return view('admin.google-maps'); });
29 | Route::get('/ui', function () { return view('admin.ui'); });
30 | Route::get('/vector-maps', function () { return view('admin.vector-maps'); });
31 | 
32 | Route::get('/404', function () { return view('admin.404'); });
33 | Route::get('/500', function () { return view('admin.500'); });
34 | 


--------------------------------------------------------------------------------
/webpack.mix.js:
--------------------------------------------------------------------------------
 1 | let mix = require('laravel-mix');
 2 | 
 3 | /*
 4 |  |--------------------------------------------------------------------------
 5 |  | Mix Asset Management
 6 |  |--------------------------------------------------------------------------
 7 |  |
 8 |  | Mix provides a clean, fluent API for defining some Webpack build steps
 9 |  | for your Laravel application. By default, we are compiling the Sass
10 |  | file for the application as well as bundling up all the JS files.
11 |  |
12 |  */
13 | 
14 | mix.js('resources/assets/js/app.js', 'public/js')
15 |     .js('resources/assets/js/admin.js', 'public/js')
16 |     .sass('resources/assets/sass/app.scss', 'public/css')
17 |     .sass('resources/assets/sass/admin.scss', 'public/css')
18 |     .sourceMaps();
19 | 


--------------------------------------------------------------------------------