diff --git a/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php b/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
index 070694ca2..98e8568f5 100644
--- a/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
@@ -65,35 +65,35 @@ class CustomerDataGrid
                     'name' => 'id',
                     'alias' => 'ID',
                     'type' => 'number',
-                    'label' => 'Customer ID',
+                    'label' => 'ID',
                     'sortable' => true,
                 ],
                 [
                     'name' => 'first_name',
                     'alias' => 'FirstName',
                     'type' => 'string',
-                    'label' => 'Customer First Name',
+                    'label' => 'First Name',
                     'sortable' => false,
                 ],
                 [
                     'name' => 'email',
                     'alias' => 'Email',
                     'type' => 'string',
-                    'label' => 'Customer E-Mail',
+                    'label' => 'E-Mail',
                     'sortable' => false,
                 ],
                 [
                     'name' => 'phone',
                     'alias' => 'Phone',
                     'type' => 'number',
-                    'label' => 'Customer Phone',
+                    'label' => 'Phone',
                     'sortable' => true,
                 ],
                 [
                     'name' => 'customer_group_id',
                     'alias' => 'CustomerGroupId',
                     'type' => 'number',
-                    'label' => 'Customer Group',
+                    'label' => 'Group ID',
                     'sortable' => false,
                 ],
             ],
@@ -106,13 +106,13 @@ class CustomerDataGrid
                     'column' => 'id',
                     'alias' => 'ID',
                     'type' => 'number',
-                    'label' => 'Customer ID',
+                    'label' => 'ID',
                 ],
                 [
                     'column' => 'first_name',
                     'alias' => 'FirstName',
                     'type' => 'string',
-                    'label' => 'Customer First Name',
+                    'label' => 'First Name',
                 ]
             ],
 
@@ -122,12 +122,12 @@ class CustomerDataGrid
                 [
                     'column' => 'FirstName',
                     'type' => 'string',
-                    'label' => 'Customer First Name',
+                    'label' => 'First Name',
                 ],
                 [
                     'column' => 'email',
                     'type' => 'string',
-                    'label' => 'Customer E-Mail',
+                    'label' => 'E-Mail',
                 ],
             ],
 
diff --git a/packages/Webkul/Admin/src/DataGrids/CustomerGroupDataGrid.php b/packages/Webkul/Admin/src/DataGrids/CustomerGroupDataGrid.php
new file mode 100644
index 000000000..c2254f226
--- /dev/null
+++ b/packages/Webkul/Admin/src/DataGrids/CustomerGroupDataGrid.php
@@ -0,0 +1,163 @@
+<?php
+
+namespace Webkul\Admin\DataGrids;
+
+use Illuminate\View\View;
+use Webkul\Ui\DataGrid\Facades\DataGrid;
+
+/**
+ * Customer Group DataGrid
+ *
+ * @author    Rahul Shukla <rahulshukla.symfony517@webkul.com>
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+
+class CustomerGroupDataGrid
+{
+    /**
+     * The Customer Group Data
+     * Grid implementation.
+     *
+     * @var CustomerGroupDataGrid
+     */
+    public function createCustomerGroupDataGrid()
+    {
+
+        return DataGrid::make([
+
+            'name' => 'Customer Group',
+            'table' => 'customer_groups as cg',
+            'select' => 'cg.id',
+            'perpage' => 10,
+            'aliased' => true, //use this with false as default and true in case of joins
+
+            'massoperations' =>[
+                [
+                    'route' => route('admin.datagrid.delete'),
+                    'method' => 'DELETE',
+                    'label' => 'Delete',
+                    'type' => 'button',
+                ],
+                [
+                    'route' => route('admin.datagrid.index'),
+                    'method' => 'POST',
+                    'label' => 'View Grid',
+                    'type' => 'select',
+                    'options' =>[
+                        1 => 'Edit',
+                        2 => 'Set',
+                        3 => 'Change Status'
+                    ]
+                ],
+            ],
+            'actions' => [
+                [
+                    'type' => 'Edit',
+                    'route' => route('admin.datagrid.delete'),
+                    'confirm_text' => 'Do you really wanis?',
+                    'icon' => 'icon pencil-lg-icon',
+                ],
+                [
+                    'type' => 'Delete',
+                    'route' => route('admin.datagrid.delete'),
+                    'confirm_text' => 'Do you really want to do this?',
+                    'icon' => 'icon trash-icon',
+                ],
+            ],
+            'join' => [
+                // [
+                //     'join' => 'leftjoin',
+                //     'table' => 'roles as r',
+                //     'primaryKey' => 'u.role_id',
+                //     'condition' => '=',
+                //     'secondaryKey' => 'r.id',
+                // ]
+            ],
+
+            //use aliasing on secodary columns if join is performed
+            'columns' => [
+                [
+                    'name' => 'cg.id',
+                    'alias' => 'ID',
+                    'type' => 'number',
+                    'label' => 'ID',
+                    'sortable' => true,
+                ],
+                [
+                    'name' => 'cg.group_name',
+                    'alias' => 'Name',
+                    'type' => 'string',
+                    'label' => 'Name',
+                    'sortable' => true,
+                ],
+                [
+                    'name' => 'cg.is_user_defined',
+                    'alias' => 'User Defined',
+                    'type' => 'boolean',
+                    'label' => 'User Defined',
+                    'sortable' => true,
+                    'wrapper' => function ($value) {
+                        if($value == 1)
+                            return "False";
+                        else
+                            return "True";
+                    },
+                ],
+            ],
+            //don't use aliasing in case of filters
+            'filterable' => [
+                [
+                    'column' => 'cg.group_name',
+                    'alias' => 'Name',
+                    'type' => 'string',
+                    'label' => 'Name'
+                ],
+                [
+                    'column' => 'cg.id',
+                    'alias' => 'ID',
+                    'type' => 'number',
+                    'label' => 'ID'
+                ],
+                [
+                    'column' => 'cg.is_user_defined',
+                    'alias' => 'User Defined',
+                    'type' => 'boolean',
+                    'label' => 'User Defined'
+                ]
+            ],
+            //don't use aliasing in case of searchables
+            'searchable' => [
+                [
+                    'column' => 'cg.code',
+                    'type' => 'string',
+                    'label' => 'Code'
+                ],
+                [
+                    'column' => 'cg.name',
+                    'type' => 'string',
+                    'label' => 'Name'
+                ]
+            ],
+            'operators' => [
+                'eq' => "=",
+                'lt' => "<",
+                'gt' => ">",
+                'lte' => "<=",
+                'gte' => ">=",
+                'neqs' => "<>",
+                'neqn' => "!=",
+                'like' => "like",
+                'nlike' => "not like",
+            ],
+            // 'css' => []
+
+        ]);
+
+    }
+
+    public function render() {
+
+        return $this->createCustomerGroupDataGrid()->render();
+
+    }
+}
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Http/Controllers/Customer/CustomerController.php b/packages/Webkul/Admin/src/Http/Controllers/Customer/CustomerController.php
index 01aeac0ae..cdcc99b1b 100644
--- a/packages/Webkul/Admin/src/Http/Controllers/Customer/CustomerController.php
+++ b/packages/Webkul/Admin/src/Http/Controllers/Customer/CustomerController.php
@@ -4,13 +4,13 @@ namespace Webkul\Admin\Http\Controllers\Customer;
 
 use Illuminate\Http\Request;
 use Illuminate\Http\Response;
-use Illuminate\Routing\Controller;
+use Webkul\Admin\Http\Controllers\Controller;
 use Webkul\Customer\Repositories\CustomerRepository as Customer;
 use Webkul\Customer\Repositories\CustomerGroupRepository as CustomerGroup;
+use Webkul\Core\Repositories\ChannelRepository as Channel;
 
 /**
- * Customer controlller for the customer
- * to show customer data on admin login
+ * Customer controlller
  *
  * @author    Rahul Shukla <rahulshukla.symfony517@webkul.com>
  * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
@@ -38,20 +38,30 @@ class CustomerController extends Controller
      */
     protected $customerGroup;
 
+     /**
+     * ChannelRepository object
+     *
+     * @var array
+     */
+    protected $channel;
+
      /**
      * Create a new controller instance.
      *
      * @param Webkul\Customer\Repositories\CustomerRepository as customer;
      * @param Webkul\Customer\Repositories\CustomerGroupRepository as customerGroup;
+     * @param Webkul\Core\Repositories\ChannelRepository as Channel;
      * @return void
      */
-    public function __construct(Customer $customer , CustomerGroup $customerGroup )
+    public function __construct(Customer $customer, CustomerGroup $customerGroup, Channel $channel )
     {
         $this->_config = request('_config');
 
         $this->customer = $customer;
 
         $this->customerGroup = $customerGroup;
+
+        $this->channel = $channel;
     }
 
     /**
@@ -73,7 +83,9 @@ class CustomerController extends Controller
     {
         $customerGroup = $this->customerGroup->all();
 
-        return view($this->_config['view'], compact('customerGroup'));
+        $channelName = $this->channel->all();
+
+        return view($this->_config['view'],compact('customerGroup','channelName'));
     }
 
      /**
@@ -81,17 +93,18 @@ class CustomerController extends Controller
      *
      * @return \Illuminate\Http\Response
      */
-    public function store(Request $request)
+    public function store()
     {
-        $request->validate([
+        $this->validate(request(), [
+            'channel_id' => 'required',
             'first_name' => 'string|required',
             'last_name' => 'string|required',
             'gender' => 'required',
-            'phone' => 'nullable|numeric',
+            'phone' => 'nullable|numeric|unique:customers,phone',
             'email' => 'required|unique:customers,email'
         ]);
 
-        $data=$request->all();
+        $data=request()->all();
 
         $password = bcrypt(rand(100000,10000000));
 
@@ -116,7 +129,9 @@ class CustomerController extends Controller
 
         $customerGroup = $this->customerGroup->all();
 
-        return view($this->_config['view'],compact('customer','customerGroup'));
+        $channelName = $this->channel->all();
+
+        return view($this->_config['view'],compact('customer', 'customerGroup', 'channelName'));
     }
 
      /**
@@ -128,11 +143,12 @@ class CustomerController extends Controller
      */
     public function update(Request $request, $id)
     {
-        $request->validate([
+        $this->validate(request(), [
+            'channel_id' => 'required',
             'first_name' => 'string|required',
             'last_name' => 'string|required',
             'gender' => 'required',
-            'phone' => 'nullable|numeric',
+            'phone' => 'nullable|numeric|unique:customers,phone,'. $id,
             'email' => 'required|unique:customers,email,'. $id
         ]);
 
diff --git a/packages/Webkul/Admin/src/Http/Controllers/Customer/CustomerGroupController.php b/packages/Webkul/Admin/src/Http/Controllers/Customer/CustomerGroupController.php
new file mode 100644
index 000000000..3d3759235
--- /dev/null
+++ b/packages/Webkul/Admin/src/Http/Controllers/Customer/CustomerGroupController.php
@@ -0,0 +1,136 @@
+<?php
+
+namespace Webkul\Admin\Http\Controllers\Customer;
+
+use Illuminate\Http\Request;
+use Illuminate\Http\Response;
+use Webkul\Admin\Http\Controllers\Controller;
+use Webkul\Customer\Repositories\CustomerGroupRepository as CustomerGroup;
+
+/**
+ * CustomerGroup controlller
+ *
+ * @author    Rahul Shukla <rahulshukla.symfony517@webkul.com>
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+class CustomerGroupController extends Controller
+{
+    /**
+     * Contains route related configuration
+     *
+     * @var array
+    */
+    protected $_config;
+
+    /**
+     * CustomerGroupRepository object
+     *
+     * @var array
+    */
+    protected $customerGroup;
+
+     /**
+     * Create a new controller instance.
+     *
+     * @param Webkul\Customer\Repositories\CustomerGroupRepository as customerGroup;
+     * @return void
+     */
+    public function __construct(CustomerGroup $customerGroup)
+    {
+        $this->_config = request('_config');
+
+        $this->customerGroup = $customerGroup;
+    }
+
+    /**
+     * Display a listing of the resource.
+     *
+     * @return \Illuminate\Http\Response
+    */
+    public function index()
+    {
+        return view($this->_config['view']);
+    }
+
+    /**
+     * Show the form for creating a new resource.
+     *
+     * @return \Illuminate\Http\Response
+     */
+    public function create()
+    {
+        return view($this->_config['view']);
+    }
+
+     /**
+     * Store a newly created resource in storage.
+     *
+     * @return \Illuminate\Http\Response
+     */
+    public function store()
+    {
+        $this->validate(request(), [
+            'group_name' => 'string|required',
+        ]);
+
+        $this->customerGroup->create(request()->all());
+
+        session()->flash('success', 'Customer Group created successfully.');
+
+        return redirect()->route($this->_config['redirect']);
+    }
+
+     /**
+     * Show the form for editing the specified resource.
+     *
+     * @param  int  $id
+     * @return \Illuminate\Http\Response
+     */
+    public function edit($id)
+    {
+        $group = $this->customerGroup->findOneWhere(['id'=>$id]);
+
+        return view($this->_config['view'],compact('group'));
+    }
+
+     /**
+     * Update the specified resource in storage.
+     *
+     * @param  \Illuminate\Http\Request $request
+     * @param  int  $id
+     * @return \Illuminate\Http\Response
+     */
+    public function update(Request $request, $id)
+    {
+        $this->validate(request(), [
+            'group_name' => 'string|required',
+        ]);
+
+        $this->customerGroup->update(request()->all(),$id);
+
+        session()->flash('success', 'Customer Group updated successfully.');
+
+        return redirect()->route($this->_config['redirect']);
+    }
+
+    /**
+     * Remove the specified resource from storage.
+     *
+     * @param  int  $id
+     * @return \Illuminate\Http\Response
+     */
+    public function destroy($id)
+    {
+        $group = $this->customerGroup->findOneWhere(['id'=>$id]);
+
+        if($group->is_user_defined == 1) {
+            session()->flash('error', 'This Customer Group can not be deleted');
+        } else {
+            $this->customerGroup->delete($id);
+
+            session()->flash('success', 'Customer Group deleted successfully.');
+        }
+
+        return redirect()->back();
+    }
+}
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Http/routes.php b/packages/Webkul/Admin/src/Http/routes.php
index 7ecb930af..15ca6dacc 100644
--- a/packages/Webkul/Admin/src/Http/routes.php
+++ b/packages/Webkul/Admin/src/Http/routes.php
@@ -64,13 +64,13 @@ Route::group(['middleware' => ['web']], function () {
                 'redirect' => 'admin.customer.index'
             ])->name('admin.customer.update');
 
-            Route::get('customers/delete/{id}', 'Webkul\Admin\Http\Controllers\CustomerController@destroy')->name('admin.customer.delete');
-
+            Route::get('customers/delete/{id}', 'Webkul\Admin\Http\Controllers\Customer\CustomerController@destroy')->name('admin.customer.delete');
 
             Route::get('reviews', 'Webkul\Product\Http\Controllers\ReviewController@index')->defaults('_config',[
                 'view' => 'admin::customers.review.index'
             ])->name('admin.customer.review.index');
 
+            // Reviews Routes
             Route::get('reviews/edit/{id}', 'Webkul\Product\Http\Controllers\ReviewController@edit')->defaults('_config',[
                 'view' => 'admin::customers.review.edit'
             ])->name('admin.customer.review.edit');
@@ -79,6 +79,29 @@ Route::group(['middleware' => ['web']], function () {
                 'redirect' => 'admin.customer.review.index'
             ])->name('admin.customer.review.update');
 
+            // Customer Groups Routes
+
+            Route::get('groups', 'Webkul\Admin\Http\Controllers\Customer\CustomerGroupController@index')->defaults('_config',[
+                'view' => 'admin::customers.group.index'
+            ])->name('admin.groups.index');
+
+            Route::get('groups/create', 'Webkul\Admin\Http\Controllers\Customer\CustomerGroupController@create')->defaults('_config',[
+                'view' => 'admin::customers.group.create'
+            ])->name('admin.groups.create');
+
+            Route::post('groups/create', 'Webkul\Admin\Http\Controllers\Customer\CustomerGroupController@store')->defaults('_config',[
+                'redirect' => 'admin.groups.index'
+            ])->name('admin.groups.store');
+
+            Route::get('groups/edit/{id}', 'Webkul\Admin\Http\Controllers\Customer\CustomerGroupController@edit')->defaults('_config',[
+                'view' => 'admin::customers.group.edit'
+            ])->name('admin.groups.edit');
+
+            Route::put('groups/edit/{id}', 'Webkul\Admin\Http\Controllers\Customer\CustomerGroupController@update')->defaults('_config',[
+                'redirect' => 'admin.groups.index'
+            ])->name('admin.groups.update');
+
+            Route::get('groups/delete/{id}', 'Webkul\Admin\Http\Controllers\Customer\CustomerGroupController@destroy')->name('admin.groups.delete');
 
             // Sales Routes
             Route::prefix('sales')->group(function () {
@@ -264,6 +287,8 @@ Route::group(['middleware' => ['web']], function () {
                 'redirect' => 'admin.users.index'
             ])->name('admin.users.update');
 
+            Route::get('/users/delete/{id}', 'Webkul\User\Http\Controllers\UserController@destroy')->name('admin.users.delete');
+
 
             // User Role Routes
             Route::get('/roles', 'Webkul\User\Http\Controllers\RoleController@index')->defaults('_config', [
@@ -462,6 +487,9 @@ Route::group(['middleware' => ['web']], function () {
             Route::put('/tax-categories/edit/{id}', 'Webkul\Tax\Http\Controllers\TaxCategoryController@update')->defaults('_config', [
                 'redirect' => 'admin.tax-categories.index'
             ])->name('admin.tax-categories.update');
+
+            Route::get('/tax-categories/delete/{id}', 'Webkul\Tax\Http\Controllers\TaxCategoryController@destroy')->name('admin.tax-categories.delete');
+
             //tax category ends
 
             //tax rate
@@ -484,6 +512,8 @@ Route::group(['middleware' => ['web']], function () {
             Route::put('tax-rates/update/{id}', 'Webkul\Tax\Http\Controllers\TaxRateController@update')->defaults('_config', [
                 'redirect' => 'admin.tax-rates.index'
             ])->name('admin.tax-rates.update');
+
+            Route::get('/tax-rates/delete/{id}', 'Webkul\Tax\Http\Controllers\TaxRateController@destroy')->name('admin.tax-rates.delete');
             //tax rate ends
         });
     });
diff --git a/packages/Webkul/Admin/src/Providers/EventServiceProvider.php b/packages/Webkul/Admin/src/Providers/EventServiceProvider.php
index 6eb34a845..a9608eded 100644
--- a/packages/Webkul/Admin/src/Providers/EventServiceProvider.php
+++ b/packages/Webkul/Admin/src/Providers/EventServiceProvider.php
@@ -91,6 +91,12 @@ class EventServiceProvider extends ServiceProvider
             'route' => 'admin.customer.review.index',
             'sort' => 2,
             'icon-class' => '',
+        ], [
+            'key' => 'customers.groups',
+            'name' => 'Groups',
+            'route' => 'admin.groups.index',
+            'sort' => 3,
+            'icon-class' => '',
         ], [
             'key' => 'configuration',
             'name' => 'Configure',
diff --git a/packages/Webkul/Admin/src/Resources/lang/en/app.php b/packages/Webkul/Admin/src/Resources/lang/en/app.php
index 41b26ad75..6a66e69ad 100644
--- a/packages/Webkul/Admin/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Admin/src/Resources/lang/en/app.php
@@ -285,6 +285,7 @@ return [
             'meta_title' => 'Meta Title',
             'meta_description' => 'Meta Description',
             'meta_keywords' => 'Meta Keywords',
+            'image' => 'Image',
         ]
     ],
 
@@ -425,7 +426,19 @@ return [
         ],
     ],
     'customers' => [
+        'groups' =>[
+            'add-title' => 'Add Group',
+            'edit-title' => 'Edit Group',
+            'save-btn-title' => 'Save Group',
+            'title' => 'Groups',
+            'save-btn-title' => 'Save Group',
+            'name' => 'Name',
+            'is_user_defined' => 'User Defined',
+            'yes' => 'Yes'
+        ],
         'customers' => [
+            'add-title' => 'Add Customer',
+            'edit-title' => 'Edit Customer',
             'title' => 'Customers',
             'first_name' => 'First Name',
             'last_name' => 'Last Name',
@@ -434,7 +447,8 @@ return [
             'date_of_birth' => 'Date of Birth',
             'phone' => 'Phone',
             'customer_group' => 'Customer Group',
-            'save-btn-title' => 'Save Customer'
+            'save-btn-title' => 'Save Customer',
+            'channel_name' => 'Channel Name'
         ],
         'reviews' => [
             'title' => 'Reviews',
@@ -485,5 +499,27 @@ return [
             'final-summary' => 'If you did not request a password reset, no further action is required.',
             'thanks' => 'Thanks!'
         ]
+    ],
+    'error' => [
+        'go-to-home' => 'GO TO HOME',
+
+        '404' => [
+            'page-title' => 'Page not found',
+            'name' => '404',
+            'title' => 'Page Not found',
+            'message' => 'The Page you are looking for doesnt exist or have secrately    escaped;head back to home and make a fresh move again.'
+        ],
+        '403' => [
+            'page-title' => '403 forbidden',
+            'name' => '403',
+            'title' => 'Forbidden error',
+            'message' => 'You do not have permission to access this page'
+        ],
+        '500' => [
+            'page-title' => '500 Internal Server Error',
+            'name' => '500',
+            'title' => 'Internal Server Error',
+            'message' => 'You do not have permission to access this page'
+        ]
     ]
 ];
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/categories/create.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/categories/create.blade.php
index 4fcf60eb0..420f5052b 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/categories/create.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/categories/create.blade.php
@@ -66,6 +66,12 @@
                                 <span class="control-error" v-if="errors.has('description')">@{{ errors.first('description') }}</span>
                             </div>
 
+                            <div class="control-group">
+                                <label>{{ __('admin::app.catalog.categories.image') }}
+
+                                <image-wrapper :button-label="'{{ __('admin::app.catalog.products.add-image-btn-title') }}'" input-name="image" :multiple="false"></image-wrapper>
+                            </div>
+
                         </div>
                     </accordian>
 
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/categories/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/categories/edit.blade.php
index 2055b3ad0..ef47c455f 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/categories/edit.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/categories/edit.blade.php
@@ -8,7 +8,7 @@
     <div class="content">
         <?php $locale = request()->get('locale') ?: app()->getLocale(); ?>
 
-        <form method="POST" action="" @submit.prevent="onSubmit">
+        <form method="POST" action="" @submit.prevent="onSubmit" enctype="multipart/form-data">
 
             <div class="page-header">
                 <div class="page-title">
@@ -79,6 +79,13 @@
                                 <span class="control-error" v-if="errors.has('{{$locale}}[description]')">@{{ errors.first('{!!$locale!!}[description]') }}</span>
                             </div>
 
+                            <div class="control-group">
+                                <label>{{ __('admin::app.catalog.categories.image') }}
+
+                                <image-wrapper :button-label="'{{ __('admin::app.catalog.products.add-image-btn-title') }}'" input-name="image" :multiple="false"></image-wrapper>
+
+                            </div>
+
                         </div>
                     </accordian>
 
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/products/create.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/products/create.blade.php
index cd14cc08a..5e6966c2d 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/products/create.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/products/create.blade.php
@@ -77,7 +77,7 @@
                             <input type="text" v-validate="'required'" class="control" id="sku" name="sku" value="{{ $sku ?: old('sku') }}"/>
                             <span class="control-error" v-if="errors.has('sku')">@{{ errors.first('sku') }}</span>
                         </div>
-                    
+
                     </div>
                 </accordian>
 
@@ -94,7 +94,7 @@
                                             <th></th>
                                         </tr>
                                     </thead>
-                                        
+
                                     <tbody>
                                         @foreach($configurableFamily->configurable_attributes as $attribute)
                                             <tr>
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/create.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/create.blade.php
index 97bbd7b33..d4bcddbf1 100644
--- a/packages/Webkul/Admin/src/Resources/views/customers/create.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/customers/create.blade.php
@@ -1,8 +1,12 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.customers.customers.add-title') }}
+@stop
+
 @section('content')
     <div class="content">
-        <form method="POST" action="{{ route('admin.customer.store') }}">
+        <form method="POST" action="{{ route('admin.customer.store') }}" @submit.prevent="onSubmit">
 
             <div class="page-header">
                 <div class="page-title">
@@ -45,7 +49,7 @@
 
                     <div class="control-group" :class="[errors.has('gender') ? 'has-error' : '']">
                         <label for="gender" class="required">{{ __('admin::app.customers.customers.gender') }}</label>
-                        <select name="gender" class="control" v-validate="'gender'">
+                        <select name="gender" class="control" v-validate="'required'">
                             <option value="Male">Male</option>
                             <option value="Female">Female</option>
                         </select>
@@ -64,7 +68,7 @@
                     </div>
 
                     <div class="control-group">
-                        <label for="name" >{{ __('admin::app.customers.customers.customer_group') }}</label>
+                        <label for="customerGroup" >{{ __('admin::app.customers.customers.customer_group') }}</label>
                         <select  class="control" name="customer_group_id">
                         @foreach ($customerGroup as $group)
                             <option value="{{ $group->id }}"> {{ $group->group_name}} </>
@@ -72,6 +76,16 @@
                         </select>
                     </div>
 
+                    <div class="control-group" :class="[errors.has('channel_id') ? 'has-error' : '']">
+                        <label for="channel" >{{ __('admin::app.customers.customers.channel_name') }}</label>
+                        <select  class="control" name="channel_id" v-validate="'required'">
+                        @foreach ($channelName as $channel)
+                            <option value="{{ $channel->id }}"> {{ $channel->name}} </>
+                        @endforeach
+                        </select>
+                        <span class="control-error" v-if="errors.has('channel_id')">@{{ errors.first('channel_id') }}</span>
+                    </div>
+
                 </div>
             </div>
         </form>
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/edit.blade.php
index 639ac370d..e9aa664b2 100644
--- a/packages/Webkul/Admin/src/Resources/views/customers/edit.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/customers/edit.blade.php
@@ -1,5 +1,9 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.customers.customers.edit-title') }}
+@stop
+
 @section('content')
     <div class="content">
         <form method="POST" action="{{ route('admin.customer.update', $customer->id) }}">
@@ -47,7 +51,7 @@
                             </div>
 
                             <div class="control-group">
-                                <label for="email" class="required">{{ __('admin::app.customers.customers.gender') }}</label>
+                                <label for="gender" class="required">{{ __('admin::app.customers.customers.gender') }}</label>
                                 <select name="gender" class="control" v-validate="'gender'" value="{{ $customer->gender }}" v-validate="'required'">
                                         <option value="Male">Male</option>
                                         <option value="Female">Female</option>
@@ -67,23 +71,42 @@
                             </div>
 
                             <div class="control-group">
-                                <label for="name" >{{ __('admin::app.customers.customers.customer_group') }}</label>
+                                <label for="customerGroup" >{{ __('admin::app.customers.customers.customer_group') }}</label>
 
                                 @if(!is_null($customer->customer_group_id))
-                                    <?php $selectedOption = $customer->customerGroup->id ?>
+                                    <?php $selectedCustomerOption = $customer->customerGroup->id ?>
+                                @else
+                                    <?php $selectedCustomerOption = '' ?>
                                 @endif
 
                                 <select  class="control" name="customer_group_id">
-
                                     @foreach($customerGroup as $group)
-                                    <option value="{{ $group->id }}" {{ $selectedOption == $group->id ? 'selected' : '' }}>
+                                    <option value="{{ $group->id }}" {{ $selectedCustomerOption == $group->id ? 'selected' : '' }}>
                                         {{ $group->group_name}}
                                     </option>
                                     @endforeach
-
                                 </select>
                             </div>
 
+                            <div class="control-group" :class="[errors.has('channel_id') ? 'has-error' : '']">
+                                <label for="channel" >{{ __('admin::app.customers.customers.channel_name') }}</label>
+
+                                @if(!is_null($customer->channel_id))
+                                    <?php $selectedChannelOption = $customer->channel_id ?>
+                                @else
+                                    <?php $selectedChannelOption = $customer->channel_id ?>
+                                @endif
+
+                                <select  class="control" name="channel_id" v-validate="'required'">
+                                    @foreach($channelName as $channel)
+                                    <option value="{{ $channel->id }}" {{ $selectedChannelOption == $channel->id ? 'selected' : '' }}>
+                                        {{ $channel->name}}
+                                    </option>
+                                    @endforeach
+                                </select>
+                                <span class="control-error" v-if="errors.has('channel_id')">@{{ errors.first('channel_id') }}</span>
+                            </div>
+
                         </div>
                     </accordian>
 
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/group/create.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/group/create.blade.php
new file mode 100644
index 000000000..79fca7fa3
--- /dev/null
+++ b/packages/Webkul/Admin/src/Resources/views/customers/group/create.blade.php
@@ -0,0 +1,54 @@
+@extends('admin::layouts.content')
+
+@section('page_title')
+    {{ __('admin::app.customers.groups.add-title') }}
+@stop
+
+@section('content')
+    <div class="content">
+        <form method="POST" action="{{ route('admin.groups.store') }}" @submit.prevent="onSubmit">
+
+            <div class="page-header">
+                <div class="page-title">
+                    <h1>
+                        {{ __('admin::app.customers.groups.add-title') }}
+                    </h1>
+                </div>
+
+                <div class="page-action">
+                    <button type="submit" class="btn btn-lg btn-primary">
+                        {{ __('admin::app.customers.groups.save-btn-title') }}
+                    </button>
+                </div>
+            </div>
+
+            <div class="page-content">
+
+                <div class="form-container">
+                    @csrf()
+
+                    <div class="control-group" :class="[errors.has('group_name') ? 'has-error' : '']">
+                        <label for="group_name" class="required">
+                            {{ __('admin::app.customers.groups.name') }}
+                        </label>
+                        <input type="text" class="control" name="group_name" v-validate="'required'" value="{{ old('group_name') }}">
+                        <span class="control-error" v-if="errors.has('group_name')">@{{ errors.first('group_name') }}</span>
+                    </div>
+
+                    <div class="control-group">
+                        <label for="is_user_defined">
+                            {{ __('admin::app.customers.groups.is_user_defined') }}
+                        </label>
+                        <span class="checkbox">
+                            <input type="checkbox"  name="is_user_defined" value="0">
+                            <label class="checkbox-view" for="is_user_defined"></label>
+                            {{ __('admin::app.customers.groups.yes') }}
+                        </span>
+                    </div>
+
+                </div>
+
+            </div>
+        </form>
+    </div>
+@stop
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/group/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/group/edit.blade.php
new file mode 100644
index 000000000..c97085720
--- /dev/null
+++ b/packages/Webkul/Admin/src/Resources/views/customers/group/edit.blade.php
@@ -0,0 +1,55 @@
+@extends('admin::layouts.content')
+
+@section('page_title')
+    {{ __('admin::app.customers.groups.edit-title') }}
+@stop
+
+@section('content')
+    <div class="content">
+        <form method="POST" action="{{ route('admin.groups.update', $group->id) }}">
+
+            <div class="page-header">
+                <div class="page-title">
+                    <h1>
+                        {{ __('admin::app.customers.groups.edit-title') }}
+                    </h1>
+                </div>
+
+                <div class="page-action">
+                    <button type="submit" class="btn btn-lg btn-primary">
+                        {{ __('admin::app.customers.groups.save-btn-title') }}
+                    </button>
+                </div>
+            </div>
+
+            <div class="page-content">
+
+                <div class="form-container">
+                    @csrf()
+
+                    <input name="_method" type="hidden" value="PUT">
+
+                    <div class="control-group" :class="[errors.has('group_name') ? 'has-error' : '']">
+                        <label for="group_name" class="required">
+                            {{ __('admin::app.customers.groups.name') }}
+                        </label>
+                        <input type="text" class="control" name="group_name" v-validate="'required'" value="{{ $group->group_name }}">
+                        <span class="control-error" v-if="errors.has('group_name')">@{{ errors.first('group_name') }}</span>
+                    </div>
+
+                    <div class="control-group">
+                        <label for="is_user_defined">
+                            {{ __('admin::app.customers.groups.is_user_defined') }}
+                        </label>
+                        <span class="checkbox">
+                            <input type="checkbox"  name="is_user_defined" value="{{ $group->is_user_defined }}" {{ $group->is_user_defined ? 'checked' : '' }}>
+                            <label class="checkbox-view" for="is_user_defined"></label>
+                            {{ __('admin::app.customers.groups.yes') }}
+                        </span>
+                    </div>
+
+                </div>
+            </div>
+        </form>
+    </div>
+@stop
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/group/index.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/group/index.blade.php
new file mode 100644
index 000000000..a383ff6cd
--- /dev/null
+++ b/packages/Webkul/Admin/src/Resources/views/customers/group/index.blade.php
@@ -0,0 +1,27 @@
+@extends('admin::layouts.content')
+
+@section('page_title')
+    {{ __('admin::app.customers.groups.title') }}
+@stop
+
+@section('content')
+
+    <div class="content">
+        <div class="page-header">
+            <div class="page-title">
+                <h1>{{ __('admin::app.customers.groups.title') }}</h1>
+            </div>
+            <div class="page-action">
+                <a href="{{ route('admin.groups.create') }}" class="btn btn-lg btn-primary">
+                    {{ __('admin::app.customers.groups.add-title') }}
+                </a>
+            </div>
+        </div>
+
+        <div class="page-content">
+            @inject('customerGroup','Webkul\Admin\DataGrids\CustomerGroupDataGrid')
+            {!! $customerGroup->render() !!}
+        </div>
+    </div>
+
+@stop
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/index.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/index.blade.php
index d40180509..03feb24cd 100644
--- a/packages/Webkul/Admin/src/Resources/views/customers/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/customers/index.blade.php
@@ -13,7 +13,7 @@
             </div>
             <div class="page-action">
                 <a href="{{ route('admin.customer.create') }}" class="btn btn-lg btn-primary">
-                    {{ __('Add Customer') }}
+                    {{ __('admin::app.customers.customers.add-title') }}
                 </a>
             </div>
         </div>
diff --git a/packages/Webkul/Admin/src/Resources/views/errors/403.blade.php b/packages/Webkul/Admin/src/Resources/views/errors/403.blade.php
index b351a4191..3f6dd9a30 100644
--- a/packages/Webkul/Admin/src/Resources/views/errors/403.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/errors/403.blade.php
@@ -1,7 +1,7 @@
 @extends('admin::layouts.content')
 
 @section('page_title')
-
+    {{ __('admin::app.error.403.page-title') }}
 @stop
 
 @section('content')
@@ -14,11 +14,17 @@
 
                 <div class="error-title" style="font-size: 100px;color: #5E5E5E"> {{ $code }}</div>
 
-                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">Page Not Found</div>
+                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">
+                    {{ __('admin::app.error.403.title') }}
+                </div>
 
-                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">The Page you are looking for doesnt exist or have secrately escaped;head backm to home and make a fresh move again.</div>
+                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">
+                    {{ __('admin::app.error.403.message') }}
+                </div>
 
-                <a href="{{ route('admin.dashboard.index') }}">GO TO HOME</a>
+                <a href="{{ route('admin.dashboard.index') }}">
+                    {{ __('admin::app.error.go-to-home') }}
+                </a>
 
             </div>
 
diff --git a/packages/Webkul/Admin/src/Resources/views/errors/404.blade.php b/packages/Webkul/Admin/src/Resources/views/errors/404.blade.php
index b351a4191..cb7f7da76 100644
--- a/packages/Webkul/Admin/src/Resources/views/errors/404.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/errors/404.blade.php
@@ -1,7 +1,7 @@
 @extends('admin::layouts.content')
 
 @section('page_title')
-
+    {{ __('admin::app.error.404.page-title') }}
 @stop
 
 @section('content')
@@ -14,11 +14,17 @@
 
                 <div class="error-title" style="font-size: 100px;color: #5E5E5E"> {{ $code }}</div>
 
-                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">Page Not Found</div>
+                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">
+                    {{ __('admin::app.error.404.title') }}
+                </div>
 
-                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">The Page you are looking for doesnt exist or have secrately escaped;head backm to home and make a fresh move again.</div>
+                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">
+                    {{ __('admin::app.error.404.message') }}
+                </div>
 
-                <a href="{{ route('admin.dashboard.index') }}">GO TO HOME</a>
+                <a href="{{ route('admin.dashboard.index') }}">
+                    {{ __('admin::app.error.go-to-home') }}
+                </a>
 
             </div>
 
diff --git a/packages/Webkul/Admin/src/Resources/views/errors/500.blade.php b/packages/Webkul/Admin/src/Resources/views/errors/500.blade.php
index b351a4191..40152c113 100644
--- a/packages/Webkul/Admin/src/Resources/views/errors/500.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/errors/500.blade.php
@@ -1,10 +1,11 @@
 @extends('admin::layouts.content')
 
 @section('page_title')
-
+    {{ __('admin::app.error.403.page-title') }}
 @stop
 
 @section('content')
+
     <div class="error-container" style="width: 100%; display: flex; justify-content: center;">
 
         <div class="wrapper" style="display: flex; height: 60vh; width: 100%;
@@ -14,11 +15,17 @@
 
                 <div class="error-title" style="font-size: 100px;color: #5E5E5E"> {{ $code }}</div>
 
-                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">Page Not Found</div>
+                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">
+                    {{ __('admin::app.error.500.title') }}
+                </div>
 
-                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">The Page you are looking for doesnt exist or have secrately escaped;head backm to home and make a fresh move again.</div>
+                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">
+                    {{ __('admin::app.error.500.message') }}
+                </div>
 
-                <a href="{{ route('admin.dashboard.index') }}">GO TO HOME</a>
+                <a href="{{ route('admin.dashboard.index') }}">
+                    {{ __('admin::app.error.go-to-home') }}
+                </a>
 
             </div>
 
@@ -27,4 +34,5 @@
         </div>
 
     </div>
+
 @stop
\ No newline at end of file
diff --git a/packages/Webkul/Category/src/Models/Category.php b/packages/Webkul/Category/src/Models/Category.php
index 5fd7ef670..9fbda2311 100644
--- a/packages/Webkul/Category/src/Models/Category.php
+++ b/packages/Webkul/Category/src/Models/Category.php
@@ -11,5 +11,5 @@ class Category extends TranslatableModel
 
     public $translatedAttributes = ['name', 'description', 'slug', 'meta_title', 'meta_description', 'meta_keywords'];
 
-    protected $fillable = ['position', 'status', 'parent_id','image'];
+    protected $fillable = ['position', 'status', 'parent_id'];
 }
\ No newline at end of file
diff --git a/packages/Webkul/Category/src/Repositories/CategoryRepository.php b/packages/Webkul/Category/src/Repositories/CategoryRepository.php
index da80cbcb4..d4574759b 100644
--- a/packages/Webkul/Category/src/Repositories/CategoryRepository.php
+++ b/packages/Webkul/Category/src/Repositories/CategoryRepository.php
@@ -1,7 +1,7 @@
-<?php 
+<?php
 
 namespace Webkul\Category\Repositories;
- 
+
 use Webkul\Core\Eloquent\Repository;
 use Webkul\Category\Models\Category;
 use Illuminate\Container\Container as App;
@@ -44,7 +44,7 @@ class CategoryRepository extends Repository
     {
         if(isset($data['locale']) && $data['locale'] == 'all') {
             $model = app()->make($this->model());
-            
+
             foreach(core()->getAllLocales() as $locale) {
                 foreach ($model->translatedAttributes as $attribute) {
                     if(isset($data[$attribute])) {
@@ -54,7 +54,11 @@ class CategoryRepository extends Repository
             }
         }
 
-        return $this->model->create($data);
+        $category = $this->model->create($data);
+
+        $this->uploadImages($data, $category);
+
+        return $category;
     }
 
     /**
@@ -99,4 +103,52 @@ class CategoryRepository extends Repository
             get_class($this->model), $slug
         );
     }
+
+    /**
+     * @param array $data
+     * @param $id
+     * @param string $attribute
+     * @return mixed
+     */
+    public function update(array $data, $id, $attribute = "id")
+    {
+        $category = $this->find($id);
+
+        $category->update($data);
+
+        $this->uploadImages($data, $category);
+
+        return $category;
+    }
+
+    /**
+     * @param array $data
+     * @param mixed $category
+     * @return void
+     */
+    public function uploadImages($data, $category,$type = "image")
+    {
+        if(isset($data[$type])) {
+            foreach ($data[$type] as $imageId => $image) {
+                $file = $type . '.' . $imageId;
+                $dir = 'category/' . $category->id;
+
+                if(request()->hasFile($file)) {
+                    if($category->{$type}) {
+                        Storage::delete($category->{$type});
+                    }
+
+                    $category->{$type} = request()->file($file)->store($dir);
+                    $category->save();
+                }
+            }
+        } else {
+            if($category->{$type}) {
+                Storage::delete($category->{$type});
+            }
+
+            $category->{$type} = null;
+            $category->save();
+        }
+    }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Core/src/Http/Controllers/ChannelController.php b/packages/Webkul/Core/src/Http/Controllers/ChannelController.php
index cdbb7d48b..6b4646a2b 100644
--- a/packages/Webkul/Core/src/Http/Controllers/ChannelController.php
+++ b/packages/Webkul/Core/src/Http/Controllers/ChannelController.php
@@ -79,7 +79,7 @@ class ChannelController extends Controller
             'currencies' => 'required|array|min:1',
             'base_currency_id' => 'required'
         ]);
-        
+
         $this->channel->create(request()->all());
 
         session()->flash('success', 'Channel created successfully.');
diff --git a/packages/Webkul/Core/src/Http/Controllers/ExchangeRateController.php b/packages/Webkul/Core/src/Http/Controllers/ExchangeRateController.php
index 37f6884ab..4e526972a 100644
--- a/packages/Webkul/Core/src/Http/Controllers/ExchangeRateController.php
+++ b/packages/Webkul/Core/src/Http/Controllers/ExchangeRateController.php
@@ -140,6 +140,14 @@ class ExchangeRateController extends Controller
      */
     public function destroy($id)
     {
-        $this->exchangeRate->delete($id);
+        if($this->exchangeRate->count() == 1) {
+            session()->flash('error', 'At least one Exchange rate is required.');
+        } else {
+            $this->exchangeRate->delete($id);
+
+            session()->flash('success', 'Exchange rate deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Core/src/Repositories/ChannelRepository.php b/packages/Webkul/Core/src/Repositories/ChannelRepository.php
index 92ea24717..a3d1f364b 100644
--- a/packages/Webkul/Core/src/Repositories/ChannelRepository.php
+++ b/packages/Webkul/Core/src/Repositories/ChannelRepository.php
@@ -1,7 +1,7 @@
-<?php 
+<?php
 
 namespace Webkul\Core\Repositories;
- 
+
 use Webkul\Core\Eloquent\Repository;
 use Illuminate\Support\Facades\Storage;
 
@@ -72,6 +72,7 @@ class ChannelRepository extends Repository
      */
     public function uploadImages($data, $channel, $type = "logo")
     {
+
         if(isset($data[$type])) {
             foreach ($data[$type] as $imageId => $image) {
                 $file = $type . '.' . $imageId;
diff --git a/packages/Webkul/Customer/src/Database/migrations/2018_07_24_082635_create_customer_groups_table.php b/packages/Webkul/Customer/src/Database/migrations/2018_07_24_082635_create_customer_groups_table.php
index 7d7e5f7ce..854f7fad0 100644
--- a/packages/Webkul/Customer/src/Database/migrations/2018_07_24_082635_create_customer_groups_table.php
+++ b/packages/Webkul/Customer/src/Database/migrations/2018_07_24_082635_create_customer_groups_table.php
@@ -16,6 +16,7 @@ class CreateCustomerGroupsTable extends Migration
         Schema::create('customer_groups', function (Blueprint $table) {
             $table->increments('id');
             $table->string('group_name');
+            $table->boolean('is_user_defined')->default(true);
             $table->timestamps();
         });
     }
diff --git a/packages/Webkul/Customer/src/Models/Customer.php b/packages/Webkul/Customer/src/Models/Customer.php
index e5762dbc3..912086883 100644
--- a/packages/Webkul/Customer/src/Models/Customer.php
+++ b/packages/Webkul/Customer/src/Models/Customer.php
@@ -4,7 +4,7 @@ namespace Webkul\Customer\Models;
 
 use Illuminate\Notifications\Notifiable;
 use Illuminate\Foundation\Auth\User as Authenticatable;
-use Webkul\Customer\Models\CustomersGroups;
+use Webkul\Customer\Models\CustomerGroup;
 use Webkul\Sales\Models\Order;
 
 // use Webkul\User\Notifications\AdminResetPassword;
@@ -36,6 +36,6 @@ class Customer extends Authenticatable
      */
     public function customerGroup()
     {
-        return $this->belongsTo(CustomersGroups::class);
+        return $this->belongsTo(CustomerGroup::class);
     }
 }
diff --git a/packages/Webkul/Customer/src/Models/CustomersAddress.php b/packages/Webkul/Customer/src/Models/CustomerAddress.php
similarity index 86%
rename from packages/Webkul/Customer/src/Models/CustomersAddress.php
rename to packages/Webkul/Customer/src/Models/CustomerAddress.php
index 2e9ffbd2e..927742082 100644
--- a/packages/Webkul/Customer/src/Models/CustomersAddress.php
+++ b/packages/Webkul/Customer/src/Models/CustomerAddress.php
@@ -3,7 +3,7 @@ namespace Webkul\Customer\Models;
 
 use Illuminate\Database\Eloquent\Model;
 
-class CustomersAddress extends Model
+class CustomerAddress extends Model
 {
     protected $table = 'customer_addresses';
 
diff --git a/packages/Webkul/Customer/src/Models/CustomerGroups.php b/packages/Webkul/Customer/src/Models/CustomerGroup.php
similarity index 57%
rename from packages/Webkul/Customer/src/Models/CustomerGroups.php
rename to packages/Webkul/Customer/src/Models/CustomerGroup.php
index c71d8e34d..47e77ff5b 100644
--- a/packages/Webkul/Customer/src/Models/CustomerGroups.php
+++ b/packages/Webkul/Customer/src/Models/CustomerGroup.php
@@ -3,7 +3,9 @@ namespace Webkul\Customer\Models;
 
 use Illuminate\Database\Eloquent\Model;
 
-class CustomersGroups extends Model
+class CustomerGroup extends Model
 {
     protected $table = 'customer_groups';
+
+    protected $fillable = ['group_name', 'is_user_defined'];
 }
diff --git a/packages/Webkul/Customer/src/Repositories/CustomerAddressRepository.php b/packages/Webkul/Customer/src/Repositories/CustomerAddressRepository.php
index 621c91bae..b172328e7 100644
--- a/packages/Webkul/Customer/src/Repositories/CustomerAddressRepository.php
+++ b/packages/Webkul/Customer/src/Repositories/CustomerAddressRepository.php
@@ -21,7 +21,7 @@ class CustomerAddressRepository extends Repository
 
     function model()
     {
-        return 'Webkul\Customer\Models\CustomersAddress';
+        return 'Webkul\Customer\Models\CustomerAddress';
     }
 
     /**
diff --git a/packages/Webkul/Customer/src/Repositories/CustomerGroupRepository.php b/packages/Webkul/Customer/src/Repositories/CustomerGroupRepository.php
index 2aa6489df..28746cb72 100644
--- a/packages/Webkul/Customer/src/Repositories/CustomerGroupRepository.php
+++ b/packages/Webkul/Customer/src/Repositories/CustomerGroupRepository.php
@@ -21,7 +21,7 @@ class CustomerGroupRepository extends Repository
 
     function model()
     {
-        return 'Webkul\Customer\Models\CustomersGroups';
+        return 'Webkul\Customer\Models\CustomerGroup';
     }
 
     /**
diff --git a/packages/Webkul/Product/src/Repositories/ProductReviewRepository.php b/packages/Webkul/Product/src/Repositories/ProductReviewRepository.php
index 71c19f9ce..1a4ec846c 100644
--- a/packages/Webkul/Product/src/Repositories/ProductReviewRepository.php
+++ b/packages/Webkul/Product/src/Repositories/ProductReviewRepository.php
@@ -57,8 +57,6 @@ class ProductReviewRepository extends Repository
 
         $reviews = $this->model->where(['customer_id'=> $customerId, 'status' => 'approved'])->with('product')->get();
 
-        // dd($reviews);
-
         return $reviews;
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/assets/js/components/category-item.vue b/packages/Webkul/Shop/src/Resources/assets/js/components/category-item.vue
index 31126425b..5c5ef5f18 100644
--- a/packages/Webkul/Shop/src/Resources/assets/js/components/category-item.vue
+++ b/packages/Webkul/Shop/src/Resources/assets/js/components/category-item.vue
@@ -4,7 +4,7 @@
         <a :href="url+'/categories/'+this.item['translations'][0].slug">{{ this.item['translations'][0].name }}&emsp;<i class="icon dropdown-right-icon"
         v-if="haveChildren && item.parent_id != null"></i></a>
 
-        <i :class="[show ? 'icon icon-arrow-down mt-15' : 'icon dropdown-right-icon mt-15']"
+        <i :class="[show ? 'icon icon-arrow-down mt-15' : 'icon dropdown-right-icon left mt-15']"
         v-if="haveChildren"  @click="showOrHide"></i>
 
         <ul v-if="haveChildren && show">
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
index f8e48539b..8d94a5f22 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
@@ -33,6 +33,13 @@
         grid-auto-rows: auto;
     }
 
+    @media only screen and (max-width: 551px) {
+        .product-grid-3 {
+            grid-template-columns: 48.5% 48.5%;
+            grid-column-gap: 20px;
+        }
+    }
+
     @media only screen and (max-width: 854px) {
         .product-grid-4 {
             grid-template-columns: 29.5% 29.5% 29.5%;
@@ -121,6 +128,21 @@
         }
     }
 
+    @media only screen and (max-width: 425px) {
+        .product-card {
+            font-size: 90%;
+
+            .btn.btn-md {
+                padding: 5px;
+            }
+        }
+
+        .product-grid-4 {
+            grid-template-columns: 48.5% 48.5%;
+            grid-column-gap: 10px;
+        }
+    }
+
     .product-list {
         min-height: 200px;
 
@@ -711,16 +733,56 @@ section.slider-block {
             border-top: 1px solid $border-color;
         }
     }
-
-    .responsive-nav {
-        display: none;
-    }
 }
 
 @media all and (max-width: 720px) {
 
-    .header-bottom {
-        display: none !important;
+    .header {
+        .header-bottom {
+            height: auto;
+            display: none;
+
+            .nav a {
+                display:inline-block;
+            }
+
+            ul.nav , .nav li{
+                height: auto;
+            }
+
+            .nav > li {
+                float: none;
+            }
+
+            // .nav li ul  {
+            //     padding-left: 20px;
+            // }
+
+            .nav  li  > .icon{
+                float: right;
+                display: block;
+            }
+
+            .nav li .left{
+                height: 16px;
+                width: 16px;
+            }
+
+            .nav  li  a > .icon{
+                display: none;
+            }
+
+            .nav ul {
+                position: unset;
+                border: none;
+                box-shadow: none;
+            }
+
+            .nav > li li:hover > ul {
+                margin-left: 0px;
+                top: 0px;
+            }
+        }
     }
 
     ul.search-container {
@@ -738,51 +800,6 @@ section.slider-block {
     ul.right-responsive {
         display: flex !important;
     }
-
-    .responsive-nav {
-        margin-top: 20px;
-        display: none;
-
-        .nav a {
-            display:inline-block;
-            color: $font-color;
-            text-decoration: none;
-            padding: 12px 4.8px 12px 8px;
-            text-transform: uppercase;
-            letter-spacing: 2px;
-        }
-
-        .nav  li  > .icon{
-            float: right;
-        }
-
-        .nav  li  a > .icon{
-            display: none;
-        }
-
-        .nav > li  {
-            border-bottom: 1px solid $border-color;
-        }
-
-        .nav li ul  {
-            padding-left: 30px;
-        }
-
-        .nav li:first-child {
-            border-top: 1px solid $border-color;
-        }
-
-        .nav > li:last-child {
-            float:none;
-            height: 45px;
-            display: none;
-            border: none;
-
-            img {
-                margin-right:6px;
-            }
-        }
-    }
 }
 
 //footer responsive with out media query.
@@ -872,6 +889,100 @@ section.slider-block {
         flex-direction: row;
         width: 100%;
 
+        .layered-filter-wrapper {
+            width: 25%;
+            float: left;
+            padding-right: 20px;
+            min-height: 1px;
+
+            .filter-title {
+                border-bottom: 1px solid $border-color;
+                color: $font-color;
+                padding: 10px 0;
+            }
+
+            .filter-attributes {
+                .filter-attributes-item {
+                    border-bottom: 1px solid $border-color;
+                    padding-bottom: 10px;
+
+                    .filter-attributes-title {
+                        padding: 10px 40px 0 10px;
+                        color: #5E5E5E;
+                        cursor: pointer;
+                        position: relative;
+
+                        .remove-filter-link {
+                            font-weight: 400;
+                            color: $brand-color;
+                            margin-right: 10px;
+                        }
+
+                        .icon {
+                            background-image: url('../images/arrow-down.svg') !important;
+                            width: 10px;
+                            height: 10px;
+                            position: absolute;
+                            right: 15px;
+                            top: 14px;
+                        }
+                    }
+
+                    .filter-attributes-content {
+                        padding: 10px;
+                        display: none;
+
+                        ol.items {
+                            padding: 0;
+                            margin: 0;
+                            list-style: none none;
+
+                            li.item {
+                                padding: 8px 0;
+                                color: #5E5E5E;
+
+                                .checkbox {
+                                    margin: 0;
+
+                                    .checkbox-view {
+                                        height: 16px;
+                                        width: 16px;
+                                        background-image: url("../images/checkbox.svg");
+                                    }
+
+                                    input:checked + .checkbox-view {
+                                        background-image: url("../images/checkbox-checked.svg");
+                                    }
+                                }
+                            }
+                        }
+
+                        .price-range-wrapper {
+                            margin-top: 21px;
+                        }
+                    }
+
+                    &.active {
+                        .filter-attributes-content {
+                            display: block;
+                        }
+
+                        .filter-attributes-title .icon {
+                            background-image: url('../images//arrow-up.svg') !important;
+                        }
+                    }
+                }
+            }
+        }
+
+        .responsive-layred-filter {
+            display: none;
+            @extend .layered-filter-wrapper;
+            width: 100%;
+            float: none;
+            padding-right: 0px;
+        }
+
         .category-block {
             width: 80%;
             display: block;
@@ -899,12 +1010,12 @@ section.slider-block {
             color: $font-color;
             line-height: 45px;
 
-            span:first-child {
-                display: inline;
-            }
-
-            span:last-child {
+            span {
                 display: none;
+
+                &:first-child {
+                    display: inline;
+                }
             }
         }
 
@@ -952,14 +1063,6 @@ section.slider-block {
         }
     }
 
-    .reponsive-sorter-limiter {
-        display: none;
-    }
-
-    .responsive-layred-filter{
-        display: none;
-    }
-
     .bottom-toolbar {
         display: block;
         margin-top: 40px;
@@ -968,6 +1071,55 @@ section.slider-block {
     }
 }
 
+//category page responsivs css
+@media only screen and (max-width: 840px) {
+    .main {
+        .layered-filter-wrapper{
+            display: none;
+        }
+
+        .category-block {
+            width: 100% !important;
+
+            .top-toolbar {
+                display: flex;
+                flex-direction: column;
+
+                .page-info {
+                    border-bottom: 1px solid $border-color;
+                    line-height: 15px;
+
+                    span {
+                        display: inline;
+
+                        &:first-child{
+                            display: none;
+                        }
+                    }
+
+                    .sort-filter {
+                        float: right;
+                        cursor: pointer;
+                    }
+                }
+
+                .pager {
+                    margin-top: 20px;
+                    display: none;
+
+                    .view-mode {
+                        display: none;
+                    }
+                }
+            }
+
+            .responsive-layred-filter {
+                display: block;
+            }
+        }
+    }
+}
+
 // product pages css starts here
 section.product-detail {
     color: $font-color;
@@ -1208,7 +1360,6 @@ section.product-detail {
                     margin-right: 0px;
 
                     .thumb-frame {
-
                         img {
                             height: 100%;
                             width: auto;
@@ -1240,11 +1391,8 @@ section.product-detail {
 }
 
 @media only screen and (max-width: 510px){
-
     section.product-detail div.layouter form {
-
         div.product-image-group {
-
             .product-hero-image img {
                 width: 100% !important;
             }
@@ -1740,49 +1888,37 @@ section.cart {
 
 // review page start here
 section.review {
-    color: $font-color;
-
     .category-breadcrumbs {
         display: inline;
     }
 
     .review-layouter {
         display: flex;
-        flex-direction: row;
 
         .product-info {
+            font-size: 24px;
 
             .product-image {
                 img {
-                    display: block;
                     height: 280px;
                     width: 280px;
                 }
             }
 
-            .product-name {
-                margin-top: 20px;
-
-                span {
-                    font-size: 24px;
-                }
-            }
-
             .product-price {
-                margin-top: 10px;
-
                 .pro-price {
-                    font-size: 24px;
                     color: $disc-price;
                 }
 
                 .pro-price-not {
                     margin-left: 10px;
+                    font-size: 16px;
                     color: $disc-price-pro;
                 }
 
                 .offer {
                     margin-left: 10px;
+                    font-size: 16px;
                 }
             }
         }
@@ -1792,69 +1928,41 @@ section.review {
             width: 49%;
 
             .heading {
-                margin-top: 10px;
+                color: #242424;
+                font-weight: 600;
 
-                .btn.btn-primary.right {
+                .right {
                    float: right;
                    margin-top: -10px;
                 }
             }
 
             .rating {
-                margin-top : 25px;
                 color: $font-color-light;
 
-
-                span {
-                    display: inline;
-                }
-            }
-
-            .stars {
-
-                width: 270px;
-                display: inline-block;
-
                 label.star {
-                font-size: 36px;
-                color: #d4d4d4;
-                transition: all .2s;
+                    font-size: 25px;
+                    color: #d4d4d4;
+                    transition: all .2s;
                 }
 
                 label.star:before {
                     content: '\2605';
                 }
-
             }
 
             .write-review {
-                margin-top: 25px;
-
-                .control-group {
-                    margin-bottom: 0px;
-
-                    textarea {
-                        margin-top: 5px;
-                        border: 2px solid $border-color;
-                        border-radius: 3px;
-                        width: 600px;
-                        height: 120px;
-                    }
+                label {
+                    color: $font-color-light;
+                    font-size: 16px;
                 }
-            }
-
-            .submit-button {
-                margin-top: 10px;
-
-                button {
-                    background: $brand-color;
-                    font-size: 14px;
-                    color: $background-color;
-
-                    text-align: center;
-                    width: 120px;
-                    height: 38px;
-                    border: none;
+                textarea {
+                    margin-top: 5px;
+                    border: 2px solid $border-color;
+                    color: $font-color-light;
+                    border-radius: 3px;
+                    width: 90%;
+                    height: 120px;
                 }
             }
 
@@ -1871,17 +1979,14 @@ section.review {
                     width: 48%;
 
                     .avg-rating-count{
-
                         span {
                             font-size: 34px;
-
                             text-align: center;
                         }
                     }
                 }
 
                 .rating-calculate {
-
                     .progress-only {
                         width:20px;
                         border: 1px solid blue;
@@ -1889,10 +1994,123 @@ section.review {
                 }
             }
         }
+
+        .ratings-reviews {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+
+            .left-side {
+                padding: 40px 20px 40px 20px;
+                width: 50%;
+
+                .rate {
+                    font-size: 34px;
+                }
+
+                .stars.icon {
+                    height: 16px;
+                    width: 16px;
+                }
+            }
+
+            .right-side {
+                width: 50%;
+
+                .rater {
+                    display: inline-flex;
+                    align-items: center;
+                    padding-top: 5px;
+                    width: 100%;
+
+                    .star-name {
+                        margin-right: 5px;
+                    }
+
+                    .rate-number {
+                        width:15px;
+                    }
+
+                    .percentage {
+                        width: 15%;
+                        margin-right: 10px;
+
+                        span {
+                            float: right;
+                            white-space: nowrap;
+                        }
+                    }
+
+                    .line-bar {
+                        height: 4px;
+                        width: 65%;
+                        margin-right: 5px;
+                        background: #D8D8D8;
+
+                        .line-value {
+                            background-color: #0031F0;
+                        }
+                    }
+                }
+            }
+        }
     }
 }
 // review page end here
 
+// review responsive css start here
+@media only screen and (max-width: 770px) {
+    section.review {
+        .category-breadcrumbs{
+            display: none;
+        }
+
+        .review-layouter {
+            flex-direction: column;
+
+            .product-info .product-image {
+                max-width: 280px;
+                margin-left: auto;
+                margin-right: auto;
+            }
+
+            .review-form {
+                width: 100%;
+                margin-left: 0px;
+
+                .heading .right {
+                    margin-top: 50px;
+                }
+
+                .ratings-reviews {
+                    flex-direction: column;
+                    width: 100%;
+
+                    .left-side {
+                        width: 100%;
+                        padding: 0px 0px 40px 0px;
+                        margin-top: -50px;
+                    }
+
+                    .right-side {
+                        width: 100%;
+
+                        .rater .line-bar {
+                            width: 100%;
+                        }
+
+                        .rater .percentage {
+                            width: 10%;
+                            margin-right: 0px;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+//review responsive css end here
+
 
 //customers auth page css goes here
 .auth-content {
@@ -2028,6 +2246,88 @@ section.review {
 
         .account-head {
             margin-bottom: 20px;
+
+            .back-icon {
+                display: none;
+            }
+        }
+    }
+}
+
+//customer account page responsive layout
+@media only screen and (max-width: 770px) {
+    .account-content {
+        flex-direction: column;
+
+        .account-side-menu {
+            display: none;
+            width:100%;
+            border: none;
+
+            li {
+                margin-left: 0%;
+                width: 100%;
+
+                a {
+                    color : $font-color;
+                }
+            }
+        }
+
+        .responsive-side-menu {
+            cursor: pointer;
+            padding-top:13px;
+            display: block;
+            height: 46px;
+            border-bottom: 1px solid $border-color;
+            border-top: 1px solid $border-color;
+
+            .right {
+                float: right;
+            }
+        }
+
+        .account-layout {
+            margin-left: 0%;
+            margin-top: 20px;
+
+            .account-head  {
+                display: flex;
+                justify-content: space-between;
+                border-bottom: 1px solid $border-color;
+                border-top: 1px solid $border-color;
+                height: 46px;
+
+                .back-icon {
+                    display: block;
+                }
+
+                span {
+                    margin-top: 12px;
+                    font-size: 18px;
+                }
+
+                .horizontal-rule {
+                    display: none;
+                }
+            }
+
+            .account-table-content {
+                margin-top: 2%;
+
+                table tbody tr {
+                    display: grid;
+                    margin-bottom: 20px;
+                }
+            }
+        }
+
+        .account-items-list , .edit-form {
+            margin-top: 20px;
+        }
+
+        .control-group .control {
+            width: 100%;
         }
     }
 }
@@ -2106,7 +2406,6 @@ section.review {
                         color: #8E8E8E;
                     }
 
-
                     .box-content {
                         color: #3A3A3A;
                     }
@@ -2116,6 +2415,10 @@ section.review {
             .qty-row {
                 display: block;
             }
+
+            .responsive-table {
+                display: none;
+            }
         }
     }
 
@@ -2152,3 +2455,72 @@ section.review {
         }
     }
 }
+
+@media only screen and (max-width: 770px) {
+    .sale-container {
+        .sale-section {
+            .section-content {
+                .row {
+                    display: flex;
+                    flex-direction: column;
+
+                    .title {
+                        line-height: 20px;
+                    }
+                }
+
+                .table{
+                    display: none;
+                }
+
+                .responsive-table {
+                    border: 1px solid $border-color;
+                    margin-top: 5px;
+                    width: 100%;
+                    display: block;
+
+                    tbody td {
+                        padding: 8px 5px;
+
+                        &:first-child {
+                            width: 25%;
+                        }
+
+                        &:last-child {
+                            padding-left: 10px;
+                        }
+                    }
+                }
+
+                .totals {
+                    .sale-summary {
+                        width: 100%;
+
+                        tr td {
+                            &:nth-child(2) {
+                                display: none;
+                            }
+                        }
+                    }
+                }
+
+                .order-box-container {
+                    display: flex;
+                    flex-direction: column;
+
+                    .box {
+                        width: 100%;
+                        margin: 10px auto;
+                    }
+                }
+            }
+        }
+    }
+}
+
+// css for loader
+.cp-spinner {
+    margin-left: 46%;
+    margin-top: 35%;
+    margin-bottom: 35%;
+}
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/components.scss b/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
index b5259a317..18ec3a43f 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
@@ -1,18 +1,3 @@
-@media only screen and (max-width: 425px) {
-    .product-card {
-        font-size: 90%;
-
-        .btn.btn-md {
-            padding: 5px;
-        }
-    }
-
-    .product-grid-4 {
-        grid-template-columns: 48.5% 48.5%;
-        grid-column-gap: 10px;
-    }
-}
-
 
 //wishlist icon hover properties
 .add-to-wishlist {
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss b/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
index a45e8ed46..a2af8910f 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
@@ -125,4 +125,10 @@
     background-image: url("../images/Expand-Light-On.svg");
     width: 18px;
     height: 18px;
+}
+
+.icon-menu-close-adj {
+    background-image: url("../images/cross-icon-adj.svg");
+    width: 32px;
+    height: 32px;
 }
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/override.scss b/packages/Webkul/Shop/src/Resources/assets/sass/override.scss
index c43623a87..898cc8495 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/override.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/override.scss
@@ -126,167 +126,3 @@ body {
 .mt-90 {
     margin-top: 90px;
 }
-
-@media only screen and (max-width: 551px) {
-    .product-grid-3 {
-        grid-template-columns: 48.5% 48.5%;
-        grid-column-gap: 20px;
-    }
-}
-
-@media only screen and (max-width: 840px) {
-
-    .layered-filter-wrapper{
-        display: none;
-    }
-
-    .main {
-
-        .category-block {
-            width: 100% !important;
-
-            .top-toolbar {
-                border-bottom: 1px solid $border-color;
-
-                .page-info {
-
-                    span:first-child {
-                        display: none;
-                    }
-
-                    span:last-child {
-                        display: inline;
-                    }
-                }
-
-                .pager {
-
-                    .view-mode {
-                        margin-right: 0px;
-
-                        .grid-view , .list-view {
-                            display: none;
-                        }
-
-                        .sort-filter {
-                            cursor: pointer;
-                            display: inline-block;
-                            margin-top: 10px;
-                        }
-                    }
-
-                    .sorter , .limiter{
-                        display: none;
-                    }
-                }
-            }
-
-            .reponsive-sorter-limiter {
-                display: none;
-
-                select {
-                    background: #FFFFFF;
-                    border: 1px solid #C7C7C7;
-                    border-radius: 3px;
-                    color: #242424;
-                    padding: 10px;
-                }
-            }
-        }
-    }
-
-}
-
-//layered filter wrapper styles
-.layered-filter-wrapper {
-    width: 25%;
-    float: left;
-    padding-right: 20px;
-    min-height: 1px;
-
-    .filter-title {
-        border-bottom: 1px solid $border-color;
-        color: $font-color;
-        padding: 10px 0;
-    }
-
-    .filter-attributes {
-        .filter-attributes-item {
-            border-bottom: 1px solid $border-color;
-            padding-bottom: 10px;
-
-            .filter-attributes-title {
-                padding: 10px 40px 0 10px;
-                color: #5E5E5E;
-                cursor: pointer;
-                position: relative;
-
-                .remove-filter-link {
-                    font-weight: 400;
-                    color: $brand-color;
-                    margin-right: 10px;
-                }
-
-                .icon {
-                    background-image: url('../images/arrow-down.svg') !important;
-                    width: 10px;
-                    height: 10px;
-                    position: absolute;
-                    right: 15px;
-                    top: 14px;
-                }
-            }
-
-            .filter-attributes-content {
-                padding: 10px;
-                display: none;
-
-                ol.items {
-                    padding: 0;
-                    margin: 0;
-                    list-style: none none;
-
-                    li.item {
-                        padding: 8px 0;
-                        color: #5E5E5E;
-
-                        .checkbox {
-                            margin: 0;
-
-                            .checkbox-view {
-                                height: 16px;
-                                width: 16px;
-                                background-image: url("../images/checkbox.svg");
-                            }
-
-                            input:checked + .checkbox-view {
-                                background-image: url("../images/checkbox-checked.svg");
-                            }
-                        }
-                    }
-                }
-
-                .price-range-wrapper {
-                    margin-top: 21px;
-                }
-            }
-
-            &.active {
-                .filter-attributes-content {
-                    display: block;
-                }
-
-                .filter-attributes-title .icon {
-                    background-image: url('../images//arrow-up.svg') !important;
-                }
-            }
-        }
-    }
-}
-
-.responsive-layred-filter {
-    width: 100%;
-    float: none;
-    padding-right: 0px;
-}
-
diff --git a/packages/Webkul/Shop/src/Resources/lang/en/app.php b/packages/Webkul/Shop/src/Resources/lang/en/app.php
index 926dfdd17..b43e2a085 100644
--- a/packages/Webkul/Shop/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Shop/src/Resources/lang/en/app.php
@@ -17,6 +17,9 @@ return [
         'add-review-page-title' => 'Add Review',
         'write-review' => 'Write a review',
         'review-title' => 'Give Your Review a Title',
+        'product-review-page-title' => 'Product Review',
+        'rating-reviews' => 'Rating & Reviews',
+        'submit' => 'SUBMIT',
     ],
 
     'customer' => [
@@ -167,7 +170,12 @@ return [
 
             'review' => [
                 'index' => [
-                    'title' => 'Reviews'
+                    'title' => 'Reviews',
+                    'page-title' => 'Customer - Reviews'
+                ],
+
+                'view' => [
+                    'page-tile' => 'Review #:id',
                 ]
             ]
         ]
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/address/address.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/address/address.blade.php
index 26caedc2d..5a2a87908 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/address/address.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/address/address.blade.php
@@ -13,6 +13,7 @@
     <div class="account-layout">
 
         <div class="account-head">
+            <span class="back-icon"><a href="{{ route('customer.account.index') }}"><i class="icon icon-menu-back"></i></a></span>
             <span class="account-heading">{{ __('shop::app.customer.account.address.index.title') }}</span>
 
             @if(!$address->isEmpty())
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/address/edit.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/address/edit.blade.php
index 443bcd0d1..55ee9ee5a 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/address/edit.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/address/edit.blade.php
@@ -9,7 +9,9 @@
         <div class="account-layout">
 
             <div class="account-head mb-15">
-                <div class="account-heading">{{ __('shop::app.customer.account.address.edit.title') }}</div>
+                <span class="back-icon"><a href="{{ route('customer.account.index') }}"><i class="icon icon-menu-back"></i></a></span>
+                <span class="account-heading">{{ __('shop::app.customer.account.address.edit.title') }}</span>
+                <span></span>
             </div>
 
             <form method="post" action="{{ route('customer.address.edit') }}">
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/index.blade.php
index 49ff25e8a..efd7966d1 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/index.blade.php
@@ -5,29 +5,3 @@
         <h1>Account Index Page</h1>
     </div>
 @endsection
-@push('scripts')
-<script>
-    $(document).ready(function(){
-        var sideMenuTitle = document.getElementById("responsive-side-menu");
-        var downIcon = document.getElementById("down-icon");
-        var accountSideMenu = document.getElementsByClassName("account-side-menu");
-
-        sideMenuTitle.addEventListener("click", function(){
-            if(downIcon.className == 'icon icon-arrow-down right'){
-                for(let i=0 ; i < accountSideMenu.length ; i++){
-                    accountSideMenu[i].style.display="block";
-                }
-
-                downIcon.classList.remove("icon","icon-arrow-down","right");
-                downIcon.classList.add("icon","icon-arrow-up","right");
-            }else{
-                for(let i=0 ; i < accountSideMenu.length ; i++){
-                    accountSideMenu[i].style.display="none";
-                }
-
-                downIcon.classList.remove("icon","icon-arrow-up","right");
-                downIcon.classList.add("icon","icon-arrow-down","right");
-            }
-        });
-    });
-@endpush
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/index.blade.php
index ed5b20089..5e548790b 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/index.blade.php
@@ -12,9 +12,11 @@
         <div class="account-layout">
 
             <div class="account-head">
+                <span class="back-icon"><a href="{{ route('customer.account.index') }}"><i class="icon icon-menu-back"></i></a></span>
                 <span class="account-heading">
                     {{ __('shop::app.customer.account.order.index.title') }}
                 </span>
+                <span></span>
             </div>
 
             <div class="account-items-list">
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/view.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/view.blade.php
index eefa59316..e9fb8a52c 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/view.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/view.blade.php
@@ -12,9 +12,11 @@
         <div class="account-layout">
 
             <div class="account-head">
+                <span class="back-icon"><a href="{{ route('customer.account.index') }}"><i class="icon icon-menu-back"></i></a></span>
                 <span class="account-heading">
                     {{ __('shop::app.customer.account.order.view.page-tile', ['order_id' => $order->id]) }}
                 </span>
+                <span></span>
             </div>
 
             <div class="sale-container">
@@ -25,11 +27,11 @@
                         <div class="sale-section">
                             <div class="section-content">
                                 <div class="row">
-                                    <span class="title"> 
+                                    <span class="title">
                                         {{ __('shop::app.customer.account.order.view.placed-on') }}
                                     </span>
 
-                                    <span class="value"> 
+                                    <span class="value">
                                         {{ core()->formatDate($order->created_at, 'd M Y') }}
                                     </span>
                                 </div>
@@ -89,9 +91,94 @@
                                                     <td>{{ core()->formatPrice($item->total + $item->tax_amount, $order->order_currency_code) }}</td>
                                                 </tr>
                                             @endforeach
+                                        </tbody>
+
                                     </table>
                                 </div>
 
+                                @foreach ($order->items as $item)
+                                    <table class="responsive-table">
+                                        <tbody>
+                                            <tr>
+                                                <td>
+                                                    {{ __('shop::app.customer.account.order.view.SKU') }}
+                                                </td>
+                                                <td>
+                                                    {{ $item->type == 'configurable' ? $item->child->sku : $item->sku }}
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    {{ __('shop::app.customer.account.order.view.product-name') }}
+                                                </td>
+                                                <td>{{ $item->name }}</td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    {{ __('shop::app.customer.account.order.view.price') }}
+                                                </td>
+                                                <td>
+                                                    {{ core()->formatPrice($item->price, $order->order_currency_code) }}
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                {{ __('shop::app.customer.account.order.view.item-status') }}
+                                                </td>
+                                                <td>
+                                                    <span class="qty-row">
+                                                        {{ __('shop::app.customer.account.order.view.item-ordered', ['qty_ordered' => $item->qty_ordered]) }}
+                                                    </span>
+
+                                                    <span class="qty-row">
+                                                        {{ $item->qty_invoiced ? __('shop::app.customer.account.order.view.item-invoice', ['qty_invoiced' => $item->qty_invoiced]) : '' }}
+                                                    </span>
+
+                                                    <span class="qty-row">
+                                                        {{ $item->qty_shipped ? __('shop::app.customer.account.order.view.item-shipped', ['qty_shipped' => $item->qty_shipped]) : '' }}
+                                                    </span>
+
+                                                    <span class="qty-row">
+                                                        {{ $item->qty_canceled ? __('shop::app.customer.account.order.view.item-canceled', ['qty_canceled' => $item->qty_canceled]) : '' }}
+                                                    </span>
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    {{ __('shop::app.customer.account.order.view.subtotal') }}
+                                                </td>
+                                                <td>
+                                                    {{ core()->formatPrice($item->total, $order->order_currency_code) }}
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    {{ __('shop::app.customer.account.order.view.tax-percent') }}
+                                                </td>
+                                                <td>
+                                                    {{ number_format($item->tax_percent, 2) }}%
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    {{ __('shop::app.customer.account.order.view.tax-amount') }}
+                                                </td>
+                                                <td>
+                                                    {{ core()->formatPrice($item->tax_amount, $order->order_currency_code) }}
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    {{ __('shop::app.customer.account.order.view.grand-total') }}
+                                                </td>
+                                                <td>
+                                                    {{ core()->formatPrice($item->total + $item->tax_amount, $order->order_currency_code) }}
+                                                </td>
+                                            </tr>
+                                        </tbody>
+                                    </table>
+                                @endforeach
+
                                 <div class="totals">
                                     <table class="sale-summary">
                                         <tbody>
@@ -214,7 +301,7 @@
                                         </div>
                                     </div>
                                 </div>
-                            
+
                             @endforeach
 
                         </tab>
@@ -245,7 +332,7 @@
                                                 <tbody>
 
                                                     @foreach ($shipment->items as $item)
-                                                    
+
                                                         <tr>
                                                             <td>{{ $item->sku }}</td>
                                                             <td>{{ $item->name }}</td>
@@ -320,7 +407,7 @@
                 </div>
 
             </div>
-        
+
         </div>
 
     </div>
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/partials/sidemenu.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/partials/sidemenu.blade.php
index 3c32b1165..cc43c0382 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/partials/sidemenu.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/partials/sidemenu.blade.php
@@ -13,4 +13,34 @@
             <i class="icon angle-right-icon"></i>
         </li>
     @endforeach
-</ul>
\ No newline at end of file
+</ul>
+
+@push('scripts')
+<script>
+    $(document).ready(function(){
+        var sideMenuTitle = document.getElementById("responsive-side-menu");
+        var downIcon = document.getElementById("down-icon");
+        var accountSideMenu = document.getElementsByClassName("account-side-menu");
+
+        console.log(accountSideMenu);
+
+        sideMenuTitle.addEventListener("click", function(){
+            if(downIcon.className == 'icon icon-arrow-down right'){
+                for(let i=0 ; i < accountSideMenu.length ; i++){
+                    accountSideMenu[i].style.display="block";
+                }
+
+                downIcon.classList.remove("icon","icon-arrow-down","right");
+                downIcon.classList.add("icon","icon-arrow-up","right");
+            }else{
+                for(let i=0 ; i < accountSideMenu.length ; i++){
+                    accountSideMenu[i].style.display="none";
+                }
+
+                downIcon.classList.remove("icon","icon-arrow-up","right");
+                downIcon.classList.add("icon","icon-arrow-down","right");
+            }
+        });
+    });
+</script>
+@endpush
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/profile/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/profile/index.blade.php
index a7e6f6962..291c18213 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/profile/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/profile/index.blade.php
@@ -12,7 +12,7 @@
 
         <div class="account-head">
 
-            {{-- <span class="back-icon"><a href="{{ route('customer.account.index') }}"><i class="icon icon-menu-back"></i></a></span> --}}
+            <span class="back-icon"><a href="{{ route('customer.account.index') }}"><i class="icon icon-menu-back"></i></a></span>
 
             <span class="account-heading">{{ __('shop::app.customer.account.profile.index.title') }}</span>
 
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/index.blade.php
index 693d185fb..1325a3bb9 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/index.blade.php
@@ -1,6 +1,11 @@
 @inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
 @extends('shop::layouts.master')
+
+@section('page_title')
+    {{ __('shop::app.customer.account.review.index.page-title') }}
+@endsection
+
 @section('content-wrapper')
     <div class="account-content">
         @include('shop::customers.account.partials.sidemenu')
@@ -8,7 +13,7 @@
         <div class="account-layout">
 
             <div class="account-head">
-                {{-- <span class="back-icon"><a href="{{ route('customer.account.index') }}"><i class="icon icon-menu-back"></i></a></span> --}}
+                <span class="back-icon"><a href="{{ route('customer.account.index') }}"><i class="icon icon-menu-back"></i></a></span>
 
                 <span class="account-heading">{{ __('shop::app.customer.account.review.index.title') }}</span>
                 <span></span>
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
index 84f1ba4b5..388e916b3 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
@@ -1,6 +1,11 @@
 @inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
 @extends('shop::layouts.master')
+
+@section('page_title')
+    {{ __('shop::app.customer.account.review.view.page-title') }}
+@endsection
+
 @section('content-wrapper')
     <div class="account-content">
         @include('shop::customers.account.partials.sidemenu')
diff --git a/packages/Webkul/Shop/src/Resources/views/errors/403.blade.php b/packages/Webkul/Shop/src/Resources/views/errors/403.blade.php
index 4769b355b..36ef96c4b 100644
--- a/packages/Webkul/Shop/src/Resources/views/errors/403.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/errors/403.blade.php
@@ -9,13 +9,19 @@
 
             <div class="error-box"  style="width: 50%">
 
-                <div class="error-title" style="font-size: 100px;color: #5E5E5E"> {{ $code }} </div>
+                <div class="error-title" style="font-size: 100px;color: #5E5E5E"> {{ $code }}</div>
 
-                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">Page Not Found</div>
+                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">
+                    {{ __('admin::app.error.403.title') }}
+                </div>
 
-                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">The Page you are looking for doesnt exist or have secrately escaped;head backm to home and make a fresh move again.</div>
+                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">
+                    {{ __('admin::app.error.403.message') }}
+                </div>
 
-                <a href="{{ route('shop.home.index') }}">GO TO HOME</a>
+                <a href="{{ route('shop.home.index') }}">
+                    {{ __('admin::app.error.go-to-home') }}
+                </a>
 
             </div>
 
diff --git a/packages/Webkul/Shop/src/Resources/views/errors/404.blade.php b/packages/Webkul/Shop/src/Resources/views/errors/404.blade.php
index 1e0900fef..3c198c687 100644
--- a/packages/Webkul/Shop/src/Resources/views/errors/404.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/errors/404.blade.php
@@ -11,11 +11,17 @@
 
                 <div class="error-title" style="font-size: 100px;color: #5E5E5E"> {{ $code }}</div>
 
-                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">Page Not Found</div>
+                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">
+                    {{ __('admin::app.error.404.title') }}
+                </div>
 
-                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">The Page you are looking for doesnt exist or have secrately escaped;head backm to home and make a fresh move again.</div>
+                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">
+                    {{ __('admin::app.error.404.message') }}
+                </div>
 
-                <a href="{{ route('shop.home.index') }}">GO TO HOME</a>
+                <a href="{{ route('shop.home.index') }}">
+                    {{ __('admin::app.error.go-to-home') }}
+                </a>
 
             </div>
 
diff --git a/packages/Webkul/Shop/src/Resources/views/errors/500.blade.php b/packages/Webkul/Shop/src/Resources/views/errors/500.blade.php
index 4769b355b..0bbe40f7f 100644
--- a/packages/Webkul/Shop/src/Resources/views/errors/500.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/errors/500.blade.php
@@ -9,13 +9,19 @@
 
             <div class="error-box"  style="width: 50%">
 
-                <div class="error-title" style="font-size: 100px;color: #5E5E5E"> {{ $code }} </div>
+                <div class="error-title" style="font-size: 100px;color: #5E5E5E"> {{ $code }}</div>
 
-                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">Page Not Found</div>
+                <div class="error-messgae" style="font-size: 24px;color: #5E5E5E">
+                    {{ __('admin::app.error.500.title') }}
+                </div>
 
-                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">The Page you are looking for doesnt exist or have secrately escaped;head backm to home and make a fresh move again.</div>
+                <div class="error-description" style="margin-top: 20px;margin-bottom: 20px;color: #242424">
+                    {{ __('admin::app.error.500.message') }}
+                </div>
 
-                <a href="{{ route('shop.home.index') }}">GO TO HOME</a>
+                <a href="{{ route('shop.home.index') }}">
+                    {{ __('admin::app.error.go-to-home') }}
+                </a>
 
             </div>
 
diff --git a/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php b/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
index b36efd796..a41834f69 100644
--- a/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
@@ -105,7 +105,7 @@
 
                 <li class="cart-dropdown">
                     <span class="icon cart-icon"></span>
-                    
+
                     @include('shop::checkout.cart.mini-cart')
                 </li>
             </ul>
@@ -169,7 +169,7 @@
 
                     <li class="cart-dropdown">
                         <?php $cart = cart()->getCart(); ?>
-                        
+
                         @if(isset($cart))
                             <div>
                                 <a href="{{ route('shop.checkout.cart.index') }}">
@@ -205,9 +205,6 @@
         </div>  --}}
     </div>
 
-    <div class="responsive-nav">
-        <category-nav categories='@json($categories)' url="{{url()->to('/')}}"></category-nav>
-    </div>
 </div>
 
 @push('scripts')
@@ -216,15 +213,11 @@
             var hamMenu = document.getElementById("hammenu");
             var search = document.getElementById("search");
             var searchResponsive = document.getElementsByClassName('search-responsive')[0];
-            var sortLimit = document.getElementsByClassName('reponsive-sorter-limiter')[0];
-            var layerFilter = document.getElementsByClassName('responsive-layred-filter')[0];
-            var navResponsive = document.getElementsByClassName('responsive-nav')[0];
-            var thumbList = document.getElementsByClassName('thumb-list')[0];
+            var navResponsive = document.getElementsByClassName('header-bottom')[0];
 
             search.addEventListener("click", header);
             hamMenu.addEventListener("click", header);
 
-            // for header responsive icon
             function header() {
                 var className = document.getElementById(this.id).className;
                 if(className === 'icon icon-search' ) {
diff --git a/packages/Webkul/Shop/src/Resources/views/products/index.blade.php b/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
index fa3a1c718..6a5fb2d81 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
@@ -23,7 +23,7 @@
                 </div>
 
                 <?php $products = $productRepository->findAllByCategory($category->id); ?>
-                
+
                 @if ($products->count())
 
                     @include ('shop::products.list.toolbar')
@@ -69,9 +69,11 @@
         $(document).ready(function() {
             var sort = document.getElementById("sort");
             var filter = document.getElementById("filter");
-            var sortLimit = document.getElementsByClassName('reponsive-sorter-limiter')[0];
+            var sortLimit = document.getElementsByClassName('pager')[0];
             var layerFilter = document.getElementsByClassName('responsive-layred-filter')[0];
 
+            layerFilter.style.display ="none";
+
             if(sort && filter) {
                 sort.addEventListener("click", sortFilter);
                 filter.addEventListener("click", sortFilter);
@@ -98,6 +100,8 @@
                     sort.classList.add("sort-icon");
 
                     layerFilter.style.display = "block";
+                    layerFilter.style.marginTop = "10px";
+
                     sortLimit.style.display = "none";
                 } else {
                     sort.classList.remove("icon-menu-close-adj");
diff --git a/packages/Webkul/Shop/src/Resources/views/products/list/toolbar.blade.php b/packages/Webkul/Shop/src/Resources/views/products/list/toolbar.blade.php
index b93e40f6c..a0a3ee1de 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/list/toolbar.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/list/toolbar.blade.php
@@ -7,7 +7,12 @@
             {{ __('shop::app.products.pager-info', ['showing' => $products->firstItem() . '-' . $products->lastItem(), 'total' => $products->total()]) }}
         </span>
 
-        <span>Men</span>
+        <span> Men </span>
+
+        <span class="sort-filter">
+            <i class="icon sort-icon" id="sort" ></i>
+            <i class="icon filter-icon" id="filter"></i>
+        </span>
     </div>
 
     <div class="pager">
@@ -32,12 +37,6 @@
                     <i class="icon list-view-icon"></i>
                 </a>
             @endif
-
-            <div class="sort-filter">
-                <i class="icon sort-icon" id="sort" ></i>
-                <i class="icon filter-icon" id="filter"></i>
-            </div>
-
         </div>
 
         <div class="sorter">
@@ -76,41 +75,6 @@
 
 </div>
 
-<div class="reponsive-sorter-limiter mb-20">
-
-    <div class="sorter">
-        <label>{{ __('shop::app.products.sort-by') }}</label>
-
-        <select onchange="window.location.href = this.value">
-
-            @foreach ($toolbarHelper->getAvailableOrders() as $key => $order)
-
-                <option value="{{ $toolbarHelper->getOrderUrl($key) }}" {{ $toolbarHelper->isOrderCurrent($key) ? 'selected' : '' }}>
-                    {{ __('shop::app.products.' . $order) }}
-                </option>
-
-            @endforeach
-
-        </select>
-    </div>
-
-    <div class="limiter">
-        <label>{{ __('shop::app.products.show') }}</label>
-
-        <select onchange="window.location.href = this.value">
-
-            @foreach ($toolbarHelper->getAvailableLimits() as $limit)
-
-                <option value="{{ $toolbarHelper->getLimitUrl($limit) }}" {{ $toolbarHelper->isLimitCurrent($limit) ? 'selected' : '' }}>
-                    {{ $limit }}
-                </option>
-
-            @endforeach
-
-        </select>
-    </div>
-
-</div>
 
 <div class="responsive-layred-filter mb-20">
     <layered-navigation></layered-navigation>
diff --git a/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php b/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
index 9557e3956..fb2a19aff 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
@@ -10,17 +10,18 @@
         </div> --}}
 
         <div class="review-layouter mb-20">
+
             <div class="product-info">
+
                 <div class="product-image">
                     <img src="{{ bagisto_asset('images/jeans_big.jpg') }}" />
                 </div>
 
-                <div class="product-name">
+                <div class="product-name mt-20">
                     <span>{{ $product->name }}</span>
                 </div>
 
-                <div class="product-price">
-
+                <div class="product-price mt-10">
                     @inject ('priceHelper', 'Webkul\Product\Helpers\Price')
 
                     @if ($product->type == 'configurable')
@@ -33,26 +34,24 @@
                         @endif
                     @endif
 
-                    {{-- <span class="pro-price-not">
+                    {{--  <span class="pro-price-not">
                         <strike> $45.00 </strike>
                     </span>
 
-                    <span class="offer"> 10% Off </span> --}}
+                    <span class="offer"> 10% Off </span>  --}}
                 </div>
             </div>
 
             <div class="review-form">
                 <form method="POST" action="{{ route('shop.reviews.store', $product->id ) }}">
                     @csrf
-                    <div class="heading">
+                    <div class="heading mt-10">
                         <span>{{ __('shop::app.reviews.write-review') }}</span>
                     </div>
 
-                    <div class="rating">
-                        <span> {{ __('admin::app.customers.reviews.rating') }} </span>
-                    </div>
+                    <div class="rating mt-20">
+                        <div class="rating-title"> {{ __('admin::app.customers.reviews.rating') }} </div>
 
-                    <div class="stars">
                         <label class="star star-5" for="star-5" onclick="calculateRating(id)" id="1"></label>
 
                         <label class="star star-4" for="star-4" onclick="calculateRating(id)" id="2"></label>
@@ -63,35 +62,34 @@
 
                         <label class="star star-1" for="star-1" onclick="calculateRating(id)" id="5"></label>
 
-                        <input type="name" name="title" class="form-control" placeholder="{{ __('shop::app.reviews.review-title') }}">
-
                         <input type="hidden" id="rating" name="rating">
-
                     </div>
 
-                    <div class="write-review">
+                    <div>
+                        <input type="name" name="title" class="form-control" placeholder="{{ __('shop::app.reviews.review-title') }}">
+                    </div>
+
+                    <div class="write-review mt-20">
                         <div class="control-group">
                             <label for="review">{{ __('admin::app.customers.reviews.comment') }}</label>
                             <textarea name="comment">
-
                             </textarea>
                         </div>
                     </div>
 
-                    <div class="submit-button">
-                        <button type="submit" class="btn btn-lg btn-primary"> SUBMIT </button>
-                    </div>
+                    <a type="submit" class="btn btn-lg btn-primary">
+                        {{ __('shop::app.reviews.submit') }}
+                    </a>
+
                 </form>
-
             </div>
-        </div>
 
+        </div>
     </section>
 @endsection
 
 
 @push('scripts')
-
 <script>
 
     function calculateRating(id){
@@ -110,5 +108,4 @@
     }
 
 </script>
-
 @endpush
diff --git a/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php b/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
index e2e09c040..af63bede7 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
@@ -1,62 +1,60 @@
 @inject ('reviewHelper', 'Webkul\Product\Helpers\Review')
 @inject ('priceHelper', 'Webkul\Product\Helpers\Price')
-
-
+@section('page_title')
+    {{ __('shop::app.reviews.product-review-page-title') }} - {{ $product->name }}
+@endsection
 @extends('shop::layouts.master')
 @section('content-wrapper')
-    <section class="product-review">
+    <section class="review">
         <div class="category-breadcrumbs">
 
             <span class="breadcrumb">Home</span> > <span class="breadcrumb">Men</span> > <span class="breadcrumb">Slit Open Jeans</span>
 
         </div>
-        <div class="product-layouter">
+        <div class="review-layouter">
 
-            <div class="mixed-group">
-
-                <div class="single-image">
+            <div class="product-info">
+                <div class="product-image">
                     <img src="{{ bagisto_asset('images/jeans_big.jpg') }}" />
                 </div>
 
-                <div class="details">
-
-                    <div class="product-name">
-                        {{ $product->name }}
-                    </div>
-
-                    <div class="price">
-                        @if ($product->type == 'configurable')
-                            <span class="main-price">${{ core()->currency($priceHelper->getMinimalPrice($product)) }}</span>
-                        @else
-                            @if ($priceHelper->haveSpecialPrice($product))
-                                <span class="main-price">${{ core()->currency($priceHelper->getSpecialPrice($product)) }}</span>
-                            @else
-                                <span class="main-price">${{ core()->currency($product->price) }}</span>
-                            @endif
-                        @endif
-                        <span class="real-price">
-                            $25.00
-                        </span>
-                        <span class="discount">
-                            10% Off
-                        </span>
-                    </div>
-
+                <div class="product-name mt-20">
+                    <span>{{ $product->name }}</span>
                 </div>
 
+                <div class="product-price mt-10">
+                    @inject ('priceHelper', 'Webkul\Product\Helpers\Price')
+
+                    @if ($product->type == 'configurable')
+                        <span class="pro-price">{{ core()->currency($priceHelper->getMinimalPrice($product)) }}</span>
+                    @else
+                        @if ($priceHelper->haveSpecialPrice($product))
+                            <span class="pro-price">{{ core()->currency($priceHelper->getSpecialPrice($product)) }}</span>
+                        @else
+                            <span class="pro-price">{{ core()->currency($product->price) }}</span>
+                        @endif
+                    @endif
+
+                    {{--  <span class="pro-price-not">
+                        <strike> $45.00 </strike>
+                    </span>
+
+                    <span class="offer"> 10% Off </span>  --}}
+                </div>
             </div>
 
-            <div class="rating-reviews">
+            <div class="review-form">
+
+                <div class="heading mt-10">
+                    <span> {{ __('shop::app.reviews.rating-reviews') }} </span>
 
-                <div class="title-inline">
-                    <span>Ratings & {{ __('admin::app.customers.reviews.name') }}</span>
-                    <!-- <button class="btn btn-md btn-primary">Write Review</button> -->
                     <a href="{{ route('shop.reviews.create', $product->url_key) }}" class="btn btn-lg btn-primary right">Write Review</a>
                 </div>
 
-                <div class="overall">
+                <div class="ratings-reviews mt-35">
+
                     <div class="left-side">
-                        <span class="number">
+                        <span class="rate">
                             {{ $reviewHelper->getAverageRating($product) }}
                         </span>
 
@@ -66,56 +64,78 @@
                         </span>
                         @endfor
 
-                        <div class="total-reviews">
-                            {{ $reviewHelper->getTotalRating($product) }} {{ __('admin::app.customers.reviews.rating') }} & {{ $reviewHelper->getTotalReviews($product) }} {{ __('admin::app.customers.reviews.name') }}
+                        <div class="total-reviews mt-5">
+                            {{ $reviewHelper->getTotalRating($product) }} {{ __('admin::app.customers.reviews.rating') }} & {{ $reviewHelper->getTotalReviews($product) }} {{ __('admin::app.customers.reviews.title') }}
                         </div>
                     </div>
+
                     <div class="right-side">
                         @foreach($reviewHelper->getPercentageRating($product) as $key=>$count)
                         <div class="rater 5star">
-                            <div class="star" id={{$key}}star> Star</div>
-                            <div class="line-bar" >
+                            <div class="rate-number" id={{$key}}star></div>
+                            <div class="star-name">Star</div>
+                            <div class="line-bar">
                                 <div class="line-value" id="{{ $key }}"></div>
                             </div>
-                            <div class="percentage"> {{$count}}% </div>
+                            <div class="percentage">
+                                <span> {{$count}}% </span>
+                            </div>
                         </div>
 
                         <br/>
                         @endforeach
                     </div>
+
                 </div>
 
-                <div class="reviews">
-                    @foreach($reviewHelper->loadMore($product) as $review)
-                    <div class="review">
-                        <div class="title">
-                            {{ $review->title }}
-                        </div>
-                        <div class="stars">
-                            @for ($i = 1; $i <= $review->rating ; $i++)
-                                <span class="icon star-icon"></span>
-                            @endfor
-                        </div>
-                        <div class="message">
-                            {{ $review->comment }}
-                        </div>
-                        <div class="reviewer-details">
-                            <span class="by">
-                                {{ __('shop::app.products.by', ['name' => $review->customer->name]) }}
-                            </span>
-                            <span class="when">
-                                {{ core()->formatDate($review->created_at) }}
-                            </span>
-                        </div>
+                <div class="rating-reviews">
+                    {{--  <div class="rating-header">
+                        {{ __('shop::app.products.reviews-title') }}
+                    </div>  --}}
+
+                    <div class="reviews">
+
+                        @foreach ($reviewHelper->getReviews($product)->paginate(10) as $review)
+                            <div class="review">
+                                <div class="title">
+                                    {{ $review->title }}
+                                </div>
+
+                                <span class="stars">
+                                    @for ($i = 1; $i <= $review->rating; $i++)
+
+                                        <span class="icon star-icon"></span>
+
+                                    @endfor
+                                </span>
+
+                                <div class="message">
+                                    {{ $review->comment }}
+                                </div>
+
+                                <div class="reviewer-details">
+                                    <span class="by">
+                                        {{ __('shop::app.products.by', ['name' => $review->customer->name]) }},
+                                    </span>
+
+                                    <span class="when">
+                                        {{ core()->formatDate($review->created_at) }}
+                                    </span>
+                                </div>
+                            </div>
+                        @endforeach
+
+                        <a href="{{ route('shop.reviews.index', $product->url_key) }}" class="view-all">View All</a>
+
                     </div>
-                    @endforeach
-
-                    <div class="view-all" onclick="loadMore()">Load More</div>
                 </div>
 
+
+
             </div>
 
         </div>
+
     </section>
 @endsection
 
@@ -131,26 +151,20 @@
         <?php } ?>
 
         var i=5;
+
         for(var key in percentage){
-            width= percentage[key] * 1.58;
+            width= percentage[key] ;
             let id =key + 'star';
-            document.getElementById(key).style.width = width + "px";
+
+            document.getElementById(key).style.width = width + "%";
             document.getElementById(key).style.height = 4 + "px";
-            document.getElementById(id).innerHTML = i + '\xa0\xa0' + "star";
+            document.getElementById(id).innerHTML = i ;
             i--;
+
+            {{--  document.getElementById(id).innerHTML = i + '\xa0\xa0' + "star";  --}}
         }
-
     })();
 
-    function loadMore(){
-        var segment_str = window.location.pathname;
-        var segment_array = segment_str.split( '/' );
-        var last_segment = segment_array[segment_array.length - 1];
-        url = segment_str.slice(0, segment_str.lastIndexOf('/'));
-        project = url + "/" + (parseInt(last_segment)+1) ;
-        location.href = project;
-    }
-
 </script>
 
 @endpush
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/products/reviews/product.blade.php b/packages/Webkul/Shop/src/Resources/views/products/reviews/product.blade.php
deleted file mode 100644
index a22ec781a..000000000
--- a/packages/Webkul/Shop/src/Resources/views/products/reviews/product.blade.php
+++ /dev/null
@@ -1 +0,0 @@
-wevf bebv 
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
index 5a48e237e..f8e497ca3 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
@@ -14,7 +14,7 @@
         <!--<div class="category-breadcrumbs">
             <span class="breadcrumb">Home</span> > <span class="breadcrumb">Men</span> > <span class="breadcrumb">Slit Open Jeans</span>
         </div>-->
-        
+
         <div class="layouter">
             <form method="POST" action="{{ route('cart.add', $product->id) }}" @submit.prevent="onSubmit">
                 @csrf()
diff --git a/packages/Webkul/Tax/src/Http/Controllers/TaxCategoryController.php b/packages/Webkul/Tax/src/Http/Controllers/TaxCategoryController.php
index e000e6733..16d8a76f2 100644
--- a/packages/Webkul/Tax/src/Http/Controllers/TaxCategoryController.php
+++ b/packages/Webkul/Tax/src/Http/Controllers/TaxCategoryController.php
@@ -54,7 +54,7 @@ class TaxCategoryController extends Controller
      * @return void
      */
     public function __construct(
-        TaxCategory $taxCategory, 
+        TaxCategory $taxCategory,
         TaxRate $taxRate,
         TaxMap $taxMap
     )
@@ -165,16 +165,21 @@ class TaxCategoryController extends Controller
     }
 
     /**
-     * Destroy a tax category
+     * Remove the specified resource from storage.
      *
-     * @return mixed
+     * @param  int  $id
+     * @return \Illuminate\Http\Response
      */
+    public function destroy($id)
+    {
+        if($this->taxCategory->count() == 1) {
+            session()->flash('error', 'At least one tax category is required.');
+        } else {
+            $this->taxCategorye->delete($id);
 
-    public function destroy($id) {
-        if($this->taxCategory()->delete($id)) {
-            session()->flash('success', 'The tax category is successfully deleted');
-
-            return redirect()->back();
+            session()->flash('success', 'Tax category deleted successfully.');
         }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Tax/src/Http/Controllers/TaxController.php b/packages/Webkul/Tax/src/Http/Controllers/TaxController.php
index 95c4c0acb..1372806b9 100644
--- a/packages/Webkul/Tax/src/Http/Controllers/TaxController.php
+++ b/packages/Webkul/Tax/src/Http/Controllers/TaxController.php
@@ -86,7 +86,4 @@ class TaxController extends Controller
     {
         return view($this->_config['view']);
     }
-
-
-
 }
\ No newline at end of file
diff --git a/packages/Webkul/Tax/src/Http/Controllers/TaxRateController.php b/packages/Webkul/Tax/src/Http/Controllers/TaxRateController.php
index 67efe7f7c..7e920dca3 100644
--- a/packages/Webkul/Tax/src/Http/Controllers/TaxRateController.php
+++ b/packages/Webkul/Tax/src/Http/Controllers/TaxRateController.php
@@ -152,6 +152,25 @@ class TaxRateController extends Controller
             return redirect()->back();
         }
 
+        return redirect()->back();
+    }
+
+      /**
+     * Remove the specified resource from storage.
+     *
+     * @param  int  $id
+     * @return \Illuminate\Http\Response
+     */
+    public function destroy($id)
+    {
+        if($this->taxRate->count() == 1) {
+            session()->flash('error', 'At least one tax rate is required.');
+        } else {
+            $this->taxRate->delete($id);
+
+            session()->flash('success', 'Tax rate deleted successfully.');
+        }
+
         return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/app.scss b/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
index 6dfcdb113..6c17b8aac 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
@@ -880,9 +880,7 @@ h2 {
     height: 48px;
     display: inline-block;
     box-sizing: border-box;
-    position: absolute;
-    margin-left: 18.5%;
-    margin-top: 15%;
+    position: relative;
 }
 
 .cp-round:before {
@@ -916,7 +914,6 @@ h2 {
     top: 0;
     left: 0;
     animation: spin 1s ease-in-out infinite;
-
 }
 
 @keyframes spin {
diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css
index 0f83ae4b0..8e8d73929 100644
--- a/public/themes/default/assets/css/shop.css
+++ b/public/themes/default/assets/css/shop.css
@@ -127,17 +127,10 @@
   height: 18px;
 }
 
-@media only screen and (max-width: 425px) {
-  .product-card {
-    font-size: 90%;
-  }
-  .product-card .btn.btn-md {
-    padding: 5px;
-  }
-  .product-grid-4 {
-    grid-template-columns: 48.5% 48.5%;
-    grid-column-gap: 10px;
-  }
+.icon-menu-close-adj {
+  background-image: url("../images/cross-icon-adj.svg");
+  width: 32px;
+  height: 32px;
 }
 
 .add-to-wishlist .wishlist-icon:hover {
@@ -387,143 +380,6 @@ body {
   margin-top: 90px;
 }
 
-@media only screen and (max-width: 551px) {
-  .product-grid-3 {
-    grid-template-columns: 48.5% 48.5%;
-    grid-column-gap: 20px;
-  }
-}
-
-@media only screen and (max-width: 840px) {
-  .layered-filter-wrapper {
-    display: none;
-  }
-  .main .category-block {
-    width: 100% !important;
-  }
-  .main .category-block .top-toolbar {
-    border-bottom: 1px solid #C7C7C7;
-  }
-  .main .category-block .top-toolbar .page-info span:first-child {
-    display: none;
-  }
-  .main .category-block .top-toolbar .page-info span:last-child {
-    display: inline;
-  }
-  .main .category-block .top-toolbar .pager .view-mode {
-    margin-right: 0px;
-  }
-  .main .category-block .top-toolbar .pager .view-mode .grid-view, .main .category-block .top-toolbar .pager .view-mode .list-view {
-    display: none;
-  }
-  .main .category-block .top-toolbar .pager .view-mode .sort-filter {
-    cursor: pointer;
-    display: inline-block;
-    margin-top: 10px;
-  }
-  .main .category-block .top-toolbar .pager .sorter, .main .category-block .top-toolbar .pager .limiter {
-    display: none;
-  }
-  .main .category-block .reponsive-sorter-limiter {
-    display: none;
-  }
-  .main .category-block .reponsive-sorter-limiter select {
-    background: #FFFFFF;
-    border: 1px solid #C7C7C7;
-    border-radius: 3px;
-    color: #242424;
-    padding: 10px;
-  }
-}
-
-.layered-filter-wrapper {
-  width: 25%;
-  float: left;
-  padding-right: 20px;
-  min-height: 1px;
-}
-
-.layered-filter-wrapper .filter-title {
-  border-bottom: 1px solid #C7C7C7;
-  color: #242424;
-  padding: 10px 0;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item {
-  border-bottom: 1px solid #C7C7C7;
-  padding-bottom: 10px;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-title {
-  padding: 10px 40px 0 10px;
-  color: #5E5E5E;
-  cursor: pointer;
-  position: relative;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-title .remove-filter-link {
-  font-weight: 400;
-  color: #0031F0;
-  margin-right: 10px;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-title .icon {
-  background-image: url("../images/arrow-down.svg") !important;
-  width: 10px;
-  height: 10px;
-  position: absolute;
-  right: 15px;
-  top: 14px;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content {
-  padding: 10px;
-  display: none;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items {
-  padding: 0;
-  margin: 0;
-  list-style: none none;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item {
-  padding: 8px 0;
-  color: #5E5E5E;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox {
-  margin: 0;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox .checkbox-view {
-  height: 16px;
-  width: 16px;
-  background-image: url("../images/checkbox.svg");
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox input:checked + .checkbox-view {
-  background-image: url("../images/checkbox-checked.svg");
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content .price-range-wrapper {
-  margin-top: 21px;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item.active .filter-attributes-content {
-  display: block;
-}
-
-.layered-filter-wrapper .filter-attributes .filter-attributes-item.active .filter-attributes-title .icon {
-  background-image: url("../images//arrow-up.svg") !important;
-}
-
-.responsive-layred-filter {
-  width: 100%;
-  float: none;
-  padding-right: 0px;
-}
-
 .main-container-wrapper {
   max-width: 1300px;
   width: auto;
@@ -552,6 +408,13 @@ body {
   grid-auto-rows: auto;
 }
 
+@media only screen and (max-width: 551px) {
+  .main-container-wrapper .product-grid-3 {
+    grid-template-columns: 48.5% 48.5%;
+    grid-column-gap: 20px;
+  }
+}
+
 @media only screen and (max-width: 854px) {
   .main-container-wrapper .product-grid-4 {
     grid-template-columns: 29.5% 29.5% 29.5%;
@@ -646,6 +509,19 @@ body {
   background: #2ED04C;
 }
 
+@media only screen and (max-width: 425px) {
+  .main-container-wrapper .product-card {
+    font-size: 90%;
+  }
+  .main-container-wrapper .product-card .btn.btn-md {
+    padding: 5px;
+  }
+  .main-container-wrapper .product-grid-4 {
+    grid-template-columns: 48.5% 48.5%;
+    grid-column-gap: 10px;
+  }
+}
+
 .main-container-wrapper .product-list {
   min-height: 200px;
 }
@@ -1323,13 +1199,40 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
   border-top: 1px solid #C7C7C7;
 }
 
-.header .responsive-nav {
-  display: none;
-}
-
 @media all and (max-width: 720px) {
-  .header-bottom {
-    display: none !important;
+  .header .header-bottom {
+    height: auto;
+    display: none;
+  }
+  .header .header-bottom .nav a {
+    display: inline-block;
+  }
+  .header .header-bottom ul.nav, .header .header-bottom .nav li {
+    height: auto;
+  }
+  .header .header-bottom .nav > li {
+    float: none;
+  }
+  .header .header-bottom .nav li > .icon {
+    float: right;
+    display: block;
+  }
+  .header .header-bottom .nav li .left {
+    height: 16px;
+    width: 16px;
+  }
+  .header .header-bottom .nav li a > .icon {
+    display: none;
+  }
+  .header .header-bottom .nav ul {
+    position: unset;
+    border: none;
+    -webkit-box-shadow: none;
+            box-shadow: none;
+  }
+  .header .header-bottom .nav > li li:hover > ul {
+    margin-left: 0px;
+    top: 0px;
   }
   ul.search-container {
     display: none !important;
@@ -1345,42 +1248,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
     display: -ms-flexbox !important;
     display: flex !important;
   }
-  .responsive-nav {
-    margin-top: 20px;
-    display: none;
-  }
-  .responsive-nav .nav a {
-    display: inline-block;
-    color: #242424;
-    text-decoration: none;
-    padding: 12px 4.8px 12px 8px;
-    text-transform: uppercase;
-    letter-spacing: 2px;
-  }
-  .responsive-nav .nav li > .icon {
-    float: right;
-  }
-  .responsive-nav .nav li a > .icon {
-    display: none;
-  }
-  .responsive-nav .nav > li {
-    border-bottom: 1px solid #C7C7C7;
-  }
-  .responsive-nav .nav li ul {
-    padding-left: 30px;
-  }
-  .responsive-nav .nav li:first-child {
-    border-top: 1px solid #C7C7C7;
-  }
-  .responsive-nav .nav > li:last-child {
-    float: none;
-    height: 45px;
-    display: none;
-    border: none;
-  }
-  .responsive-nav .nav > li:last-child img {
-    margin-right: 6px;
-  }
 }
 
 .footer {
@@ -1466,6 +1333,95 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
   width: 100%;
 }
 
+.main .category-container .layered-filter-wrapper, .main .category-container .responsive-layred-filter {
+  width: 25%;
+  float: left;
+  padding-right: 20px;
+  min-height: 1px;
+}
+
+.main .category-container .layered-filter-wrapper .filter-title, .main .category-container .responsive-layred-filter .filter-title {
+  border-bottom: 1px solid #C7C7C7;
+  color: #242424;
+  padding: 10px 0;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item {
+  border-bottom: 1px solid #C7C7C7;
+  padding-bottom: 10px;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-title, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-title {
+  padding: 10px 40px 0 10px;
+  color: #5E5E5E;
+  cursor: pointer;
+  position: relative;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-title .remove-filter-link, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-title .remove-filter-link {
+  font-weight: 400;
+  color: #0031F0;
+  margin-right: 10px;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-title .icon, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-title .icon {
+  background-image: url("../images/arrow-down.svg") !important;
+  width: 10px;
+  height: 10px;
+  position: absolute;
+  right: 15px;
+  top: 14px;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-content {
+  padding: 10px;
+  display: none;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-content ol.items {
+  padding: 0;
+  margin: 0;
+  list-style: none none;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item {
+  padding: 8px 0;
+  color: #5E5E5E;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox {
+  margin: 0;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox .checkbox-view, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox .checkbox-view {
+  height: 16px;
+  width: 16px;
+  background-image: url("../images/checkbox.svg");
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox input:checked + .checkbox-view, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item .checkbox input:checked + .checkbox-view {
+  background-image: url("../images/checkbox-checked.svg");
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content .price-range-wrapper, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item .filter-attributes-content .price-range-wrapper {
+  margin-top: 21px;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item.active .filter-attributes-content, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item.active .filter-attributes-content {
+  display: block;
+}
+
+.main .category-container .layered-filter-wrapper .filter-attributes .filter-attributes-item.active .filter-attributes-title .icon, .main .category-container .responsive-layred-filter .filter-attributes .filter-attributes-item.active .filter-attributes-title .icon {
+  background-image: url("../images//arrow-up.svg") !important;
+}
+
+.main .category-container .responsive-layred-filter {
+  display: none;
+  width: 100%;
+  float: none;
+  padding-right: 0px;
+}
+
 .main .category-container .category-block {
   width: 80%;
   display: block;
@@ -1494,12 +1450,12 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
   line-height: 45px;
 }
 
-.main .top-toolbar .page-info span:first-child {
-  display: inline;
+.main .top-toolbar .page-info span {
+  display: none;
 }
 
-.main .top-toolbar .page-info span:last-child {
-  display: none;
+.main .top-toolbar .page-info span:first-child {
+  display: inline;
 }
 
 .main .top-toolbar .pager {
@@ -1545,14 +1501,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
   display: inline-block;
 }
 
-.main .reponsive-sorter-limiter {
-  display: none;
-}
-
-.main .responsive-layred-filter {
-  display: none;
-}
-
 .main .bottom-toolbar {
   display: block;
   margin-top: 40px;
@@ -1560,6 +1508,48 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
   text-align: center;
 }
 
+@media only screen and (max-width: 840px) {
+  .main .layered-filter-wrapper, .main .category-container .responsive-layred-filter {
+    display: none;
+  }
+  .main .category-block {
+    width: 100% !important;
+  }
+  .main .category-block .top-toolbar {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+  }
+  .main .category-block .top-toolbar .page-info {
+    border-bottom: 1px solid #C7C7C7;
+    line-height: 15px;
+  }
+  .main .category-block .top-toolbar .page-info span {
+    display: inline;
+  }
+  .main .category-block .top-toolbar .page-info span:first-child {
+    display: none;
+  }
+  .main .category-block .top-toolbar .page-info .sort-filter {
+    float: right;
+    cursor: pointer;
+  }
+  .main .category-block .top-toolbar .pager {
+    margin-top: 20px;
+    display: none;
+  }
+  .main .category-block .top-toolbar .pager .view-mode {
+    display: none;
+  }
+  .main .category-block .responsive-layred-filter {
+    display: block;
+  }
+}
+
 section.product-detail {
   color: #242424;
 }
@@ -2347,10 +2337,6 @@ section.cart .cart-content .right-side {
   margin-right: auto;
 }
 
-section.review {
-  color: #242424;
-}
-
 section.review .category-breadcrumbs {
   display: inline;
 }
@@ -2359,42 +2345,30 @@ section.review .review-layouter {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -webkit-box-orient: horizontal;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: row;
-          flex-direction: row;
+}
+
+section.review .review-layouter .product-info {
+  font-size: 24px;
 }
 
 section.review .review-layouter .product-info .product-image img {
-  display: block;
   height: 280px;
   width: 280px;
 }
 
-section.review .review-layouter .product-info .product-name {
-  margin-top: 20px;
-}
-
-section.review .review-layouter .product-info .product-name span {
-  font-size: 24px;
-}
-
-section.review .review-layouter .product-info .product-price {
-  margin-top: 10px;
-}
-
 section.review .review-layouter .product-info .product-price .pro-price {
-  font-size: 24px;
   color: #FF6472;
 }
 
 section.review .review-layouter .product-info .product-price .pro-price-not {
   margin-left: 10px;
+  font-size: 16px;
   color: #A5A5A5;
 }
 
 section.review .review-layouter .product-info .product-price .offer {
   margin-left: 10px;
+  font-size: 16px;
 }
 
 section.review .review-layouter .review-form {
@@ -2403,69 +2377,44 @@ section.review .review-layouter .review-form {
 }
 
 section.review .review-layouter .review-form .heading {
-  margin-top: 10px;
+  color: #242424;
+  font-weight: 600;
 }
 
-section.review .review-layouter .review-form .heading .btn.btn-primary.right {
+section.review .review-layouter .review-form .heading .right {
   float: right;
   margin-top: -10px;
 }
 
 section.review .review-layouter .review-form .rating {
-  margin-top: 25px;
   color: #A5A5A5;
 }
 
-section.review .review-layouter .review-form .rating span {
-  display: inline;
-}
-
-section.review .review-layouter .review-form .stars {
-  width: 270px;
-  display: inline-block;
-}
-
-section.review .review-layouter .review-form .stars label.star {
-  font-size: 36px;
+section.review .review-layouter .review-form .rating label.star {
+  font-size: 25px;
   color: #d4d4d4;
   -webkit-transition: all .2s;
   transition: all .2s;
 }
 
-section.review .review-layouter .review-form .stars label.star:before {
+section.review .review-layouter .review-form .rating label.star:before {
   content: '\2605';
 }
 
-section.review .review-layouter .review-form .write-review {
-  margin-top: 25px;
+section.review .review-layouter .review-form .write-review label {
+  color: #A5A5A5;
+  font-size: 16px;
 }
 
-section.review .review-layouter .review-form .write-review .control-group {
-  margin-bottom: 0px;
-}
-
-section.review .review-layouter .review-form .write-review .control-group textarea {
+section.review .review-layouter .review-form .write-review textarea {
   margin-top: 5px;
   border: 2px solid #C7C7C7;
+  color: #A5A5A5;
   border-radius: 3px;
-  width: 600px;
+  width: 90%;
   height: 120px;
 }
 
-section.review .review-layouter .review-form .submit-button {
-  margin-top: 10px;
-}
-
-section.review .review-layouter .review-form .submit-button button {
-  background: #0031F0;
-  font-size: 14px;
-  color: #F2F2F2;
-  text-align: center;
-  width: 120px;
-  height: 38px;
-  border: none;
-}
-
 section.review .review-layouter .review-form .review-detail {
   height: 150px;
   border: 1px solid firebrick;
@@ -2495,6 +2444,122 @@ section.review .review-layouter .review-form .review-detail .rating-calculate .p
   border: 1px solid blue;
 }
 
+section.review .review-layouter .ratings-reviews {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+}
+
+section.review .review-layouter .ratings-reviews .left-side {
+  padding: 40px 20px 40px 20px;
+  width: 50%;
+}
+
+section.review .review-layouter .ratings-reviews .left-side .rate {
+  font-size: 34px;
+}
+
+section.review .review-layouter .ratings-reviews .left-side .stars.icon {
+  height: 16px;
+  width: 16px;
+}
+
+section.review .review-layouter .ratings-reviews .right-side {
+  width: 50%;
+}
+
+section.review .review-layouter .ratings-reviews .right-side .rater {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  padding-top: 5px;
+  width: 100%;
+}
+
+section.review .review-layouter .ratings-reviews .right-side .rater .star-name {
+  margin-right: 5px;
+}
+
+section.review .review-layouter .ratings-reviews .right-side .rater .rate-number {
+  width: 15px;
+}
+
+section.review .review-layouter .ratings-reviews .right-side .rater .percentage {
+  width: 15%;
+  margin-right: 10px;
+}
+
+section.review .review-layouter .ratings-reviews .right-side .rater .percentage span {
+  float: right;
+  white-space: nowrap;
+}
+
+section.review .review-layouter .ratings-reviews .right-side .rater .line-bar {
+  height: 4px;
+  width: 65%;
+  margin-right: 5px;
+  background: #D8D8D8;
+}
+
+section.review .review-layouter .ratings-reviews .right-side .rater .line-bar .line-value {
+  background-color: #0031F0;
+}
+
+@media only screen and (max-width: 770px) {
+  section.review .category-breadcrumbs {
+    display: none;
+  }
+  section.review .review-layouter {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+  }
+  section.review .review-layouter .product-info .product-image {
+    max-width: 280px;
+    margin-left: auto;
+    margin-right: auto;
+  }
+  section.review .review-layouter .review-form {
+    width: 100%;
+    margin-left: 0px;
+  }
+  section.review .review-layouter .review-form .heading .right {
+    margin-top: 50px;
+  }
+  section.review .review-layouter .review-form .ratings-reviews {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    width: 100%;
+  }
+  section.review .review-layouter .review-form .ratings-reviews .left-side {
+    width: 100%;
+    padding: 0px 0px 40px 0px;
+    margin-top: -50px;
+  }
+  section.review .review-layouter .review-form .ratings-reviews .right-side {
+    width: 100%;
+  }
+  section.review .review-layouter .review-form .ratings-reviews .right-side .rater .line-bar {
+    width: 100%;
+  }
+  section.review .review-layouter .review-form .ratings-reviews .right-side .rater .percentage {
+    width: 10%;
+    margin-right: 0px;
+  }
+}
+
 .auth-content {
   padding-top: 15%;
   padding-bottom: 15%;
@@ -2651,6 +2716,80 @@ section.review .review-layouter .review-form .review-detail .rating-calculate .p
   margin-bottom: 20px;
 }
 
+.account-content .account-layout .account-head .back-icon {
+  display: none;
+}
+
+@media only screen and (max-width: 770px) {
+  .account-content {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+  }
+  .account-content .account-side-menu {
+    display: none;
+    width: 100%;
+    border: none;
+  }
+  .account-content .account-side-menu li {
+    margin-left: 0%;
+    width: 100%;
+  }
+  .account-content .account-side-menu li a {
+    color: #242424;
+  }
+  .account-content .responsive-side-menu {
+    cursor: pointer;
+    padding-top: 13px;
+    display: block;
+    height: 46px;
+    border-bottom: 1px solid #C7C7C7;
+    border-top: 1px solid #C7C7C7;
+  }
+  .account-content .responsive-side-menu .right {
+    float: right;
+  }
+  .account-content .account-layout {
+    margin-left: 0%;
+    margin-top: 20px;
+  }
+  .account-content .account-layout .account-head {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-pack: justify;
+        -ms-flex-pack: justify;
+            justify-content: space-between;
+    border-bottom: 1px solid #C7C7C7;
+    border-top: 1px solid #C7C7C7;
+    height: 46px;
+  }
+  .account-content .account-layout .account-head .back-icon {
+    display: block;
+  }
+  .account-content .account-layout .account-head span {
+    margin-top: 12px;
+    font-size: 18px;
+  }
+  .account-content .account-layout .account-head .horizontal-rule {
+    display: none;
+  }
+  .account-content .account-layout .account-table-content {
+    margin-top: 2%;
+  }
+  .account-content .account-layout .account-table-content table tbody tr {
+    display: grid;
+    margin-bottom: 20px;
+  }
+  .account-content .account-items-list, .account-content .edit-form {
+    margin-top: 20px;
+  }
+  .account-content .control-group .control {
+    width: 100%;
+  }
+}
+
 .account-table-content {
   color: #242424;
   margin-top: 1.4%;
@@ -2735,6 +2874,10 @@ section.review .review-layouter .review-form .review-detail .rating-calculate .p
   display: block;
 }
 
+.sale-container .sale-section .section-content .responsive-table {
+  display: none;
+}
+
 .sale-container .totals {
   padding-top: 20px;
   display: inline-block;
@@ -2762,3 +2905,61 @@ section.review .review-layouter .review-form .review-detail .rating-calculate .p
 .sale-container .totals .sale-summary tr.border td {
   border-bottom: 1px solid #C7C7C7;
 }
+
+@media only screen and (max-width: 770px) {
+  .sale-container .sale-section .section-content .row {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+  }
+  .sale-container .sale-section .section-content .row .title {
+    line-height: 20px;
+  }
+  .sale-container .sale-section .section-content .table {
+    display: none;
+  }
+  .sale-container .sale-section .section-content .responsive-table {
+    border: 1px solid #C7C7C7;
+    margin-top: 5px;
+    width: 100%;
+    display: block;
+  }
+  .sale-container .sale-section .section-content .responsive-table tbody td {
+    padding: 8px 5px;
+  }
+  .sale-container .sale-section .section-content .responsive-table tbody td:first-child {
+    width: 25%;
+  }
+  .sale-container .sale-section .section-content .responsive-table tbody td:last-child {
+    padding-left: 10px;
+  }
+  .sale-container .sale-section .section-content .totals .sale-summary {
+    width: 100%;
+  }
+  .sale-container .sale-section .section-content .totals .sale-summary tr td:nth-child(2) {
+    display: none;
+  }
+  .sale-container .sale-section .section-content .order-box-container {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+  }
+  .sale-container .sale-section .section-content .order-box-container .box {
+    width: 100%;
+    margin: 10px auto;
+  }
+}
+
+.cp-spinner {
+  margin-left: 46%;
+  margin-top: 35%;
+  margin-bottom: 35%;
+}
diff --git a/public/themes/default/assets/js/shop.js b/public/themes/default/assets/js/shop.js
index 591136098..49eaf6622 100644
--- a/public/themes/default/assets/js/shop.js
+++ b/public/themes/default/assets/js/shop.js
@@ -11535,7 +11535,7 @@ return jQuery;
 
 "use strict";
 /* WEBPACK VAR INJECTION */(function(global, setImmediate) {/*!
- * Vue.js v2.5.16
+ * Vue.js v2.5.17
  * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
@@ -16624,7 +16624,7 @@ Object.defineProperty(Vue, 'FunctionalRenderContext', {
   value: FunctionalRenderContext
 });
 
-Vue.version = '2.5.16';
+Vue.version = '2.5.17';
 
 /*  */
 
@@ -30880,7 +30880,7 @@ var render = function() {
           class: [
             _vm.show
               ? "icon icon-arrow-down mt-15"
-              : "icon dropdown-right-icon mt-15"
+              : "icon dropdown-right-icon left mt-15"
           ],
           on: { click: _vm.showOrHide }
         })
@@ -31506,7 +31506,7 @@ if (false) {
 /* 50 */
 /***/ (function(module, exports, __webpack_require__) {
 
-!function(t,e){ true?module.exports=e():"function"==typeof define&&define.amd?define("vue-slider-component",[],e):"object"==typeof exports?exports["vue-slider-component"]=e():t["vue-slider-component"]=e()}(this,function(){return function(t){function e(s){if(i[s])return i[s].exports;var r=i[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var i={};return e.m=t,e.c=i,e.i=function(t){return t},e.d=function(t,i,s){e.o(t,i)||Object.defineProperty(t,i,{configurable:!1,enumerable:!0,get:s})},e.n=function(t){var i=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(i,"a",i),i},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=2)}([function(t,e,i){i(7);var s=i(5)(i(1),i(6),null,null);t.exports=s.exports},function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=function(){var t="undefined"!=typeof window?window.devicePixelRatio||1:1;return function(e){return Math.round(e*t)/t}}();e.default={name:"VueSliderComponent",props:{width:{type:[Number,String],default:"auto"},height:{type:[Number,String],default:6},data:{type:Array,default:null},dotSize:{type:Number,default:16},dotWidth:{type:Number,required:!1},dotHeight:{type:Number,required:!1},min:{type:Number,default:0},max:{type:Number,default:100},interval:{type:Number,default:1},show:{type:Boolean,default:!0},disabled:{type:[Boolean,Array],default:!1},piecewise:{type:Boolean,default:!1},tooltip:{type:[String,Boolean],default:"always"},eventType:{type:String,default:"auto"},direction:{type:String,default:"horizontal"},reverse:{type:Boolean,default:!1},lazy:{type:Boolean,default:!1},clickable:{type:Boolean,default:!0},speed:{type:Number,default:.5},realTime:{type:Boolean,default:!1},stopPropagation:{type:Boolean,default:!1},value:{type:[String,Number,Array,Object],default:0},piecewiseLabel:{type:Boolean,default:!1},debug:{type:Boolean,default:!0},fixed:{type:Boolean,default:!1},processDragable:{type:Boolean,default:!1},useKeyboard:{type:Boolean,default:!1},actionsKeyboard:{type:Array,default:function(){return[function(t){return t-1},function(t){return t+1}]}},tooltipMerge:{type:Boolean,default:!0},startAnimation:{type:Boolean,default:!1},sliderStyle:[Array,Object,Function],focusStyle:[Array,Object,Function],tooltipDir:[Array,String],formatter:[String,Function],mergeFormatter:[String,Function],piecewiseStyle:Object,disabledStyle:Object,piecewiseActiveStyle:Object,processStyle:Object,bgStyle:Object,tooltipStyle:[Array,Object,Function],disabledDotStyle:[Array,Object,Function],labelStyle:Object,labelActiveStyle:Object},data:function(){return{flag:!1,keydownFlag:null,focusFlag:!1,processFlag:!1,processSign:null,size:0,fixedValue:0,focusSlider:0,currentValue:0,currentSlider:0,isComponentExists:!0,isMounted:!1}},computed:{dotWidthVal:function(){return"number"==typeof this.dotWidth?this.dotWidth:this.dotSize},dotHeightVal:function(){return"number"==typeof this.dotHeight?this.dotHeight:this.dotSize},flowDirection:function(){return"vue-slider-"+this.direction+(this.reverse?"-reverse":"")},tooltipMergedPosition:function(){if(!this.isMounted)return{};var t=this.tooltipDirection[0];if(this.$refs.dot0){if("vertical"===this.direction){var e={};return e[t]="-"+(this.dotHeightVal/2-this.width/2+9)+"px",e}var i={};return i[t]="-"+(this.dotWidthVal/2-this.height/2+9)+"px",i.left="50%",i}},tooltipDirection:function(){var t=this.tooltipDir||("vertical"===this.direction?"left":"top");return Array.isArray(t)?this.isRange?t:t[1]:this.isRange?[t,t]:t},tooltipStatus:function(){return"hover"===this.tooltip&&this.flag?"vue-slider-always":this.tooltip?"vue-slider-"+this.tooltip:""},tooltipClass:function(){return["vue-slider-tooltip-"+this.tooltipDirection,"vue-slider-tooltip"]},disabledArray:function(){return Array.isArray(this.disabled)?this.disabled:[this.disabled,this.disabled]},boolDisabled:function(){return this.disabledArray.every(function(t){return!0===t})},isDisabled:function(){return"none"===this.eventType||this.boolDisabled},disabledClass:function(){return this.boolDisabled?"vue-slider-disabled":""},stateClass:function(){return{"vue-slider-state-process-drag":this.processFlag,"vue-slider-state-drag":this.flag&&!this.processFlag&&!this.keydownFlag,"vue-slider-state-focus":this.focusFlag}},isRange:function(){return Array.isArray(this.value)},slider:function(){return this.isRange?[this.$refs.dot0,this.$refs.dot1]:this.$refs.dot},minimum:function(){return this.data?0:this.min},val:{get:function(){return this.data?this.isRange?[this.data[this.currentValue[0]],this.data[this.currentValue[1]]]:this.data[this.currentValue]:this.currentValue},set:function(t){if(this.data)if(this.isRange){var e=this.data.indexOf(t[0]),i=this.data.indexOf(t[1]);e>-1&&i>-1&&(this.currentValue=[e,i])}else{var s=this.data.indexOf(t);s>-1&&(this.currentValue=s)}else this.currentValue=t}},currentIndex:function(){return this.isRange?this.data?this.currentValue:[this.getIndexByValue(this.currentValue[0]),this.getIndexByValue(this.currentValue[1])]:this.getIndexByValue(this.currentValue)},indexRange:function(){return this.isRange?this.currentIndex:[0,this.currentIndex]},maximum:function(){return this.data?this.data.length-1:this.max},multiple:function(){var t=(""+this.interval).split(".")[1];return t?Math.pow(10,t.length):1},spacing:function(){return this.data?1:this.interval},total:function(){return this.data?this.data.length-1:(Math.floor((this.maximum-this.minimum)*this.multiple)%(this.interval*this.multiple)!=0&&this.printError("Prop[interval] is illegal, Please make sure that the interval can be divisible"),(this.maximum-this.minimum)/this.interval)},gap:function(){return this.size/this.total},position:function(){return this.isRange?[(this.currentValue[0]-this.minimum)/this.spacing*this.gap,(this.currentValue[1]-this.minimum)/this.spacing*this.gap]:(this.currentValue-this.minimum)/this.spacing*this.gap},limit:function(){return this.isRange?this.fixed?[[0,(this.total-this.fixedValue)*this.gap],[this.fixedValue*this.gap,this.size]]:[[0,this.position[1]],[this.position[0],this.size]]:[0,this.size]},valueLimit:function(){return this.isRange?this.fixed?[[this.minimum,this.maximum-this.fixedValue*(this.spacing*this.multiple)/this.multiple],[this.minimum+this.fixedValue*(this.spacing*this.multiple)/this.multiple,this.maximum]]:[[this.minimum,this.currentValue[1]],[this.currentValue[0],this.maximum]]:[this.minimum,this.maximum]},idleSlider:function(){return 0===this.currentSlider?1:0},wrapStyles:function(){return"vertical"===this.direction?{height:"number"==typeof this.height?this.height+"px":this.height,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}:{width:"number"==typeof this.width?this.width+"px":this.width,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}},sliderStyles:function(){return Array.isArray(this.sliderStyle)?this.isRange?this.sliderStyle:this.sliderStyle[1]:"function"==typeof this.sliderStyle?this.sliderStyle(this.val,this.currentIndex):this.isRange?[this.sliderStyle,this.sliderStyle]:this.sliderStyle},focusStyles:function(){return Array.isArray(this.focusStyle)?this.isRange?this.focusStyle:this.focusStyle[1]:"function"==typeof this.focusStyle?this.focusStyle(this.val,this.currentIndex):this.isRange?[this.focusStyle,this.focusStyle]:this.focusStyle},disabledDotStyles:function(){var t=this.disabledDotStyle;if(Array.isArray(t))return t;if("function"==typeof t){var e=t(this.val,this.currentIndex);return Array.isArray(e)?e:[e,e]}return t?[t,t]:[{backgroundColor:"#ccc"},{backgroundColor:"#ccc"}]},tooltipStyles:function(){return Array.isArray(this.tooltipStyle)?this.isRange?this.tooltipStyle:this.tooltipStyle[1]:"function"==typeof this.tooltipStyle?this.tooltipStyle(this.val,this.currentIndex):this.isRange?[this.tooltipStyle,this.tooltipStyle]:this.tooltipStyle},elemStyles:function(){return"vertical"===this.direction?{width:this.width+"px",height:"100%"}:{height:this.height+"px"}},dotStyles:function(){return"vertical"===this.direction?{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",left:-(this.dotWidthVal-this.width)/2+"px"}:{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",top:-(this.dotHeightVal-this.height)/2+"px"}},piecewiseDotStyle:function(){return"vertical"===this.direction?{width:this.width+"px",height:this.width+"px"}:{width:this.height+"px",height:this.height+"px"}},piecewiseDotWrap:function(){if(!this.piecewise&&!this.piecewiseLabel)return!1;for(var t=[],e=0;e<=this.total;e++){var i="vertical"===this.direction?{bottom:this.gap*e-this.width/2+"px",left:0}:{left:this.gap*e-this.height/2+"px",top:0},s=this.reverse?this.total-e:e,r=this.data?this.data[s]:this.spacing*s+this.min;t.push({style:i,label:this.formatter?this.formatting(r):r,inRange:s>=this.indexRange[0]&&s<=this.indexRange[1]})}return t}},watch:{value:function(t){this.flag||this.setValue(t,!0)},max:function(t){if(t<this.min)return this.printError("The maximum value can not be less than the minimum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},min:function(t){if(t>this.max)return this.printError("The minimum value can not be greater than the maximum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},show:function(t){var e=this;t&&!this.size&&this.$nextTick(function(){e.refresh()})},fixed:function(){this.computedFixedValue()}},methods:{bindEvents:function(){document.addEventListener("touchmove",this.moving,{passive:!1}),document.addEventListener("touchend",this.moveEnd,{passive:!1}),document.addEventListener("mousedown",this.blurSlider),document.addEventListener("mousemove",this.moving),document.addEventListener("mouseup",this.moveEnd),document.addEventListener("mouseleave",this.moveEnd),document.addEventListener("keydown",this.handleKeydown),document.addEventListener("keyup",this.handleKeyup),window.addEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.addEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.addEventListener("transitionend",this.handleOverlapTooltip))},unbindEvents:function(){document.removeEventListener("touchmove",this.moving),document.removeEventListener("touchend",this.moveEnd),document.removeEventListener("mousedown",this.blurSlider),document.removeEventListener("mousemove",this.moving),document.removeEventListener("mouseup",this.moveEnd),document.removeEventListener("mouseleave",this.moveEnd),document.removeEventListener("keydown",this.handleKeydown),document.removeEventListener("keyup",this.handleKeyup),window.removeEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.removeEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.removeEventListener("transitionend",this.handleOverlapTooltip))},handleKeydown:function(t){if(!this.useKeyboard||!this.focusFlag)return!1;switch(t.keyCode){case 37:case 40:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[0]);break;case 38:case 39:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[1])}},handleKeyup:function(){this.keydownFlag&&(this.keydownFlag=!1,this.flag=!1)},changeFocusSlider:function(t){var e=this;if(this.isRange){var i=this.currentIndex.map(function(i,s){if(s===e.focusSlider||e.fixed){var r=t(i),o=e.fixed?e.valueLimit[s]:[0,e.total];if(r<=o[1]&&r>=o[0])return r}return i});i[0]>i[1]&&(this.focusSlider=0===this.focusSlider?1:0,i=i.reverse()),this.setIndex(i)}else this.setIndex(t(this.currentIndex))},blurSlider:function(t){var e=this.isRange?this.$refs["dot"+this.focusSlider]:this.$refs.dot;if(!e||e===t.target)return!1;this.focusFlag=!1},formatting:function(t){return"string"==typeof this.formatter?this.formatter.replace(/\{value\}/,t):this.formatter(t)},mergeFormatting:function(t,e){return"string"==typeof this.mergeFormatter?this.mergeFormatter.replace(/\{(value1|value2)\}/g,function(i,s){return"value1"===s?t:e}):this.mergeFormatter(t,e)},getPos:function(t){return this.realTime&&this.getStaticData(),"vertical"===this.direction?this.reverse?t.pageY-this.offset:this.size-(t.pageY-this.offset):this.reverse?this.size-(t.clientX-this.offset):t.clientX-this.offset},processClick:function(t){this.fixed&&t.stopPropagation()},wrapClick:function(t){var e=this;if(this.isDisabled||!this.clickable||this.processFlag)return!1;var i=this.getPos(t);if(this.isRange)if(this.disabledArray.every(function(t){return!1===t}))this.currentSlider=i>(this.position[1]-this.position[0])/2+this.position[0]?1:0;else if(this.disabledArray[0]){if(i<this.position[0])return!1;this.currentSlider=1}else if(this.disabledArray[1]){if(i>this.position[1])return!1;this.currentSlider=0}if(this.disabledArray[this.currentSlider])return!1;if(this.setValueOnPos(i),this.isRange&&this.tooltipMerge){var s=setInterval(function(){return e.handleOverlapTooltip()},16.7);setTimeout(function(){return window.clearInterval(s)},1e3*this.speed)}},moveStart:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,i=arguments[2];if(this.disabledArray[e])return!1;if(this.stopPropagation&&t.stopPropagation(),this.isRange&&(this.currentSlider=e,i)){if(!this.processDragable)return!1;this.processFlag=!0,this.processSign={pos:this.position,start:this.getPos(t.targetTouches&&t.targetTouches[0]?t.targetTouches[0]:t)}}!i&&this.useKeyboard&&(this.focusFlag=!0,this.focusSlider=e),this.flag=!0,this.$emit("drag-start",this)},moving:function(t){if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;t.preventDefault(),t.targetTouches&&t.targetTouches[0]&&(t=t.targetTouches[0]),this.processFlag?(this.currentSlider=0,this.setValueOnPos(this.processSign.pos[0]+this.getPos(t)-this.processSign.start,!0),this.currentSlider=1,this.setValueOnPos(this.processSign.pos[1]+this.getPos(t)-this.processSign.start,!0)):this.setValueOnPos(this.getPos(t),!0),this.isRange&&this.tooltipMerge&&this.handleOverlapTooltip()},moveEnd:function(t){var e=this;if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;this.$emit("drag-end",this),this.lazy&&this.isDiff(this.val,this.value)&&this.syncValue(),this.flag=!1,window.setTimeout(function(){e.processFlag=!1},0),this.setPosition()},setValueOnPos:function(t,e){var i=this.isRange?this.limit[this.currentSlider]:this.limit,s=this.isRange?this.valueLimit[this.currentSlider]:this.valueLimit;if(t>=i[0]&&t<=i[1]){this.setTransform(t);var r=this.getValueByIndex(Math.round(t/this.gap));this.setCurrentValue(r,e),this.isRange&&this.fixed&&(this.setTransform(t+this.fixedValue*this.gap*(0===this.currentSlider?1:-1),!0),this.setCurrentValue((r*this.multiple+this.fixedValue*this.spacing*this.multiple*(0===this.currentSlider?1:-1))/this.multiple,e,!0))}else t<i[0]?(this.setTransform(i[0]),this.setCurrentValue(s[0]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][0],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][0],e,!0)):this.fixed||this.disabledArray[0]||1!==this.currentSlider||(this.focusSlider=0,this.currentSlider=0)):(this.setTransform(i[1]),this.setCurrentValue(s[1]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][1],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][1],e,!0)):this.fixed||this.disabledArray[1]||0!==this.currentSlider||(this.focusSlider=1,this.currentSlider=1))},isDiff:function(t,e){return Object.prototype.toString.call(t)!==Object.prototype.toString.call(e)||(Array.isArray(t)&&t.length===e.length?t.some(function(t,i){return t!==e[i]}):t!==e)},setCurrentValue:function(t,e,i){var s=i?this.idleSlider:this.currentSlider;if(t<this.minimum||t>this.maximum)return!1;this.isRange?this.isDiff(this.currentValue[s],t)&&(this.currentValue.splice(s,1,t),this.lazy&&this.flag||this.syncValue()):this.isDiff(this.currentValue,t)&&(this.currentValue=t,this.lazy&&this.flag||this.syncValue()),e||this.setPosition()},getValueByIndex:function(t){return(this.spacing*this.multiple*t+this.minimum*this.multiple)/this.multiple},getIndexByValue:function(t){return Math.round((t-this.minimum)*this.multiple)/(this.spacing*this.multiple)},setIndex:function(t){if(Array.isArray(t)&&this.isRange){var e=void 0;e=this.data?[this.data[t[0]],this.data[t[1]]]:[this.getValueByIndex(t[0]),this.getValueByIndex(t[1])],this.setValue(e)}else t=this.getValueByIndex(t),this.isRange&&(this.currentSlider=t>(this.currentValue[1]-this.currentValue[0])/2+this.currentValue[0]?1:0),this.setCurrentValue(t)},setValue:function(t,e,i){var s=this;if(this.isDiff(this.val,t)){var r=this.limitValue(t);this.val=this.isRange?r.concat():r,this.computedFixedValue(),this.syncValue(e)}this.$nextTick(function(){return s.setPosition(i)})},computedFixedValue:function(){if(!this.fixed)return this.fixedValue=0,!1;this.fixedValue=this.currentIndex[1]-this.currentIndex[0]},setPosition:function(t){this.flag||this.setTransitionTime(void 0===t?this.speed:t),this.isRange?(this.setTransform(this.position[0],1===this.currentSlider),this.setTransform(this.position[1],0===this.currentSlider)):this.setTransform(this.position),this.flag||this.setTransitionTime(0)},setTransform:function(t,e){var i=e?this.idleSlider:this.currentSlider,r=s(("vertical"===this.direction?this.dotHeightVal/2-t:t-this.dotWidthVal/2)*(this.reverse?-1:1)),o="vertical"===this.direction?"translateY("+r+"px)":"translateX("+r+"px)",n=this.fixed?this.fixedValue*this.gap+"px":(0===i?this.position[1]-t:t-this.position[0])+"px",l=this.fixed?(0===i?t:t-this.fixedValue*this.gap)+"px":(0===i?t:this.position[0])+"px";this.isRange?(this.slider[i].style.transform=o,this.slider[i].style.WebkitTransform=o,this.slider[i].style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=n,this.$refs.process.style[this.reverse?"top":"bottom"]=l):(this.$refs.process.style.width=n,this.$refs.process.style[this.reverse?"right":"left"]=l)):(this.slider.style.transform=o,this.slider.style.WebkitTransform=o,this.slider.style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=t+"px",this.$refs.process.style[this.reverse?"top":"bottom"]=0):(this.$refs.process.style.width=t+"px",this.$refs.process.style[this.reverse?"right":"left"]=0))},setTransitionTime:function(t){if(t||this.$refs.process.offsetWidth,this.isRange){for(var e=0;e<this.slider.length;e++)this.slider[e].style.transitionDuration=t+"s",this.slider[e].style.WebkitTransitionDuration=t+"s";this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"}else this.slider.style.transitionDuration=t+"s",this.slider.style.WebkitTransitionDuration=t+"s",this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"},limitValue:function(t){var e=this;if(this.data)return t;var i=function(i){return i<e.min?(e.printError("The value of the slider is "+t+", the minimum value is "+e.min+", the value of this slider can not be less than the minimum value"),e.min):i>e.max?(e.printError("The value of the slider is "+t+", the maximum value is "+e.max+", the value of this slider can not be greater than the maximum value"),e.max):i};return this.isRange?t.map(function(t){return i(t)}):i(t)},syncValue:function(t){var e=this.isRange?this.val.concat():this.val;this.$emit("input",e),t||this.$emit("callback",e)},getValue:function(){return this.val},getIndex:function(){return this.currentIndex},getStaticData:function(){this.$refs.elem&&(this.size="vertical"===this.direction?this.$refs.elem.offsetHeight:this.$refs.elem.offsetWidth,this.offset="vertical"===this.direction?this.$refs.elem.getBoundingClientRect().top+window.pageYOffset||document.documentElement.scrollTop:this.$refs.elem.getBoundingClientRect().left)},refresh:function(){this.$refs.elem&&(this.getStaticData(),this.computedFixedValue(),this.setPosition())},printError:function(t){this.debug&&console.error("[VueSlider error]: "+t)},handleOverlapTooltip:function(){var t=this.tooltipDirection[0]===this.tooltipDirection[1];if(this.isRange&&t){var e=this.reverse?this.$refs.tooltip1:this.$refs.tooltip0,i=this.reverse?this.$refs.tooltip0:this.$refs.tooltip1,s=e.getBoundingClientRect().right,r=i.getBoundingClientRect().left,o=e.getBoundingClientRect().y,n=i.getBoundingClientRect().y+i.getBoundingClientRect().height,l="horizontal"===this.direction&&s>r,a="vertical"===this.direction&&n>o;l||a?this.handleDisplayMergedTooltip(!0):this.handleDisplayMergedTooltip(!1)}},handleDisplayMergedTooltip:function(t){var e=this.$refs.tooltip0,i=this.$refs.tooltip1,s=this.$refs.process.getElementsByClassName("vue-merged-tooltip")[0];t?(e.style.visibility="hidden",i.style.visibility="hidden",s.style.visibility="visible"):(e.style.visibility="visible",i.style.visibility="visible",s.style.visibility="hidden")}},mounted:function(){var t=this;if(this.isComponentExists=!0,"undefined"==typeof window||"undefined"==typeof document)return this.printError("window or document is undefined, can not be initialization.");this.$nextTick(function(){t.isComponentExists&&(t.getStaticData(),t.setValue(t.limitValue(t.value),!0,t.startAnimation?t.speed:0),t.bindEvents())}),this.isMounted=!0},beforeDestroy:function(){this.isComponentExists=!1,this.unbindEvents()}}},function(t,e,i){"use strict";var s=i(0);t.exports=s},function(t,e,i){e=t.exports=i(4)(),e.push([t.i,'.vue-slider-component{position:relative;box-sizing:border-box;-ms-user-select:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none}.vue-slider-component.vue-slider-disabled{opacity:.5;cursor:not-allowed}.vue-slider-component.vue-slider-has-label{margin-bottom:15px}.vue-slider-component.vue-slider-disabled .vue-slider-dot{cursor:not-allowed}.vue-slider-component .vue-slider{position:relative;display:block;border-radius:15px;background-color:#ccc}.vue-slider-component .vue-slider:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.vue-slider-component .vue-slider-process{position:absolute;border-radius:15px;background-color:#3498db;transition:all 0s;z-index:1}.vue-slider-component .vue-slider-process.vue-slider-process-dragable{cursor:pointer;z-index:3}.vue-slider-component.vue-slider-horizontal .vue-slider-process{width:0;height:100%;top:0;left:0;will-change:width}.vue-slider-component.vue-slider-vertical .vue-slider-process{width:100%;height:0;bottom:0;left:0;will-change:height}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-process{width:0;height:100%;top:0;right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-process{width:100%;height:0;top:0;left:0}.vue-slider-component .vue-slider-dot{position:absolute;border-radius:50%;background-color:#fff;box-shadow:.5px .5px 2px 1px rgba(0,0,0,.32);transition:all 0s;will-change:transform;cursor:pointer;z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-focus{box-shadow:0 0 2px 1px #3498db}.vue-slider-component .vue-slider-dot.vue-slider-dot-dragging{z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-disabled{z-index:4}.vue-slider-component.vue-slider-horizontal .vue-slider-dot{left:0}.vue-slider-component.vue-slider-vertical .vue-slider-dot{bottom:0}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-dot{right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-dot{top:0}.vue-slider-component .vue-slider-tooltip-wrap{display:none;position:absolute;z-index:9}.vue-slider-component .vue-slider-tooltip{display:block;font-size:14px;white-space:nowrap;padding:2px 5px;min-width:20px;text-align:center;color:#fff;border-radius:5px;border:1px solid #3498db;background-color:#3498db}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top{top:-9px;left:50%;transform:translate(-50%,-100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom{bottom:-9px;left:50%;transform:translate(-50%,100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left{top:50%;left:-9px;transform:translate(-100%,-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right{top:50%;right:-9px;transform:translate(100%,-50%)}.vue-slider-component .vue-slider-tooltip-top .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top .vue-slider-tooltip:before{content:"";position:absolute;bottom:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-top-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-merged-tooltip{display:block;visibility:hidden}.vue-slider-component .vue-slider-tooltip-bottom .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom .vue-slider-tooltip:before{content:"";position:absolute;top:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-bottom-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-left .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left .vue-slider-tooltip:before{content:"";position:absolute;top:50%;right:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-left-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-tooltip-right .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right .vue-slider-tooltip:before{content:"";position:absolute;top:50%;left:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-right-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-dot.vue-slider-hover:hover .vue-slider-tooltip-wrap{display:block}.vue-slider-component .vue-slider-dot.vue-slider-always .vue-slider-tooltip-wrap{display:block!important}.vue-slider-component .vue-slider-piecewise{position:absolute;width:100%;padding:0;margin:0;left:0;top:0;height:100%;list-style:none}.vue-slider-component .vue-slider-piecewise-item{position:absolute;width:8px;height:8px}.vue-slider-component .vue-slider-piecewise-dot{position:absolute;left:50%;top:50%;width:100%;height:100%;display:inline-block;background-color:rgba(0,0,0,.16);border-radius:50%;transform:translate(-50%,-50%);z-index:2;transition:all .3s}.vue-slider-component .vue-slider-piecewise-item:first-child .vue-slider-piecewise-dot,.vue-slider-component .vue-slider-piecewise-item:last-child .vue-slider-piecewise-dot{visibility:hidden}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-horizontal .vue-slider-piecewise-label{position:absolute;display:inline-block;top:100%;left:50%;white-space:nowrap;font-size:12px;color:#333;transform:translate(-50%,8px);visibility:visible}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-vertical .vue-slider-piecewise-label{position:absolute;display:inline-block;top:50%;left:100%;white-space:nowrap;font-size:12px;color:#333;transform:translate(8px,-50%);visibility:visible}.vue-slider-component .vue-slider-sr-only{clip:rect(1px,1px,1px,1px);height:1px;width:1px;overflow:hidden;position:absolute!important}',""])},function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;e<this.length;e++){var i=this[e];i[2]?t.push("@media "+i[2]+"{"+i[1]+"}"):t.push(i[1])}return t.join("")},t.i=function(e,i){"string"==typeof e&&(e=[[null,e,""]]);for(var s={},r=0;r<this.length;r++){var o=this[r][0];"number"==typeof o&&(s[o]=!0)}for(r=0;r<e.length;r++){var n=e[r];"number"==typeof n[0]&&s[n[0]]||(i&&!n[2]?n[2]=i:i&&(n[2]="("+n[2]+") and ("+i+")"),t.push(n))}},t}},function(t,e){t.exports=function(t,e,i,s){var r,o=t=t||{},n=typeof t.default;"object"!==n&&"function"!==n||(r=t,o=t.default);var l="function"==typeof o?o.options:o;if(e&&(l.render=e.render,l.staticRenderFns=e.staticRenderFns),i&&(l._scopeId=i),s){var a=Object.create(l.computed||null);Object.keys(s).forEach(function(t){var e=s[t];a[t]=function(){return e}}),l.computed=a}return{esModule:r,exports:o,options:l}}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("div",{directives:[{name:"show",rawName:"v-show",value:t.show,expression:"show"}],ref:"wrap",class:["vue-slider-component",t.flowDirection,t.disabledClass,t.stateClass,{"vue-slider-has-label":t.piecewiseLabel}],style:[t.wrapStyles,t.boolDisabled?t.disabledStyle:null],on:{click:t.wrapClick}},[i("div",{ref:"elem",staticClass:"vue-slider",style:[t.elemStyles,t.bgStyle],attrs:{"aria-hidden":"true"}},[t.isRange?[i("div",{key:"dot0",ref:"dot0",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[0]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[0]?t.disabledDotStyles[0]:null,t.sliderStyles[0],t.focusFlag&&0===t.focusSlider?t.focusStyles[0]:null],on:{mousedown:function(e){t.moveStart(e,0)},touchstart:function(e){t.moveStart(e,0)}}},[i("div",{ref:"tooltip0",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[0]},[t._v(t._s(t.formatter?t.formatting(t.val[0]):t.val[0]))])],{value:t.val[0],index:0,disabled:!t.boolDisabled&&t.disabledArray[0]})],2)]),t._v(" "),i("div",{key:"dot1",ref:"dot1",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&1===t.focusSlider,"vue-slider-dot-dragging":t.flag&&1===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[1]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[1]?t.disabledDotStyles[1]:null,t.sliderStyles[1],t.focusFlag&&1===t.focusSlider?t.focusStyles[1]:null],on:{mousedown:function(e){t.moveStart(e,1)},touchstart:function(e){t.moveStart(e,1)}}},[i("div",{ref:"tooltip1",class:["vue-slider-tooltip-"+t.tooltipDirection[1],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[1]},[t._v(t._s(t.formatter?t.formatting(t.val[1]):t.val[1]))])],{value:t.val[1],index:1,disabled:!t.boolDisabled&&t.disabledArray[1]})],2)])]:[i("div",{key:"dot",ref:"dot",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider}],style:[t.dotStyles,t.sliderStyles,t.focusFlag&&0===t.focusSlider?t.focusStyles:null],on:{mousedown:t.moveStart,touchstart:t.moveStart}},[i("div",{class:["vue-slider-tooltip-"+t.tooltipDirection,"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v(t._s(t.formatter?t.formatting(t.val):t.val))])],{value:t.val})],2)])],t._v(" "),i("ul",{staticClass:"vue-slider-piecewise"},t._l(t.piecewiseDotWrap,function(e,s){return i("li",{key:s,staticClass:"vue-slider-piecewise-item",style:[t.piecewiseDotStyle,e.style]},[t._t("piecewise",[t.piecewise?i("span",{staticClass:"vue-slider-piecewise-dot",style:[t.piecewiseStyle,e.inRange?t.piecewiseActiveStyle:null]}):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange}),t._v(" "),t._t("label",[t.piecewiseLabel?i("span",{staticClass:"vue-slider-piecewise-label",style:[t.labelStyle,e.inRange?t.labelActiveStyle:null]},[t._v("\n            "+t._s(e.label)+"\n          ")]):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange})],2)})),t._v(" "),i("div",{ref:"process",class:["vue-slider-process",{"vue-slider-process-dragable":t.isRange&&t.processDragable}],style:t.processStyle,on:{click:t.processClick,mousedown:function(e){t.moveStart(e,0,!0)},touchstart:function(e){t.moveStart(e,0,!0)}}},[i("div",{ref:"mergedTooltip",staticClass:"vue-merged-tooltip",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"],style:t.tooltipMergedPosition},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v("\n            "+t._s(t.mergeFormatter?t.mergeFormatting(t.val[0],t.val[1]):t.formatter?t.val[0]===t.val[1]?t.formatting(t.val[0]):t.formatting(t.val[0])+" - "+t.formatting(t.val[1]):t.val[0]===t.val[1]?t.val[0]:t.val[0]+" - "+t.val[1])+"\n          ")])])],2)]),t._v(" "),t.isRange||t.data?t._e():i("input",{directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],staticClass:"vue-slider-sr-only",attrs:{type:"range",min:t.min,max:t.max},domProps:{value:t.val},on:{__r:function(e){t.val=e.target.value}}})],2)])},staticRenderFns:[]}},function(t,e,i){var s=i(3);"string"==typeof s&&(s=[[t.i,s,""]]),s.locals&&(t.exports=s.locals);i(8)("743d98f5",s,!0)},function(t,e,i){function s(t){for(var e=0;e<t.length;e++){var i=t[e],s=d[i.id];if(s){s.refs++;for(var r=0;r<s.parts.length;r++)s.parts[r](i.parts[r]);for(;r<i.parts.length;r++)s.parts.push(o(i.parts[r]));s.parts.length>i.parts.length&&(s.parts.length=i.parts.length)}else{for(var n=[],r=0;r<i.parts.length;r++)n.push(o(i.parts[r]));d[i.id]={id:i.id,refs:1,parts:n}}}}function r(){var t=document.createElement("style");return t.type="text/css",h.appendChild(t),t}function o(t){var e,i,s=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(s){if(f)return v;s.parentNode.removeChild(s)}if(m){var o=p++;s=c||(c=r()),e=n.bind(null,s,o,!1),i=n.bind(null,s,o,!0)}else s=r(),e=l.bind(null,s),i=function(){s.parentNode.removeChild(s)};return e(t),function(s){if(s){if(s.css===t.css&&s.media===t.media&&s.sourceMap===t.sourceMap)return;e(t=s)}else i()}}function n(t,e,i,s){var r=i?"":s.css;if(t.styleSheet)t.styleSheet.cssText=g(e,r);else{var o=document.createTextNode(r),n=t.childNodes;n[e]&&t.removeChild(n[e]),n.length?t.insertBefore(o,n[e]):t.appendChild(o)}}function l(t,e){var i=e.css,s=e.media,r=e.sourceMap;if(s&&t.setAttribute("media",s),r&&(i+="\n/*# sourceURL="+r.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=i;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(i))}}var a="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var u=i(9),d={},h=a&&(document.head||document.getElementsByTagName("head")[0]),c=null,p=0,f=!1,v=function(){},m="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,i){f=i;var r=u(t,e);return s(r),function(e){for(var i=[],o=0;o<r.length;o++){var n=r[o],l=d[n.id];l.refs--,i.push(l)}e?(r=u(t,e),s(r)):r=[];for(var o=0;o<i.length;o++){var l=i[o];if(0===l.refs){for(var a=0;a<l.parts.length;a++)l.parts[a]();delete d[l.id]}}}};var g=function(){var t=[];return function(e,i){return t[e]=i,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var i=[],s={},r=0;r<e.length;r++){var o=e[r],n=o[0],l=o[1],a=o[2],u=o[3],d={id:t+":"+r,css:l,media:a,sourceMap:u};s[n]?s[n].parts.push(d):i.push(s[n]={id:n,parts:[d]})}return i}}])});
+!function(t,e){ true?module.exports=e():"function"==typeof define&&define.amd?define("vue-slider-component",[],e):"object"==typeof exports?exports["vue-slider-component"]=e():t["vue-slider-component"]=e()}(this,function(){return function(t){function e(s){if(i[s])return i[s].exports;var r=i[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var i={};return e.m=t,e.c=i,e.i=function(t){return t},e.d=function(t,i,s){e.o(t,i)||Object.defineProperty(t,i,{configurable:!1,enumerable:!0,get:s})},e.n=function(t){var i=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(i,"a",i),i},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=2)}([function(t,e,i){i(7);var s=i(5)(i(1),i(6),null,null);t.exports=s.exports},function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=function(){var t="undefined"!=typeof window?window.devicePixelRatio||1:1;return function(e){return Math.round(e*t)/t}}();e.default={name:"VueSliderComponent",props:{width:{type:[Number,String],default:"auto"},height:{type:[Number,String],default:6},data:{type:Array,default:null},dotSize:{type:Number,default:16},dotWidth:{type:Number,required:!1},dotHeight:{type:Number,required:!1},min:{type:Number,default:0},max:{type:Number,default:100},interval:{type:Number,default:1},show:{type:Boolean,default:!0},disabled:{type:[Boolean,Array],default:!1},piecewise:{type:Boolean,default:!1},tooltip:{type:[String,Boolean],default:"always"},eventType:{type:String,default:"auto"},direction:{type:String,default:"horizontal"},reverse:{type:Boolean,default:!1},lazy:{type:Boolean,default:!1},clickable:{type:Boolean,default:!0},speed:{type:Number,default:.5},realTime:{type:Boolean,default:!1},stopPropagation:{type:Boolean,default:!1},value:{type:[String,Number,Array,Object],default:0},piecewiseLabel:{type:Boolean,default:!1},debug:{type:Boolean,default:!0},fixed:{type:Boolean,default:!1},processDragable:{type:Boolean,default:!1},useKeyboard:{type:Boolean,default:!1},actionsKeyboard:{type:Array,default:function(){return[function(t){return t-1},function(t){return t+1}]}},tooltipMerge:{type:Boolean,default:!0},startAnimation:{type:Boolean,default:!1},sliderStyle:[Array,Object,Function],focusStyle:[Array,Object,Function],tooltipDir:[Array,String],formatter:[String,Function],mergeFormatter:[String,Function],piecewiseStyle:Object,disabledStyle:Object,piecewiseActiveStyle:Object,processStyle:Object,bgStyle:Object,tooltipStyle:[Array,Object,Function],disabledDotStyle:[Array,Object,Function],labelStyle:Object,labelActiveStyle:Object},data:function(){return{flag:!1,keydownFlag:null,focusFlag:!1,processFlag:!1,processSign:null,size:0,fixedValue:0,focusSlider:0,currentValue:0,currentSlider:0,isComponentExists:!0,isMounted:!1}},computed:{dotWidthVal:function(){return"number"==typeof this.dotWidth?this.dotWidth:this.dotSize},dotHeightVal:function(){return"number"==typeof this.dotHeight?this.dotHeight:this.dotSize},flowDirection:function(){return"vue-slider-"+this.direction+(this.reverse?"-reverse":"")},tooltipMergedPosition:function(){if(!this.isMounted)return{};var t=this.tooltipDirection[0];if(this.$refs.dot0){if("vertical"===this.direction){var e={};return e[t]="-"+(this.dotHeightVal/2-this.width/2+9)+"px",e}var i={};return i[t]="-"+(this.dotWidthVal/2-this.height/2+9)+"px",i.left="50%",i}},tooltipDirection:function(){var t=this.tooltipDir||("vertical"===this.direction?"left":"top");return Array.isArray(t)?this.isRange?t:t[1]:this.isRange?[t,t]:t},tooltipStatus:function(){return"hover"===this.tooltip&&this.flag?"vue-slider-always":this.tooltip?"vue-slider-"+this.tooltip:""},tooltipClass:function(){return["vue-slider-tooltip-"+this.tooltipDirection,"vue-slider-tooltip"]},disabledArray:function(){return Array.isArray(this.disabled)?this.disabled:[this.disabled,this.disabled]},boolDisabled:function(){return this.disabledArray.every(function(t){return!0===t})},isDisabled:function(){return"none"===this.eventType||this.boolDisabled},disabledClass:function(){return this.boolDisabled?"vue-slider-disabled":""},stateClass:function(){return{"vue-slider-state-process-drag":this.processFlag,"vue-slider-state-drag":this.flag&&!this.processFlag&&!this.keydownFlag,"vue-slider-state-focus":this.focusFlag}},isRange:function(){return Array.isArray(this.value)},slider:function(){return this.isRange?[this.$refs.dot0,this.$refs.dot1]:this.$refs.dot},minimum:function(){return this.data?0:this.min},val:{get:function(){return this.data?this.isRange?[this.data[this.currentValue[0]],this.data[this.currentValue[1]]]:this.data[this.currentValue]:this.currentValue},set:function(t){if(this.data)if(this.isRange){var e=this.data.indexOf(t[0]),i=this.data.indexOf(t[1]);e>-1&&i>-1&&(this.currentValue=[e,i])}else{var s=this.data.indexOf(t);s>-1&&(this.currentValue=s)}else this.currentValue=t}},currentIndex:function(){return this.isRange?this.data?this.currentValue:[this.getIndexByValue(this.currentValue[0]),this.getIndexByValue(this.currentValue[1])]:this.getIndexByValue(this.currentValue)},indexRange:function(){return this.isRange?this.currentIndex:[0,this.currentIndex]},maximum:function(){return this.data?this.data.length-1:this.max},multiple:function(){var t=(""+this.interval).split(".")[1];return t?Math.pow(10,t.length):1},spacing:function(){return this.data?1:this.interval},total:function(){return this.data?this.data.length-1:(Math.floor((this.maximum-this.minimum)*this.multiple)%(this.interval*this.multiple)!=0&&this.printError("Prop[interval] is illegal, Please make sure that the interval can be divisible"),(this.maximum-this.minimum)/this.interval)},gap:function(){return this.size/this.total},position:function(){return this.isRange?[(this.currentValue[0]-this.minimum)/this.spacing*this.gap,(this.currentValue[1]-this.minimum)/this.spacing*this.gap]:(this.currentValue-this.minimum)/this.spacing*this.gap},limit:function(){return this.isRange?this.fixed?[[0,(this.total-this.fixedValue)*this.gap],[this.fixedValue*this.gap,this.size]]:[[0,this.position[1]],[this.position[0],this.size]]:[0,this.size]},valueLimit:function(){return this.isRange?this.fixed?[[this.minimum,this.maximum-this.fixedValue*(this.spacing*this.multiple)/this.multiple],[this.minimum+this.fixedValue*(this.spacing*this.multiple)/this.multiple,this.maximum]]:[[this.minimum,this.currentValue[1]],[this.currentValue[0],this.maximum]]:[this.minimum,this.maximum]},idleSlider:function(){return 0===this.currentSlider?1:0},wrapStyles:function(){return"vertical"===this.direction?{height:"number"==typeof this.height?this.height+"px":this.height,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}:{width:"number"==typeof this.width?this.width+"px":this.width,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}},sliderStyles:function(){return Array.isArray(this.sliderStyle)?this.isRange?this.sliderStyle:this.sliderStyle[1]:"function"==typeof this.sliderStyle?this.sliderStyle(this.val,this.currentIndex):this.isRange?[this.sliderStyle,this.sliderStyle]:this.sliderStyle},focusStyles:function(){return Array.isArray(this.focusStyle)?this.isRange?this.focusStyle:this.focusStyle[1]:"function"==typeof this.focusStyle?this.focusStyle(this.val,this.currentIndex):this.isRange?[this.focusStyle,this.focusStyle]:this.focusStyle},disabledDotStyles:function(){var t=this.disabledDotStyle;if(Array.isArray(t))return t;if("function"==typeof t){var e=t(this.val,this.currentIndex);return Array.isArray(e)?e:[e,e]}return t?[t,t]:[{backgroundColor:"#ccc"},{backgroundColor:"#ccc"}]},tooltipStyles:function(){return Array.isArray(this.tooltipStyle)?this.isRange?this.tooltipStyle:this.tooltipStyle[1]:"function"==typeof this.tooltipStyle?this.tooltipStyle(this.val,this.currentIndex):this.isRange?[this.tooltipStyle,this.tooltipStyle]:this.tooltipStyle},elemStyles:function(){return"vertical"===this.direction?{width:this.width+"px",height:"100%"}:{height:this.height+"px"}},dotStyles:function(){return"vertical"===this.direction?{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",left:-(this.dotWidthVal-this.width)/2+"px"}:{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",top:-(this.dotHeightVal-this.height)/2+"px"}},piecewiseDotStyle:function(){return"vertical"===this.direction?{width:this.width+"px",height:this.width+"px"}:{width:this.height+"px",height:this.height+"px"}},piecewiseDotWrap:function(){if(!this.piecewise&&!this.piecewiseLabel)return!1;for(var t=[],e=0;e<=this.total;e++){var i="vertical"===this.direction?{bottom:this.gap*e-this.width/2+"px",left:0}:{left:this.gap*e-this.height/2+"px",top:0},s=this.reverse?this.total-e:e,r=this.data?this.data[s]:this.spacing*s+this.min;t.push({style:i,label:this.formatter?this.formatting(r):r,inRange:s>=this.indexRange[0]&&s<=this.indexRange[1]})}return t}},watch:{value:function(t){this.flag||this.setValue(t,!0)},max:function(t){if(t<this.min)return this.printError("The maximum value can not be less than the minimum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},min:function(t){if(t>this.max)return this.printError("The minimum value can not be greater than the maximum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},show:function(t){var e=this;t&&!this.size&&this.$nextTick(function(){e.refresh()})},fixed:function(){this.computedFixedValue()}},methods:{bindEvents:function(){document.addEventListener("touchmove",this.moving,{passive:!1}),document.addEventListener("touchend",this.moveEnd,{passive:!1}),document.addEventListener("mousedown",this.blurSlider),document.addEventListener("mousemove",this.moving),document.addEventListener("mouseup",this.moveEnd),document.addEventListener("mouseleave",this.moveEnd),document.addEventListener("keydown",this.handleKeydown),document.addEventListener("keyup",this.handleKeyup),window.addEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.addEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.addEventListener("transitionend",this.handleOverlapTooltip))},unbindEvents:function(){document.removeEventListener("touchmove",this.moving),document.removeEventListener("touchend",this.moveEnd),document.removeEventListener("mousedown",this.blurSlider),document.removeEventListener("mousemove",this.moving),document.removeEventListener("mouseup",this.moveEnd),document.removeEventListener("mouseleave",this.moveEnd),document.removeEventListener("keydown",this.handleKeydown),document.removeEventListener("keyup",this.handleKeyup),window.removeEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.removeEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.removeEventListener("transitionend",this.handleOverlapTooltip))},handleKeydown:function(t){if(!this.useKeyboard||!this.focusFlag)return!1;switch(t.keyCode){case 37:case 40:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[0]);break;case 38:case 39:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[1])}},handleKeyup:function(){this.keydownFlag&&(this.keydownFlag=!1,this.flag=!1)},changeFocusSlider:function(t){var e=this;if(this.isRange){var i=this.currentIndex.map(function(i,s){if(s===e.focusSlider||e.fixed){var r=t(i),o=e.fixed?e.valueLimit[s]:[0,e.total];if(r<=o[1]&&r>=o[0])return r}return i});i[0]>i[1]&&(this.focusSlider=0===this.focusSlider?1:0,i=i.reverse()),this.setIndex(i)}else this.setIndex(t(this.currentIndex))},blurSlider:function(t){var e=this.isRange?this.$refs["dot"+this.focusSlider]:this.$refs.dot;if(!e||e===t.target)return!1;this.focusFlag=!1},formatting:function(t){return"string"==typeof this.formatter?this.formatter.replace(/\{value\}/,t):this.formatter(t)},mergeFormatting:function(t,e){return"string"==typeof this.mergeFormatter?this.mergeFormatter.replace(/\{(value1|value2)\}/g,function(i,s){return"value1"===s?t:e}):this.mergeFormatter(t,e)},getPos:function(t){return this.realTime&&this.getStaticData(),"vertical"===this.direction?this.reverse?t.pageY-this.offset:this.size-(t.pageY-this.offset):this.reverse?this.size-(t.clientX-this.offset):t.clientX-this.offset},processClick:function(t){this.fixed&&t.stopPropagation()},wrapClick:function(t){var e=this;if(this.isDisabled||!this.clickable||this.processFlag)return!1;var i=this.getPos(t);if(this.isRange)if(this.disabledArray.every(function(t){return!1===t}))this.currentSlider=i>(this.position[1]-this.position[0])/2+this.position[0]?1:0;else if(this.disabledArray[0]){if(i<this.position[0])return!1;this.currentSlider=1}else if(this.disabledArray[1]){if(i>this.position[1])return!1;this.currentSlider=0}if(this.disabledArray[this.currentSlider])return!1;if(this.setValueOnPos(i),this.isRange&&this.tooltipMerge){var s=setInterval(function(){return e.handleOverlapTooltip()},16.7);setTimeout(function(){return window.clearInterval(s)},1e3*this.speed)}},moveStart:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,i=arguments[2];if(this.disabledArray[e])return!1;if(this.stopPropagation&&t.stopPropagation(),this.isRange&&(this.currentSlider=e,i)){if(!this.processDragable)return!1;this.processFlag=!0,this.processSign={pos:this.position,start:this.getPos(t.targetTouches&&t.targetTouches[0]?t.targetTouches[0]:t)}}!i&&this.useKeyboard&&(this.focusFlag=!0,this.focusSlider=e),this.flag=!0,this.$emit("drag-start",this)},moving:function(t){if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;t.preventDefault(),t.targetTouches&&t.targetTouches[0]&&(t=t.targetTouches[0]),this.processFlag?(this.currentSlider=0,this.setValueOnPos(this.processSign.pos[0]+this.getPos(t)-this.processSign.start,!0),this.currentSlider=1,this.setValueOnPos(this.processSign.pos[1]+this.getPos(t)-this.processSign.start,!0)):this.setValueOnPos(this.getPos(t),!0),this.isRange&&this.tooltipMerge&&this.handleOverlapTooltip()},moveEnd:function(t){var e=this;if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;this.$emit("drag-end",this),this.lazy&&this.isDiff(this.val,this.value)&&this.syncValue(),this.flag=!1,window.setTimeout(function(){e.processFlag=!1},0),this.setPosition()},setValueOnPos:function(t,e){var i=this.isRange?this.limit[this.currentSlider]:this.limit,s=this.isRange?this.valueLimit[this.currentSlider]:this.valueLimit;if(t>=i[0]&&t<=i[1]){this.setTransform(t);var r=this.getValueByIndex(Math.round(t/this.gap));this.setCurrentValue(r,e),this.isRange&&this.fixed&&(this.setTransform(t+this.fixedValue*this.gap*(0===this.currentSlider?1:-1),!0),this.setCurrentValue((r*this.multiple+this.fixedValue*this.spacing*this.multiple*(0===this.currentSlider?1:-1))/this.multiple,e,!0))}else t<i[0]?(this.setTransform(i[0]),this.setCurrentValue(s[0]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][0],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][0],e,!0)):this.fixed||this.disabledArray[0]||1!==this.currentSlider||(this.focusSlider=0,this.currentSlider=0)):(this.setTransform(i[1]),this.setCurrentValue(s[1]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][1],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][1],e,!0)):this.fixed||this.disabledArray[1]||0!==this.currentSlider||(this.focusSlider=1,this.currentSlider=1))},isDiff:function(t,e){return Object.prototype.toString.call(t)!==Object.prototype.toString.call(e)||(Array.isArray(t)&&t.length===e.length?t.some(function(t,i){return t!==e[i]}):t!==e)},setCurrentValue:function(t,e,i){var s=i?this.idleSlider:this.currentSlider;if(t<this.minimum||t>this.maximum)return!1;this.isRange?this.isDiff(this.currentValue[s],t)&&(this.currentValue.splice(s,1,t),this.lazy&&this.flag||this.syncValue()):this.isDiff(this.currentValue,t)&&(this.currentValue=t,this.lazy&&this.flag||this.syncValue()),e||this.setPosition()},getValueByIndex:function(t){return(this.spacing*this.multiple*t+this.minimum*this.multiple)/this.multiple},getIndexByValue:function(t){return Math.round((t-this.minimum)*this.multiple)/(this.spacing*this.multiple)},setIndex:function(t){if(Array.isArray(t)&&this.isRange){var e=void 0;e=this.data?[this.data[t[0]],this.data[t[1]]]:[this.getValueByIndex(t[0]),this.getValueByIndex(t[1])],this.setValue(e)}else t=this.getValueByIndex(t),this.isRange&&(this.currentSlider=t>(this.currentValue[1]-this.currentValue[0])/2+this.currentValue[0]?1:0),this.setCurrentValue(t)},setValue:function(t,e,i){var s=this;if(this.isDiff(this.val,t)){var r=this.limitValue(t);this.val=this.isRange?r.concat():r,this.computedFixedValue(),this.syncValue(e)}this.$nextTick(function(){return s.setPosition(i)})},computedFixedValue:function(){if(!this.fixed)return this.fixedValue=0,!1;this.fixedValue=this.currentIndex[1]-this.currentIndex[0]},setPosition:function(t){this.flag||this.setTransitionTime(void 0===t?this.speed:t),this.isRange?(this.setTransform(this.position[0],1===this.currentSlider),this.setTransform(this.position[1],0===this.currentSlider)):this.setTransform(this.position),this.flag||this.setTransitionTime(0)},setTransform:function(t,e){var i=e?this.idleSlider:this.currentSlider,r=s(("vertical"===this.direction?this.dotHeightVal/2-t:t-this.dotWidthVal/2)*(this.reverse?-1:1)),o="vertical"===this.direction?"translateY("+r+"px)":"translateX("+r+"px)",n=this.fixed?this.fixedValue*this.gap+"px":(0===i?this.position[1]-t:t-this.position[0])+"px",l=this.fixed?(0===i?t:t-this.fixedValue*this.gap)+"px":(0===i?t:this.position[0])+"px";this.isRange?(this.slider[i].style.transform=o,this.slider[i].style.WebkitTransform=o,this.slider[i].style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=n,this.$refs.process.style[this.reverse?"top":"bottom"]=l):(this.$refs.process.style.width=n,this.$refs.process.style[this.reverse?"right":"left"]=l)):(this.slider.style.transform=o,this.slider.style.WebkitTransform=o,this.slider.style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=t+"px",this.$refs.process.style[this.reverse?"top":"bottom"]=0):(this.$refs.process.style.width=t+"px",this.$refs.process.style[this.reverse?"right":"left"]=0))},setTransitionTime:function(t){if(t||this.$refs.process.offsetWidth,this.isRange){for(var e=0;e<this.slider.length;e++)this.slider[e].style.transitionDuration=t+"s",this.slider[e].style.WebkitTransitionDuration=t+"s";this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"}else this.slider.style.transitionDuration=t+"s",this.slider.style.WebkitTransitionDuration=t+"s",this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"},limitValue:function(t){var e=this;if(this.data)return t;var i=function(i){return i<e.min?(e.printError("The value of the slider is "+t+", the minimum value is "+e.min+", the value of this slider can not be less than the minimum value"),e.min):i>e.max?(e.printError("The value of the slider is "+t+", the maximum value is "+e.max+", the value of this slider can not be greater than the maximum value"),e.max):i};return this.isRange?t.map(function(t){return i(t)}):i(t)},syncValue:function(t){var e=this.isRange?this.val.concat():this.val;this.$emit("input",e),this.keydownFlag&&this.$emit("on-keypress",e),t||this.$emit("callback",e)},getValue:function(){return this.val},getIndex:function(){return this.currentIndex},getStaticData:function(){this.$refs.elem&&(this.size="vertical"===this.direction?this.$refs.elem.offsetHeight:this.$refs.elem.offsetWidth,this.offset="vertical"===this.direction?this.$refs.elem.getBoundingClientRect().top+window.pageYOffset||document.documentElement.scrollTop:this.$refs.elem.getBoundingClientRect().left)},refresh:function(){this.$refs.elem&&(this.getStaticData(),this.computedFixedValue(),this.setPosition())},printError:function(t){this.debug&&console.error("[VueSlider error]: "+t)},handleOverlapTooltip:function(){var t=this.tooltipDirection[0]===this.tooltipDirection[1];if(this.isRange&&t){var e=this.reverse?this.$refs.tooltip1:this.$refs.tooltip0,i=this.reverse?this.$refs.tooltip0:this.$refs.tooltip1,s=e.getBoundingClientRect().right,r=i.getBoundingClientRect().left,o=e.getBoundingClientRect().y,n=i.getBoundingClientRect().y+i.getBoundingClientRect().height,l="horizontal"===this.direction&&s>r,a="vertical"===this.direction&&n>o;l||a?this.handleDisplayMergedTooltip(!0):this.handleDisplayMergedTooltip(!1)}},handleDisplayMergedTooltip:function(t){var e=this.$refs.tooltip0,i=this.$refs.tooltip1,s=this.$refs.process.getElementsByClassName("vue-merged-tooltip")[0];t?(e.style.visibility="hidden",i.style.visibility="hidden",s.style.visibility="visible"):(e.style.visibility="visible",i.style.visibility="visible",s.style.visibility="hidden")}},mounted:function(){var t=this;if(this.isComponentExists=!0,"undefined"==typeof window||"undefined"==typeof document)return this.printError("window or document is undefined, can not be initialization.");this.$nextTick(function(){t.isComponentExists&&(t.getStaticData(),t.setValue(t.limitValue(t.value),!0,t.startAnimation?t.speed:0),t.bindEvents())}),this.isMounted=!0},beforeDestroy:function(){this.isComponentExists=!1,this.unbindEvents()}}},function(t,e,i){"use strict";var s=i(0);t.exports=s},function(t,e,i){e=t.exports=i(4)(),e.push([t.i,'.vue-slider-component{position:relative;box-sizing:border-box;-ms-user-select:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none}.vue-slider-component.vue-slider-disabled{opacity:.5;cursor:not-allowed}.vue-slider-component.vue-slider-has-label{margin-bottom:15px}.vue-slider-component.vue-slider-disabled .vue-slider-dot{cursor:not-allowed}.vue-slider-component .vue-slider{position:relative;display:block;border-radius:15px;background-color:#ccc}.vue-slider-component .vue-slider:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.vue-slider-component .vue-slider-process{position:absolute;border-radius:15px;background-color:#3498db;transition:all 0s;z-index:1}.vue-slider-component .vue-slider-process.vue-slider-process-dragable{cursor:pointer;z-index:3}.vue-slider-component.vue-slider-horizontal .vue-slider-process{width:0;height:100%;top:0;left:0;will-change:width}.vue-slider-component.vue-slider-vertical .vue-slider-process{width:100%;height:0;bottom:0;left:0;will-change:height}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-process{width:0;height:100%;top:0;right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-process{width:100%;height:0;top:0;left:0}.vue-slider-component .vue-slider-dot{position:absolute;border-radius:50%;background-color:#fff;box-shadow:.5px .5px 2px 1px rgba(0,0,0,.32);transition:all 0s;will-change:transform;cursor:pointer;z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-focus{box-shadow:0 0 2px 1px #3498db}.vue-slider-component .vue-slider-dot.vue-slider-dot-dragging{z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-disabled{z-index:4}.vue-slider-component.vue-slider-horizontal .vue-slider-dot{left:0}.vue-slider-component.vue-slider-vertical .vue-slider-dot{bottom:0}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-dot{right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-dot{top:0}.vue-slider-component .vue-slider-tooltip-wrap{display:none;position:absolute;z-index:9}.vue-slider-component .vue-slider-tooltip{display:block;font-size:14px;white-space:nowrap;padding:2px 5px;min-width:20px;text-align:center;color:#fff;border-radius:5px;border:1px solid #3498db;background-color:#3498db}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top{top:-9px;left:50%;transform:translate(-50%,-100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom{bottom:-9px;left:50%;transform:translate(-50%,100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left{top:50%;left:-9px;transform:translate(-100%,-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right{top:50%;right:-9px;transform:translate(100%,-50%)}.vue-slider-component .vue-slider-tooltip-top .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top .vue-slider-tooltip:before{content:"";position:absolute;bottom:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-top-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-merged-tooltip{display:block;visibility:hidden}.vue-slider-component .vue-slider-tooltip-bottom .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom .vue-slider-tooltip:before{content:"";position:absolute;top:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-bottom-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-left .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left .vue-slider-tooltip:before{content:"";position:absolute;top:50%;right:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-left-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-tooltip-right .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right .vue-slider-tooltip:before{content:"";position:absolute;top:50%;left:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-right-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-dot.vue-slider-hover:hover .vue-slider-tooltip-wrap{display:block}.vue-slider-component .vue-slider-dot.vue-slider-always .vue-slider-tooltip-wrap{display:block!important}.vue-slider-component .vue-slider-piecewise{position:absolute;width:100%;padding:0;margin:0;left:0;top:0;height:100%;list-style:none}.vue-slider-component .vue-slider-piecewise-item{position:absolute;width:8px;height:8px}.vue-slider-component .vue-slider-piecewise-dot{position:absolute;left:50%;top:50%;width:100%;height:100%;display:inline-block;background-color:rgba(0,0,0,.16);border-radius:50%;transform:translate(-50%,-50%);z-index:2;transition:all .3s}.vue-slider-component .vue-slider-piecewise-item:first-child .vue-slider-piecewise-dot,.vue-slider-component .vue-slider-piecewise-item:last-child .vue-slider-piecewise-dot{visibility:hidden}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-horizontal .vue-slider-piecewise-label{position:absolute;display:inline-block;top:100%;left:50%;white-space:nowrap;font-size:12px;color:#333;transform:translate(-50%,8px);visibility:visible}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-vertical .vue-slider-piecewise-label{position:absolute;display:inline-block;top:50%;left:100%;white-space:nowrap;font-size:12px;color:#333;transform:translate(8px,-50%);visibility:visible}.vue-slider-component .vue-slider-sr-only{clip:rect(1px,1px,1px,1px);height:1px;width:1px;overflow:hidden;position:absolute!important}',""])},function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;e<this.length;e++){var i=this[e];i[2]?t.push("@media "+i[2]+"{"+i[1]+"}"):t.push(i[1])}return t.join("")},t.i=function(e,i){"string"==typeof e&&(e=[[null,e,""]]);for(var s={},r=0;r<this.length;r++){var o=this[r][0];"number"==typeof o&&(s[o]=!0)}for(r=0;r<e.length;r++){var n=e[r];"number"==typeof n[0]&&s[n[0]]||(i&&!n[2]?n[2]=i:i&&(n[2]="("+n[2]+") and ("+i+")"),t.push(n))}},t}},function(t,e){t.exports=function(t,e,i,s){var r,o=t=t||{},n=typeof t.default;"object"!==n&&"function"!==n||(r=t,o=t.default);var l="function"==typeof o?o.options:o;if(e&&(l.render=e.render,l.staticRenderFns=e.staticRenderFns),i&&(l._scopeId=i),s){var a=Object.create(l.computed||null);Object.keys(s).forEach(function(t){var e=s[t];a[t]=function(){return e}}),l.computed=a}return{esModule:r,exports:o,options:l}}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("div",{directives:[{name:"show",rawName:"v-show",value:t.show,expression:"show"}],ref:"wrap",class:["vue-slider-component",t.flowDirection,t.disabledClass,t.stateClass,{"vue-slider-has-label":t.piecewiseLabel}],style:[t.wrapStyles,t.boolDisabled?t.disabledStyle:null],on:{click:t.wrapClick}},[i("div",{ref:"elem",staticClass:"vue-slider",style:[t.elemStyles,t.bgStyle],attrs:{"aria-hidden":"true"}},[t.isRange?[i("div",{key:"dot0",ref:"dot0",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[0]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[0]?t.disabledDotStyles[0]:null,t.sliderStyles[0],t.focusFlag&&0===t.focusSlider?t.focusStyles[0]:null],on:{mousedown:function(e){t.moveStart(e,0)},touchstart:function(e){t.moveStart(e,0)}}},[i("div",{ref:"tooltip0",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[0]},[t._v(t._s(t.formatter?t.formatting(t.val[0]):t.val[0]))])],{value:t.val[0],index:0,disabled:!t.boolDisabled&&t.disabledArray[0]})],2)]),t._v(" "),i("div",{key:"dot1",ref:"dot1",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&1===t.focusSlider,"vue-slider-dot-dragging":t.flag&&1===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[1]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[1]?t.disabledDotStyles[1]:null,t.sliderStyles[1],t.focusFlag&&1===t.focusSlider?t.focusStyles[1]:null],on:{mousedown:function(e){t.moveStart(e,1)},touchstart:function(e){t.moveStart(e,1)}}},[i("div",{ref:"tooltip1",class:["vue-slider-tooltip-"+t.tooltipDirection[1],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[1]},[t._v(t._s(t.formatter?t.formatting(t.val[1]):t.val[1]))])],{value:t.val[1],index:1,disabled:!t.boolDisabled&&t.disabledArray[1]})],2)])]:[i("div",{key:"dot",ref:"dot",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider}],style:[t.dotStyles,t.sliderStyles,t.focusFlag&&0===t.focusSlider?t.focusStyles:null],on:{mousedown:t.moveStart,touchstart:t.moveStart}},[i("div",{class:["vue-slider-tooltip-"+t.tooltipDirection,"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v(t._s(t.formatter?t.formatting(t.val):t.val))])],{value:t.val})],2)])],t._v(" "),i("ul",{staticClass:"vue-slider-piecewise"},t._l(t.piecewiseDotWrap,function(e,s){return i("li",{key:s,staticClass:"vue-slider-piecewise-item",style:[t.piecewiseDotStyle,e.style]},[t._t("piecewise",[t.piecewise?i("span",{staticClass:"vue-slider-piecewise-dot",style:[t.piecewiseStyle,e.inRange?t.piecewiseActiveStyle:null]}):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange}),t._v(" "),t._t("label",[t.piecewiseLabel?i("span",{staticClass:"vue-slider-piecewise-label",style:[t.labelStyle,e.inRange?t.labelActiveStyle:null]},[t._v("\n            "+t._s(e.label)+"\n          ")]):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange})],2)})),t._v(" "),i("div",{ref:"process",class:["vue-slider-process",{"vue-slider-process-dragable":t.isRange&&t.processDragable}],style:t.processStyle,on:{click:t.processClick,mousedown:function(e){t.moveStart(e,0,!0)},touchstart:function(e){t.moveStart(e,0,!0)}}},[i("div",{ref:"mergedTooltip",staticClass:"vue-merged-tooltip",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"],style:t.tooltipMergedPosition},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v("\n            "+t._s(t.mergeFormatter?t.mergeFormatting(t.val[0],t.val[1]):t.formatter?t.val[0]===t.val[1]?t.formatting(t.val[0]):t.formatting(t.val[0])+" - "+t.formatting(t.val[1]):t.val[0]===t.val[1]?t.val[0]:t.val[0]+" - "+t.val[1])+"\n          ")])])],2)]),t._v(" "),t.isRange||t.data?t._e():i("input",{directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],staticClass:"vue-slider-sr-only",attrs:{type:"range",min:t.min,max:t.max},domProps:{value:t.val},on:{__r:function(e){t.val=e.target.value}}})],2)])},staticRenderFns:[]}},function(t,e,i){var s=i(3);"string"==typeof s&&(s=[[t.i,s,""]]),s.locals&&(t.exports=s.locals);i(8)("743d98f5",s,!0)},function(t,e,i){function s(t){for(var e=0;e<t.length;e++){var i=t[e],s=d[i.id];if(s){s.refs++;for(var r=0;r<s.parts.length;r++)s.parts[r](i.parts[r]);for(;r<i.parts.length;r++)s.parts.push(o(i.parts[r]));s.parts.length>i.parts.length&&(s.parts.length=i.parts.length)}else{for(var n=[],r=0;r<i.parts.length;r++)n.push(o(i.parts[r]));d[i.id]={id:i.id,refs:1,parts:n}}}}function r(){var t=document.createElement("style");return t.type="text/css",h.appendChild(t),t}function o(t){var e,i,s=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(s){if(f)return v;s.parentNode.removeChild(s)}if(m){var o=p++;s=c||(c=r()),e=n.bind(null,s,o,!1),i=n.bind(null,s,o,!0)}else s=r(),e=l.bind(null,s),i=function(){s.parentNode.removeChild(s)};return e(t),function(s){if(s){if(s.css===t.css&&s.media===t.media&&s.sourceMap===t.sourceMap)return;e(t=s)}else i()}}function n(t,e,i,s){var r=i?"":s.css;if(t.styleSheet)t.styleSheet.cssText=g(e,r);else{var o=document.createTextNode(r),n=t.childNodes;n[e]&&t.removeChild(n[e]),n.length?t.insertBefore(o,n[e]):t.appendChild(o)}}function l(t,e){var i=e.css,s=e.media,r=e.sourceMap;if(s&&t.setAttribute("media",s),r&&(i+="\n/*# sourceURL="+r.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=i;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(i))}}var a="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var u=i(9),d={},h=a&&(document.head||document.getElementsByTagName("head")[0]),c=null,p=0,f=!1,v=function(){},m="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,i){f=i;var r=u(t,e);return s(r),function(e){for(var i=[],o=0;o<r.length;o++){var n=r[o],l=d[n.id];l.refs--,i.push(l)}e?(r=u(t,e),s(r)):r=[];for(var o=0;o<i.length;o++){var l=i[o];if(0===l.refs){for(var a=0;a<l.parts.length;a++)l.parts[a]();delete d[l.id]}}}};var g=function(){var t=[];return function(e,i){return t[e]=i,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var i=[],s={},r=0;r<e.length;r++){var o=e[r],n=o[0],l=o[1],a=o[2],u=o[3],d={id:t+":"+r,css:l,media:a,sourceMap:u};s[n]?s[n].parts.push(d):i.push(s[n]={id:n,parts:[d]})}return i}}])});
 
 /***/ }),
 /* 51 */
diff --git a/public/themes/default/assets/mix-manifest.json b/public/themes/default/assets/mix-manifest.json
index 2141a2aae..b7e923adb 100644
--- a/public/themes/default/assets/mix-manifest.json
+++ b/public/themes/default/assets/mix-manifest.json
@@ -1,4 +1,4 @@
 {
     "/js/shop.js": "/js/shop.js",
     "/css/shop.css": "/css/shop.css"
-}
\ No newline at end of file
+}