From 4a648f549afedb2fa3c40ef7d6427bb75be8c98b Mon Sep 17 00:00:00 2001
From: rahul shukla <rahulshukla.symfony517@webkul.com>
Date: Thu, 14 Feb 2019 21:20:10 +0530
Subject: [PATCH 1/3] checkout with multiple address #210

---
 packages/Webkul/Checkout/src/Cart.php         |  62 +-
 .../src/Http/Requests/CustomerAddressForm.php |  56 +-
 .../Webkul/Shop/src/Resources/lang/en/app.php |   5 +-
 .../views/checkout/onepage.blade.php          |  34 +-
 .../checkout/onepage/customer-info.blade.php  | 945 +++++++++++++-----
 5 files changed, 776 insertions(+), 326 deletions(-)

diff --git a/packages/Webkul/Checkout/src/Cart.php b/packages/Webkul/Checkout/src/Cart.php
index 84cfe4534..b426d37d2 100755
--- a/packages/Webkul/Checkout/src/Cart.php
+++ b/packages/Webkul/Checkout/src/Cart.php
@@ -11,6 +11,7 @@ use Webkul\Product\Repositories\ProductRepository;
 use Webkul\Tax\Repositories\TaxCategoryRepository;
 use Webkul\Checkout\Models\CartPayment;
 use Webkul\Customer\Repositories\WishlistRepository;
+use Webkul\Customer\Repositories\CustomerAddressRepository;
 
 /**
  * Facades handler for all the methods to be implemented in Cart.
@@ -70,6 +71,13 @@ class Cart {
      */
     protected $wishlist;
 
+    /**
+     * CustomerAddressRepository model
+     *
+     * @var mixed
+     */
+     protected $customerAddress;
+
     /**
      * Suppress the session flash messages
      */
@@ -78,12 +86,13 @@ class Cart {
     /**
      * Create a new controller instance.
      *
-     * @param  Webkul\Checkout\Repositories\CartRepository        $cart
-     * @param  Webkul\Checkout\Repositories\CartItemRepository    $cartItem
-     * @param  Webkul\Checkout\Repositories\CartAddressRepository $cartAddress
-     * @param  Webkul\Customer\Repositories\CustomerRepository    $customer
-     * @param  Webkul\Product\Repositories\ProductRepository      $product
-     * @param  Webkul\Product\Repositories\TaxCategoryRepository  $taxCategory
+     * @param  Webkul\Checkout\Repositories\CartRepository            $cart
+     * @param  Webkul\Checkout\Repositories\CartItemRepository        $cartItem
+     * @param  Webkul\Checkout\Repositories\CartAddressRepository     $cartAddress
+     * @param  Webkul\Customer\Repositories\CustomerRepository        $customer
+     * @param  Webkul\Product\Repositories\ProductRepository          $product
+     * @param  Webkul\Product\Repositories\TaxCategoryRepository      $taxCategory
+     * @param  Webkul\Product\Repositories\CustomerAddressRepository  $customerAddress
      * @return void
      */
     public function __construct(
@@ -93,7 +102,8 @@ class Cart {
         CustomerRepository $customer,
         ProductRepository $product,
         TaxCategoryRepository $taxCategory,
-        WishlistRepository $wishlist
+        WishlistRepository $wishlist,
+        CustomerAddressRepository $customerAddress
     )
     {
         $this->customer = $customer;
@@ -110,6 +120,8 @@ class Cart {
 
         $this->wishlist = $wishlist;
 
+        $this->customerAddress = $customerAddress;
+
         $this->suppressFlash = false;
     }
 
@@ -617,6 +629,40 @@ class Cart {
         $shippingAddress = $data['shipping'];
         $billingAddress['cart_id'] = $shippingAddress['cart_id'] = $cart->id;
 
+        if (isset($data['billing']['address_id'])) {
+            $address = $this->customerAddress->findOneWhere(['id'=> $data['billing']['address_id']])->toArray();
+            $billingAddress['first_name'] = auth()->guard('customer')->user()->first_name;
+            $billingAddress['last_name'] = auth()->guard('customer')->user()->last_name;
+            $billingAddress['email'] = auth()->guard('customer')->user()->email;
+            $billingAddress['address1'] = $address['address1'];
+            $billingAddress['address2'] = $address['address2'];
+            $billingAddress['country'] = $address['country'];
+            $billingAddress['state'] = $address['state'];
+            $billingAddress['city'] = $address['city'];
+            $billingAddress['postcode'] = $address['postcode'];
+            $billingAddress['phone'] = $address['phone'];
+        }
+
+        if (isset($data['shipping']['address_id'])) {
+            $address = $this->customerAddress->findOneWhere(['id'=> $data['shipping']['address_id']])->toArray();
+            $shippingAddress['first_name'] = auth()->guard('customer')->user()->first_name;
+            $shippingAddress['last_name'] = auth()->guard('customer')->user()->last_name;
+            $shippingAddress['email'] = auth()->guard('customer')->user()->email;
+            $shippingAddress['address1'] = $address['address1'];
+            $shippingAddress['address2'] = $address['address2'];
+            $shippingAddress['country'] = $address['country'];
+            $shippingAddress['state'] = $address['state'];
+            $shippingAddress['city'] = $address['city'];
+            $shippingAddress['postcode'] = $address['postcode'];
+            $shippingAddress['phone'] = $address['phone'];
+        }
+
+        // if (auth()->guard('customer')->check()) {
+        //     if ($data['billing']['use_for_shipping'] == true) {
+        //         $shippingAddress = $billingAddress;
+        //     }
+        // }
+
         if ($billingAddressModel = $cart->billing_address) {
             $this->cartAddress->update($billingAddress, $billingAddressModel->id);
 
@@ -814,7 +860,7 @@ class Cart {
                     }
                 }
             }
-            
+
             return true;
         }
     }
diff --git a/packages/Webkul/Checkout/src/Http/Requests/CustomerAddressForm.php b/packages/Webkul/Checkout/src/Http/Requests/CustomerAddressForm.php
index ce619e8d6..0ead62731 100755
--- a/packages/Webkul/Checkout/src/Http/Requests/CustomerAddressForm.php
+++ b/packages/Webkul/Checkout/src/Http/Requests/CustomerAddressForm.php
@@ -26,30 +26,42 @@ class CustomerAddressForm extends FormRequest
      */
     public function rules()
     {
-        $this->rules = [
-            'billing.first_name' => ['required'],
-            'billing.last_name' => ['required'],
-            'billing.email' => ['required'],
-            'billing.address1' => ['required'],
-            'billing.city' => ['required'],
-            'billing.state' => ['required'],
-            'billing.postcode' => ['required'],
-            'billing.phone' => ['required'],
-            'billing.country' => ['required']
-        ];
+        if (isset($this->get('billing')['address_id'])) {
+            $this->rules = [
+                'billing.address_id' => ['required'],
+            ];
+        } else {
+            $this->rules = [
+                'billing.first_name' => ['required'],
+                'billing.last_name' => ['required'],
+                'billing.email' => ['required'],
+                'billing.address1' => ['required'],
+                'billing.city' => ['required'],
+                'billing.state' => ['required'],
+                'billing.postcode' => ['required'],
+                'billing.phone' => ['required'],
+                'billing.country' => ['required']
+            ];
+        }
 
         if (isset($this->get('billing')['use_for_shipping']) && !$this->get('billing')['use_for_shipping']) {
-            $this->rules = array_merge($this->rules, [
-                'shipping.first_name' => ['required'],
-                'shipping.last_name' => ['required'],
-                'shipping.email' => ['required'],
-                'shipping.address1' => ['required'],
-                'shipping.city' => ['required'],
-                'shipping.state' => ['required'],
-                'shipping.postcode' => ['required'],
-                'shipping.phone' => ['required'],
-                'shipping.country' => ['required']
-            ]);
+            if (isset($this->get('shipping')['address_id'])) {
+                $this->rules = array_merge($this->rules, [
+                    'shipping.address_id' => ['required'],
+                ]);
+            } else {
+                $this->rules = array_merge($this->rules, [
+                    'shipping.first_name' => ['required'],
+                    'shipping.last_name' => ['required'],
+                    'shipping.email' => ['required'],
+                    'shipping.address1' => ['required'],
+                    'shipping.city' => ['required'],
+                    'shipping.state' => ['required'],
+                    'shipping.postcode' => ['required'],
+                    'shipping.phone' => ['required'],
+                    'shipping.country' => ['required']
+                ]);
+            }
         }
 
         return $this->rules;
diff --git a/packages/Webkul/Shop/src/Resources/lang/en/app.php b/packages/Webkul/Shop/src/Resources/lang/en/app.php
index 2d89c9907..ee8f5c9c8 100755
--- a/packages/Webkul/Shop/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Shop/src/Resources/lang/en/app.php
@@ -9,7 +9,7 @@ return [
         'wishlist' => 'Wishlist',
         'orders' => 'Orders',
     ],
-    
+
     'common' => [
         'error' => 'Something went wrong, please try again later.'
     ],
@@ -421,7 +421,8 @@ return [
             'billing-address' => 'Billing Address',
             'shipping-address' => 'Shipping Address',
             'contact' => 'Contact',
-            'place-order' => 'Place Order'
+            'place-order' => 'Place Order',
+            'new-address' => 'Add New Address'
         ],
 
         'total' => [
diff --git a/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php b/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php
index cf1198d82..86d9fec57 100755
--- a/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php
@@ -117,17 +117,6 @@
         var paymentHtml = '';
         var reviewHtml = '';
         var summaryHtml = Vue.compile(`<?php echo view('shop::checkout.total.summary', ['cart' => $cart])->render(); ?>`);
-        var customerAddress = null;
-        @auth('customer')
-            @if (auth('customer')->user()->default_address)
-                customerAddress = @json(auth('customer')->user()->default_address);
-            @else
-                customerAddress = {};
-            @endif
-            customerAddress.email = "{{ auth('customer')->user()->email }}";
-            customerAddress.first_name = "{{ auth('customer')->user()->first_name }}";
-            customerAddress.last_name = "{{ auth('customer')->user()->last_name }}";
-        @endauth
 
         Vue.component('checkout', {
 
@@ -142,7 +131,7 @@
 
                 address: {
                     billing: {
-                        use_for_shipping: true
+                        use_for_shipping: true,
                     },
 
                     shipping: {},
@@ -154,16 +143,13 @@
 
                 disable_button: false,
 
+                new_shipping_address: false,
+
+                new_billing_address: false,
+
                 countryStates: @json(core()->groupedStatesByCountries())
             }),
 
-            created() {
-                if (customerAddress) {
-                    this.address.billing = customerAddress;
-                    this.address.use_for_shipping = true;
-                }
-            },
-
             methods: {
                 navigateToStep (step) {
                     if (step <= this.completedStep) {
@@ -175,7 +161,7 @@
                 haveStates(addressType) {
                     if (this.countryStates[this.address[addressType].country] && this.countryStates[this.address[addressType].country].length)
                         return true;
-                    
+
                     return false;
                 },
 
@@ -300,6 +286,14 @@
 
                 paymentMethodSelected (paymentMethod) {
                     this.selected_payment_method = paymentMethod;
+                },
+
+                newBillingAddress() {
+                    this.new_billing_address = true;
+                },
+
+                newShippingAddress() {
+                    this.new_shipping_address = true;
                 }
             }
         })
diff --git a/packages/Webkul/Shop/src/Resources/views/checkout/onepage/customer-info.blade.php b/packages/Webkul/Shop/src/Resources/views/checkout/onepage/customer-info.blade.php
index 4934a0b5f..550e4739e 100755
--- a/packages/Webkul/Shop/src/Resources/views/checkout/onepage/customer-info.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/checkout/onepage/customer-info.blade.php
@@ -1,300 +1,697 @@
 <form data-vv-scope="address-form">
+    <?php
+        $enableMultiAddress = false;
 
-    <div class="form-container">
+        if(auth()->guard('customer')->check()) {
+            $addresses = auth()->guard('customer')->user()->addresses;
 
-        <div class="form-header">
-            <h1>{{ __('shop::app.checkout.onepage.billing-address') }}</h1>
+            if(isset($addresses) && count($addresses)) {
+                $enableMultiAddress = true;
+            }
+        }
+    ?>
 
-            @guest('customer')
-                <a href="{{ route('customer.session.index') }}" class="btn btn-lg btn-primary">
-                    {{ __('shop::app.checkout.onepage.sign-in') }}
+    @if ($enableMultiAddress)
+        <div class="form-container" v-if="!this.new_billing_address">
+            <div class="form-header">
+                <h1>{{ __('shop::app.checkout.onepage.billing-address') }}</h1>
+
+                <a class="btn btn-lg btn-primary" @click = newBillingAddress()>
+                    {{ __('shop::app.checkout.onepage.new-address') }}
                 </a>
-            @endguest
-        </div>
+            </div>
+            <div class="address-holder">
+                @foreach ($addresses as $address)
+                    <div class="address-card-1">
+                        <div class="details" style="margin-left: 20px">
 
-        <div class="control-group" :class="[errors.has('address-form.billing[first_name]') ? 'has-error' : '']">
-            <label for="billing[first_name]" class="required">
-                {{ __('shop::app.checkout.onepage.first-name') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="billing[first_name]" name="billing[first_name]" v-model="address.billing.first_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.first-name') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.billing[first_name]')">
-                @{{ errors.first('address-form.billing[first_name]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.billing[last_name]') ? 'has-error' : '']">
-            <label for="billing[last_name]" class="required">
-                {{ __('shop::app.checkout.onepage.last-name') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="billing[last_name]" name="billing[last_name]" v-model="address.billing.last_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.last-name') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.billing[last_name]')">
-                @{{ errors.first('address-form.billing[last_name]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.billing[email]') ? 'has-error' : '']">
-            <label for="billing[email]" class="required">
-                {{ __('shop::app.checkout.onepage.email') }}
-            </label>
-
-            <input type="text" v-validate="'required|email'" class="control" id="billing[email]" name="billing[email]" v-model="address.billing.email" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.email') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.billing[email]')">
-                @{{ errors.first('address-form.billing[email]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.billing[address1]') ? 'has-error' : '']">
-            <label for="billing[address1]" class="required">
-                {{ __('shop::app.checkout.onepage.address1') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="billing[address1]" name="billing[address1]" v-model="address.billing.address1" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.address1') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.billing[address1]')">
-                @{{ errors.first('address-form.billing[address1]') }}
-            </span>
-        </div>
-
-        <div class="control-group">
-            <label for="billing[address2]">
-                {{ __('shop::app.checkout.onepage.address2') }}
-            </label>
-
-            <input type="text" class="control" id="billing[address2]" name="billing[address2]" v-model="address.billing.address2"/>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.billing[city]') ? 'has-error' : '']">
-            <label for="billing[city]" class="required">
-                {{ __('shop::app.checkout.onepage.city') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="billing[city]" name="billing[city]" v-model="address.billing.city" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.city') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.billing[city]')">
-                @{{ errors.first('address-form.billing[city]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.billing[state]') ? 'has-error' : '']">
-            <label for="billing[state]" class="required">
-                {{ __('shop::app.checkout.onepage.state') }}
-            </label>
-
-
-            <input type="text" v-validate="'required'" class="control" id="billing[state]" name="billing[state]" v-model="address.billing.state" v-if="!haveStates('billing')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;"/>
-
-            <select v-validate="'required'" class="control" id="billing[state]" name="billing[state]" v-model="address.billing.state" v-if="haveStates('billing')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;">
-
-                <option value="">{{ __('shop::app.checkout.onepage.select-state') }}</option>
-
-                <option v-for='(state, index) in countryStates[address.billing.country]' :value="state.code">
-                    @{{ state.default_name }}
-                </option>
-
-            </select>
-
-            <span class="control-error" v-if="errors.has('address-form.billing[state]')">
-                @{{ errors.first('address-form.billing[state]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.billing[postcode]') ? 'has-error' : '']">
-            <label for="billing[postcode]" class="required">
-                {{ __('shop::app.checkout.onepage.postcode') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="billing[postcode]" name="billing[postcode]" v-model="address.billing.postcode" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.postcode') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.billing[postcode]')">
-                @{{ errors.first('address-form.billing[postcode]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.billing[country]') ? 'has-error' : '']">
-            <label for="billing[country]" class="required">
-                {{ __('shop::app.checkout.onepage.country') }}
-            </label>
-
-            <select type="text" v-validate="'required'" class="control" id="billing[country]" name="billing[country]" v-model="address.billing.country" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.country') }}&quot;">
-                <option value=""></option>
-
-                @foreach (core()->countries() as $country)
-
-                    <option value="{{ $country->code }}">{{ $country->name }}</option>
+                            <label class="radio-container">
+                                <input type="radio" v-validate="'required'" id="billing[address_id]" name="billing[address_id]" v-model="address.billing.address_id" value="{{ $address->id }}" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.billing-address') }}&quot;"  style="border: 1px solid black;" >
+                                <span class="checkmark" style="left: -20px;
+                                top: 12px;"></span>
+                            </label>
 
+                            <span class="bold">{{ auth()->guard('customer')->user()->name }}</span>
+                            {{ $address->name }}</br>
+                            {{ $address->address1 }}, {{ $address->address2 ? $address->address2 . ',' : '' }}</br>
+                            {{ $address->city }}</br>
+                            {{ $address->state }}</br>
+                            {{ country()->name($address->country) }} {{ $address->postcode }}</br></br>
+                            {{ __('shop::app.customer.account.address.index.contact') }} : {{ $address->phone }}
+                        </div>
+                    </div>
                 @endforeach
-            </select>
 
-            <span class="control-error" v-if="errors.has('address-form.billing[country]')">
-                @{{ errors.first('address-form.billing[country]') }}
-            </span>
+                <div class="control-group" :class="[errors.has('address-form.billing[address_id]') ? 'has-error' : '']">
+                    <span class="control-error" v-if="errors.has('address-form.billing[address_id]')">
+                        @{{ errors.first('address-form.billing[address_id]') }}
+                    </span>
+                </div>
+
+            </div>
+            <div class="control-group">
+                <span class="checkbox">
+                    <input type="checkbox" id="billing[use_for_shipping]" name="billing[use_for_shipping]" v-model="address.billing.use_for_shipping"/>
+                        <label class="checkbox-view" for="billing[use_for_shipping]"></label>
+                        {{ __('shop::app.checkout.onepage.use_for_shipping') }}
+                </span>
+
+            </div>
         </div>
 
-        <div class="control-group" :class="[errors.has('address-form.billing[phone]') ? 'has-error' : '']">
-            <label for="billing[phone]" class="required">
-                {{ __('shop::app.checkout.onepage.phone') }}
-            </label>
+        <div class="form-container" v-if="this.new_billing_address">
 
-            <input type="text" v-validate="'required'" class="control" id="billing[phone]" name="billing[phone]" v-model="address.billing.phone" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.phone') }}&quot;"/>
+            <div class="form-header">
+                <h1>{{ __('shop::app.checkout.onepage.billing-address') }}</h1>
 
-            <span class="control-error" v-if="errors.has('address-form.billing[phone]')">
-                @{{ errors.first('address-form.billing[phone]') }}
-            </span>
+                @guest('customer')
+                    <a class="btn btn-lg btn-primary">
+                        {{ __('shop::app.checkout.onepage.sign-in') }}
+                    </a>
+                @endguest
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[first_name]') ? 'has-error' : '']">
+                <label for="billing[first_name]" class="required">
+                    {{ __('shop::app.checkout.onepage.first-name') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[first_name]" name="billing[first_name]" v-model="address.billing.first_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.first-name') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[first_name]')">
+                    @{{ errors.first('address-form.billing[first_name]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[last_name]') ? 'has-error' : '']">
+                <label for="billing[last_name]" class="required">
+                    {{ __('shop::app.checkout.onepage.last-name') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[last_name]" name="billing[last_name]" v-model="address.billing.last_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.last-name') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[last_name]')">
+                    @{{ errors.first('address-form.billing[last_name]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[email]') ? 'has-error' : '']">
+                <label for="billing[email]" class="required">
+                    {{ __('shop::app.checkout.onepage.email') }}
+                </label>
+
+                <input type="text" v-validate="'required|email'" class="control" id="billing[email]" name="billing[email]" v-model="address.billing.email" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.email') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[email]')">
+                    @{{ errors.first('address-form.billing[email]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[address1]') ? 'has-error' : '']">
+                <label for="billing[address1]" class="required">
+                    {{ __('shop::app.checkout.onepage.address1') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[address1]" name="billing[address1]" v-model="address.billing.address1" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.address1') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[address1]')">
+                    @{{ errors.first('address-form.billing[address1]') }}
+                </span>
+            </div>
+
+            <div class="control-group">
+                <label for="billing[address2]">
+                    {{ __('shop::app.checkout.onepage.address2') }}
+                </label>
+
+                <input type="text" class="control" id="billing[address2]" name="billing[address2]" v-model="address.billing.address2"/>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[city]') ? 'has-error' : '']">
+                <label for="billing[city]" class="required">
+                    {{ __('shop::app.checkout.onepage.city') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[city]" name="billing[city]" v-model="address.billing.city" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.city') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[city]')">
+                    @{{ errors.first('address-form.billing[city]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[state]') ? 'has-error' : '']">
+                <label for="billing[state]" class="required">
+                    {{ __('shop::app.checkout.onepage.state') }}
+                </label>
+
+
+                <input type="text" v-validate="'required'" class="control" id="billing[state]" name="billing[state]" v-model="address.billing.state" v-if="!haveStates('billing')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;"/>
+
+                <select v-validate="'required'" class="control" id="billing[state]" name="billing[state]" v-model="address.billing.state" v-if="haveStates('billing')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;">
+
+                    <option value="">{{ __('shop::app.checkout.onepage.select-state') }}</option>
+
+                    <option v-for='(state, index) in countryStates[address.billing.country]' :value="state.code">
+                        @{{ state.default_name }}
+                    </option>
+
+                </select>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[state]')">
+                    @{{ errors.first('address-form.billing[state]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[postcode]') ? 'has-error' : '']">
+                <label for="billing[postcode]" class="required">
+                    {{ __('shop::app.checkout.onepage.postcode') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[postcode]" name="billing[postcode]" v-model="address.billing.postcode" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.postcode') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[postcode]')">
+                    @{{ errors.first('address-form.billing[postcode]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[country]') ? 'has-error' : '']">
+                <label for="billing[country]" class="required">
+                    {{ __('shop::app.checkout.onepage.country') }}
+                </label>
+
+                <select type="text" v-validate="'required'" class="control" id="billing[country]" name="billing[country]" v-model="address.billing.country" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.country') }}&quot;">
+                    <option value=""></option>
+
+                    @foreach (core()->countries() as $country)
+
+                        <option value="{{ $country->code }}">{{ $country->name }}</option>
+
+                    @endforeach
+                </select>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[country]')">
+                    @{{ errors.first('address-form.billing[country]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[phone]') ? 'has-error' : '']">
+                <label for="billing[phone]" class="required">
+                    {{ __('shop::app.checkout.onepage.phone') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[phone]" name="billing[phone]" v-model="address.billing.phone" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.phone') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[phone]')">
+                    @{{ errors.first('address-form.billing[phone]') }}
+                </span>
+            </div>
+
+            <div class="control-group">
+                <span class="checkbox">
+                    <input type="checkbox" id="billing[use_for_shipping]" name="billing[use_for_shipping]" v-model="address.billing.use_for_shipping"/>
+                    <label class="checkbox-view" for="billing[use_for_shipping]"></label>
+                    {{ __('shop::app.checkout.onepage.use_for_shipping') }}
+                </span>
+
+            </div>
         </div>
 
-        <div class="control-group">
-            <span class="checkbox">
-                <input type="checkbox" id="billing[use_for_shipping]" name="billing[use_for_shipping]" v-model="address.billing.use_for_shipping"/>
-                <label class="checkbox-view" for="billing[use_for_shipping]"></label>
-                {{ __('shop::app.checkout.onepage.use_for_shipping') }}
-            </span>
+        <div class="form-container" v-if="!address.billing.use_for_shipping && !this.new_shipping_address">
+            <div class="form-header">
+                <h1>{{ __('shop::app.checkout.onepage.shipping-address') }}</h1>
 
-        </div>
-    </div>
+                <a class="btn btn-lg btn-primary" @click=newShippingAddress()>
+                    {{ __('shop::app.checkout.onepage.new-address') }}
+                </a>
+            </div>
+            <div class="address-holder">
+                @foreach ($addresses as $address)
+                    <div class="address-card-1">
+                        <div class="details" style="margin-left: 20px">
 
-    <div class="form-container" v-if="!address.billing.use_for_shipping">
+                            <label class="radio-container">
+                                <input v-validate="'required'" type="radio" id="shipping[address_id]" name="shipping[address_id]" v-model="address.shipping.address_id" value="{{ $address->id }}"
+                                data-vv-as="&quot;{{ __('shop::app.checkout.onepage.shipping-address') }}&quot;"  style="border: 1px solid black;">
+                                <span class="checkmark" style="left: -20px;
+                                top: 12px;"></span>
+                            </label>
 
-        <div class="form-header">
-            <h1>{{ __('shop::app.checkout.onepage.shipping-address') }}</h1>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.shipping[first_name]') ? 'has-error' : '']">
-            <label for="shipping[first_name]" class="required">
-                {{ __('shop::app.checkout.onepage.first-name') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="shipping[first_name]" name="shipping[first_name]" v-model="address.shipping.first_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.first-name') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.shipping[first_name]')">
-                @{{ errors.first('address-form.shipping[first_name]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.shipping[last_name]') ? 'has-error' : '']">
-            <label for="shipping[last_name]" class="required">
-                {{ __('shop::app.checkout.onepage.last-name') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="shipping[last_name]" name="shipping[last_name]" v-model="address.shipping.last_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.last-name') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.shipping[last_name]')">
-                @{{ errors.first('address-form.shipping[last_name]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.shipping[email]') ? 'has-error' : '']">
-            <label for="shipping[email]" class="required">
-                {{ __('shop::app.checkout.onepage.email') }}
-            </label>
-
-            <input type="text" v-validate="'required|email'" class="control" id="shipping[email]" name="shipping[email]" v-model="address.shipping.email" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.email') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.shipping[email]')">
-                @{{ errors.first('address-form.shipping[email]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.shipping[address1]') ? 'has-error' : '']">
-            <label for="shipping[address1]" class="required">
-                {{ __('shop::app.checkout.onepage.address1') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="shipping[address1]" name="shipping[address1]" v-model="address.shipping.address1" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.address1') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.shipping[address1]')">
-                @{{ errors.first('address-form.shipping[address1]') }}
-            </span>
-        </div>
-
-        <div class="control-group">
-            <label for="shipping[address2]">
-                {{ __('shop::app.checkout.onepage.address2') }}
-            </label>
-
-            <input type="text" class="control" id="shipping[address2]" name="shipping[address2]" v-model="address.shipping.address2"/>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.shipping[city]') ? 'has-error' : '']">
-            <label for="shipping[city]" class="required">
-                {{ __('shop::app.checkout.onepage.city') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="shipping[city]" name="shipping[city]" v-model="address.shipping.city" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.city') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.shipping[city]')">
-                @{{ errors.first('address-form.shipping[city]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.shipping[state]') ? 'has-error' : '']">
-            <label for="shipping[state]" class="required">
-                {{ __('shop::app.checkout.onepage.state') }}
-            </label>
-
-
-            <input type="text" v-validate="'required'" class="control" id="shipping[state]" name="shipping[state]" v-model="address.shipping.state" v-if="!haveStates('shipping')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;"/>
-
-            <select v-validate="'required'" class="control" id="shipping[state]" name="shipping[state]" v-model="address.shipping.state" v-if="haveStates('shipping')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;">
-
-                <option value="">{{ __('shop::app.checkout.onepage.select-state') }}</option>
-
-                <option v-for='(state, index) in countryStates[address.shipping.country]' :value="state.code">
-                    @{{ state.default_name }}
-                </option>
-
-            </select>
-
-            <span class="control-error" v-if="errors.has('address-form.shipping[state]')">
-                @{{ errors.first('address-form.shipping[state]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.shipping[postcode]') ? 'has-error' : '']">
-            <label for="shipping[postcode]" class="required">
-                {{ __('shop::app.checkout.onepage.postcode') }}
-            </label>
-
-            <input type="text" v-validate="'required'" class="control" id="shipping[postcode]" name="shipping[postcode]" v-model="address.shipping.postcode" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.postcode') }}&quot;"/>
-
-            <span class="control-error" v-if="errors.has('address-form.shipping[postcode]')">
-                @{{ errors.first('address-form.shipping[postcode]') }}
-            </span>
-        </div>
-
-        <div class="control-group" :class="[errors.has('address-form.shipping[country]') ? 'has-error' : '']">
-            <label for="shipping[country]" class="required">
-                {{ __('shop::app.checkout.onepage.country') }}
-            </label>
-
-            <select type="text" v-validate="'required'" class="control" id="shipping[country]" name="shipping[country]" v-model="address.shipping.country" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.country') }}&quot;">
-                <option value=""></option>
-
-                @foreach (core()->countries() as $country)
-                    <option value="{{ $country->code }}">{{ $country->name }}</option>
+                            <span class="bold">{{ auth()->guard('customer')->user()->name }}</span>
+                            {{ $address->name }}</br>
+                            {{ $address->address1 }}, {{ $address->address2 ? $address->address2 . ',' : '' }}</br>
+                            {{ $address->city }}</br>
+                            {{ $address->state }}</br>
+                            {{ country()->name($address->country) }} {{ $address->postcode }}</br></br>
+                            {{ __('shop::app.customer.account.address.index.contact') }} : {{ $address->phone }}
+                        </div>
+                    </div>
                 @endforeach
-            </select>
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[country]')">
-                @{{ errors.first('address-form.shipping[country]') }}
-            </span>
+                <div class="control-group" :class="[errors.has('address-form.shipping[address_id]') ? 'has-error' : '']">
+                    <span class="control-error" v-if="errors.has('address-form.shipping[address_id]')">
+                        @{{ errors.first('address-form.shipping[address_id]') }}
+                    </span>
+                </div>
+
+            </div>
         </div>
 
-        <div class="control-group" :class="[errors.has('address-form.shipping[phone]') ? 'has-error' : '']">
-            <label for="shipping[phone]" class="required">
-                {{ __('shop::app.checkout.onepage.phone') }}
-            </label>
+        <div class="form-container" v-if="!address.billing.use_for_shipping && this.new_shipping_address">
 
-            <input type="text" v-validate="'required'" class="control" id="shipping[phone]" name="shipping[phone]" v-model="address.shipping.phone" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.phone') }}&quot;"/>
+            <div class="form-header">
+                <h1>{{ __('shop::app.checkout.onepage.shipping-address') }}</h1>
+            </div>
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[phone]')">
-                @{{ errors.first('address-form.shipping[phone]') }}
-            </span>
+            <div class="control-group" :class="[errors.has('address-form.shipping[first_name]') ? 'has-error' : '']">
+                <label for="shipping[first_name]" class="required">
+                    {{ __('shop::app.checkout.onepage.first-name') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[first_name]" name="shipping[first_name]" v-model="address.shipping.first_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.first-name') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[first_name]')">
+                    @{{ errors.first('address-form.shipping[first_name]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[last_name]') ? 'has-error' : '']">
+                <label for="shipping[last_name]" class="required">
+                    {{ __('shop::app.checkout.onepage.last-name') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[last_name]" name="shipping[last_name]" v-model="address.shipping.last_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.last-name') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[last_name]')">
+                    @{{ errors.first('address-form.shipping[last_name]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[email]') ? 'has-error' : '']">
+                <label for="shipping[email]" class="required">
+                    {{ __('shop::app.checkout.onepage.email') }}
+                </label>
+
+                <input type="text" v-validate="'required|email'" class="control" id="shipping[email]" name="shipping[email]" v-model="address.shipping.email" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.email') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[email]')">
+                    @{{ errors.first('address-form.shipping[email]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[address1]') ? 'has-error' : '']">
+                <label for="shipping[address1]" class="required">
+                    {{ __('shop::app.checkout.onepage.address1') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[address1]" name="shipping[address1]" v-model="address.shipping.address1" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.address1') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[address1]')">
+                    @{{ errors.first('address-form.shipping[address1]') }}
+                </span>
+            </div>
+
+            <div class="control-group">
+                <label for="shipping[address2]">
+                    {{ __('shop::app.checkout.onepage.address2') }}
+                </label>
+
+                <input type="text" class="control" id="shipping[address2]" name="shipping[address2]" v-model="address.shipping.address2"/>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[city]') ? 'has-error' : '']">
+                <label for="shipping[city]" class="required">
+                    {{ __('shop::app.checkout.onepage.city') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[city]" name="shipping[city]" v-model="address.shipping.city" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.city') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[city]')">
+                    @{{ errors.first('address-form.shipping[city]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[state]') ? 'has-error' : '']">
+                <label for="shipping[state]" class="required">
+                    {{ __('shop::app.checkout.onepage.state') }}
+                </label>
+
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[state]" name="shipping[state]" v-model="address.shipping.state" v-if="!haveStates('shipping')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;"/>
+
+                <select v-validate="'required'" class="control" id="shipping[state]" name="shipping[state]" v-model="address.shipping.state" v-if="haveStates('shipping')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;">
+
+                    <option value="">{{ __('shop::app.checkout.onepage.select-state') }}</option>
+
+                    <option v-for='(state, index) in countryStates[address.shipping.country]' :value="state.code">
+                        @{{ state.default_name }}
+                    </option>
+
+                </select>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[state]')">
+                    @{{ errors.first('address-form.shipping[state]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[postcode]') ? 'has-error' : '']">
+                <label for="shipping[postcode]" class="required">
+                    {{ __('shop::app.checkout.onepage.postcode') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[postcode]" name="shipping[postcode]" v-model="address.shipping.postcode" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.postcode') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[postcode]')">
+                    @{{ errors.first('address-form.shipping[postcode]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[country]') ? 'has-error' : '']">
+                <label for="shipping[country]" class="required">
+                    {{ __('shop::app.checkout.onepage.country') }}
+                </label>
+
+                <select type="text" v-validate="'required'" class="control" id="shipping[country]" name="shipping[country]" v-model="address.shipping.country" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.country') }}&quot;">
+                    <option value=""></option>
+
+                    @foreach (core()->countries() as $country)
+                        <option value="{{ $country->code }}">{{ $country->name }}</option>
+                    @endforeach
+                </select>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[country]')">
+                    @{{ errors.first('address-form.shipping[country]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[phone]') ? 'has-error' : '']">
+                <label for="shipping[phone]" class="required">
+                    {{ __('shop::app.checkout.onepage.phone') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[phone]" name="shipping[phone]" v-model="address.shipping.phone" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.phone') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[phone]')">
+                    @{{ errors.first('address-form.shipping[phone]') }}
+                </span>
+            </div>
         </div>
-    </div>
+    @else
+        <div class="form-container">
 
-</form>
\ No newline at end of file
+            <div class="form-header">
+                <h1>{{ __('shop::app.checkout.onepage.billing-address') }}</h1>
+
+                @guest('customer')
+                    <a class="btn btn-lg btn-primary">
+                        {{ __('shop::app.checkout.onepage.sign-in') }}
+                    </a>
+                @endguest
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[first_name]') ? 'has-error' : '']">
+                <label for="billing[first_name]" class="required">
+                    {{ __('shop::app.checkout.onepage.first-name') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[first_name]" name="billing[first_name]" v-model="address.billing.first_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.first-name') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[first_name]')">
+                    @{{ errors.first('address-form.billing[first_name]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[last_name]') ? 'has-error' : '']">
+                <label for="billing[last_name]" class="required">
+                    {{ __('shop::app.checkout.onepage.last-name') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[last_name]" name="billing[last_name]" v-model="address.billing.last_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.last-name') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[last_name]')">
+                    @{{ errors.first('address-form.billing[last_name]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[email]') ? 'has-error' : '']">
+                <label for="billing[email]" class="required">
+                    {{ __('shop::app.checkout.onepage.email') }}
+                </label>
+
+                <input type="text" v-validate="'required|email'" class="control" id="billing[email]" name="billing[email]" v-model="address.billing.email" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.email') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[email]')">
+                    @{{ errors.first('address-form.billing[email]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[address1]') ? 'has-error' : '']">
+                <label for="billing[address1]" class="required">
+                    {{ __('shop::app.checkout.onepage.address1') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[address1]" name="billing[address1]" v-model="address.billing.address1" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.address1') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[address1]')">
+                    @{{ errors.first('address-form.billing[address1]') }}
+                </span>
+            </div>
+
+            <div class="control-group">
+                <label for="billing[address2]">
+                    {{ __('shop::app.checkout.onepage.address2') }}
+                </label>
+
+                <input type="text" class="control" id="billing[address2]" name="billing[address2]" v-model="address.billing.address2"/>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[city]') ? 'has-error' : '']">
+                <label for="billing[city]" class="required">
+                    {{ __('shop::app.checkout.onepage.city') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[city]" name="billing[city]" v-model="address.billing.city" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.city') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[city]')">
+                    @{{ errors.first('address-form.billing[city]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[state]') ? 'has-error' : '']">
+                <label for="billing[state]" class="required">
+                    {{ __('shop::app.checkout.onepage.state') }}
+                </label>
+
+
+                <input type="text" v-validate="'required'" class="control" id="billing[state]" name="billing[state]" v-model="address.billing.state" v-if="!haveStates('billing')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;"/>
+
+                <select v-validate="'required'" class="control" id="billing[state]" name="billing[state]" v-model="address.billing.state" v-if="haveStates('billing')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;">
+
+                    <option value="">{{ __('shop::app.checkout.onepage.select-state') }}</option>
+
+                    <option v-for='(state, index) in countryStates[address.billing.country]' :value="state.code">
+                        @{{ state.default_name }}
+                    </option>
+
+                </select>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[state]')">
+                    @{{ errors.first('address-form.billing[state]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[postcode]') ? 'has-error' : '']">
+                <label for="billing[postcode]" class="required">
+                    {{ __('shop::app.checkout.onepage.postcode') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[postcode]" name="billing[postcode]" v-model="address.billing.postcode" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.postcode') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[postcode]')">
+                    @{{ errors.first('address-form.billing[postcode]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[country]') ? 'has-error' : '']">
+                <label for="billing[country]" class="required">
+                    {{ __('shop::app.checkout.onepage.country') }}
+                </label>
+
+                <select type="text" v-validate="'required'" class="control" id="billing[country]" name="billing[country]" v-model="address.billing.country" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.country') }}&quot;">
+                    <option value=""></option>
+
+                    @foreach (core()->countries() as $country)
+
+                        <option value="{{ $country->code }}">{{ $country->name }}</option>
+
+                    @endforeach
+                </select>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[country]')">
+                    @{{ errors.first('address-form.billing[country]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.billing[phone]') ? 'has-error' : '']">
+                <label for="billing[phone]" class="required">
+                    {{ __('shop::app.checkout.onepage.phone') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="billing[phone]" name="billing[phone]" v-model="address.billing.phone" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.phone') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.billing[phone]')">
+                    @{{ errors.first('address-form.billing[phone]') }}
+                </span>
+            </div>
+
+            <div class="control-group">
+                <span class="checkbox">
+                    <input type="checkbox" id="billing[use_for_shipping]" name="billing[use_for_shipping]" v-model="address.billing.use_for_shipping"/>
+                    <label class="checkbox-view" for="billing[use_for_shipping]"></label>
+                    {{ __('shop::app.checkout.onepage.use_for_shipping') }}
+                </span>
+
+            </div>
+        </div>
+
+        <div class="form-container" v-if="!address.billing.use_for_shipping">
+
+            <div class="form-header">
+                <h1>{{ __('shop::app.checkout.onepage.shipping-address') }}</h1>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[first_name]') ? 'has-error' : '']">
+                <label for="shipping[first_name]" class="required">
+                    {{ __('shop::app.checkout.onepage.first-name') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[first_name]" name="shipping[first_name]" v-model="address.shipping.first_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.first-name') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[first_name]')">
+                    @{{ errors.first('address-form.shipping[first_name]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[last_name]') ? 'has-error' : '']">
+                <label for="shipping[last_name]" class="required">
+                    {{ __('shop::app.checkout.onepage.last-name') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[last_name]" name="shipping[last_name]" v-model="address.shipping.last_name" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.last-name') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[last_name]')">
+                    @{{ errors.first('address-form.shipping[last_name]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[email]') ? 'has-error' : '']">
+                <label for="shipping[email]" class="required">
+                    {{ __('shop::app.checkout.onepage.email') }}
+                </label>
+
+                <input type="text" v-validate="'required|email'" class="control" id="shipping[email]" name="shipping[email]" v-model="address.shipping.email" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.email') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[email]')">
+                    @{{ errors.first('address-form.shipping[email]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[address1]') ? 'has-error' : '']">
+                <label for="shipping[address1]" class="required">
+                    {{ __('shop::app.checkout.onepage.address1') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[address1]" name="shipping[address1]" v-model="address.shipping.address1" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.address1') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[address1]')">
+                    @{{ errors.first('address-form.shipping[address1]') }}
+                </span>
+            </div>
+
+            <div class="control-group">
+                <label for="shipping[address2]">
+                    {{ __('shop::app.checkout.onepage.address2') }}
+                </label>
+
+                <input type="text" class="control" id="shipping[address2]" name="shipping[address2]" v-model="address.shipping.address2"/>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[city]') ? 'has-error' : '']">
+                <label for="shipping[city]" class="required">
+                    {{ __('shop::app.checkout.onepage.city') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[city]" name="shipping[city]" v-model="address.shipping.city" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.city') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[city]')">
+                    @{{ errors.first('address-form.shipping[city]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[state]') ? 'has-error' : '']">
+                <label for="shipping[state]" class="required">
+                    {{ __('shop::app.checkout.onepage.state') }}
+                </label>
+
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[state]" name="shipping[state]" v-model="address.shipping.state" v-if="!haveStates('shipping')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;"/>
+
+                <select v-validate="'required'" class="control" id="shipping[state]" name="shipping[state]" v-model="address.shipping.state" v-if="haveStates('shipping')" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.state') }}&quot;">
+
+                    <option value="">{{ __('shop::app.checkout.onepage.select-state') }}</option>
+
+                    <option v-for='(state, index) in countryStates[address.shipping.country]' :value="state.code">
+                        @{{ state.default_name }}
+                    </option>
+
+                </select>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[state]')">
+                    @{{ errors.first('address-form.shipping[state]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[postcode]') ? 'has-error' : '']">
+                <label for="shipping[postcode]" class="required">
+                    {{ __('shop::app.checkout.onepage.postcode') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[postcode]" name="shipping[postcode]" v-model="address.shipping.postcode" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.postcode') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[postcode]')">
+                    @{{ errors.first('address-form.shipping[postcode]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[country]') ? 'has-error' : '']">
+                <label for="shipping[country]" class="required">
+                    {{ __('shop::app.checkout.onepage.country') }}
+                </label>
+
+                <select type="text" v-validate="'required'" class="control" id="shipping[country]" name="shipping[country]" v-model="address.shipping.country" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.country') }}&quot;">
+                    <option value=""></option>
+
+                    @foreach (core()->countries() as $country)
+                        <option value="{{ $country->code }}">{{ $country->name }}</option>
+                    @endforeach
+                </select>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[country]')">
+                    @{{ errors.first('address-form.shipping[country]') }}
+                </span>
+            </div>
+
+            <div class="control-group" :class="[errors.has('address-form.shipping[phone]') ? 'has-error' : '']">
+                <label for="shipping[phone]" class="required">
+                    {{ __('shop::app.checkout.onepage.phone') }}
+                </label>
+
+                <input type="text" v-validate="'required'" class="control" id="shipping[phone]" name="shipping[phone]" v-model="address.shipping.phone" data-vv-as="&quot;{{ __('shop::app.checkout.onepage.phone') }}&quot;"/>
+
+                <span class="control-error" v-if="errors.has('address-form.shipping[phone]')">
+                    @{{ errors.first('address-form.shipping[phone]') }}
+                </span>
+            </div>
+        </div>
+    @endif
+
+</form>

From d7213db2c9fdb4475bfee1e7f3e7a5f29e9ad435 Mon Sep 17 00:00:00 2001
From: rahul shukla <rahulshukla.symfony517@webkul.com>
Date: Fri, 15 Feb 2019 11:28:47 +0530
Subject: [PATCH 2/3] customer password

---
 packages/Webkul/Admin/src/Resources/lang/en/app.php           | 4 ++--
 packages/Webkul/Admin/webpack.mix.js                          | 4 ++--
 .../src/Resources/views/customers/session/index.blade.php     | 2 +-
 packages/Webkul/Shop/webpack.mix.js                           | 4 ++--
 4 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/Webkul/Admin/src/Resources/lang/en/app.php b/packages/Webkul/Admin/src/Resources/lang/en/app.php
index 1b9a39e6d..bef8fcb67 100755
--- a/packages/Webkul/Admin/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Admin/src/Resources/lang/en/app.php
@@ -80,8 +80,8 @@ return [
         'total-orders' => 'Total Orders',
         'total-sale' => 'Total Sale',
         'average-sale' => 'Average Order Sale',
-        'increased' => ':progress% Increased',
-        'decreased' => ':progress% Decreased',
+        'increased' => ':progress%',
+        'decreased' => ':progress%',
         'sales' => 'Sales',
         'top-performing-categories' => 'Top Performing Categories',
         'product-count' => ':count Products',
diff --git a/packages/Webkul/Admin/webpack.mix.js b/packages/Webkul/Admin/webpack.mix.js
index 92e3d593b..3f72c18c8 100755
--- a/packages/Webkul/Admin/webpack.mix.js
+++ b/packages/Webkul/Admin/webpack.mix.js
@@ -1,8 +1,8 @@
 const { mix } = require("laravel-mix");
 require("laravel-mix-merge-manifest");
 
-var publicPath = 'publishable/assets';
-// var publicPath = "../../../public/vendor/webkul/admin/assets";
+// var publicPath = 'publishable/assets';
+var publicPath = "../../../public/vendor/webkul/admin/assets";
 
 mix.setPublicPath(publicPath).mergeManifest();
 mix.disableNotifications();
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/session/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/session/index.blade.php
index 92182f571..e24b7a24b 100755
--- a/packages/Webkul/Shop/src/Resources/views/customers/session/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/session/index.blade.php
@@ -26,7 +26,7 @@
 
                 <div class="control-group" :class="[errors.has('password') ? 'has-error' : '']">
                     <label for="password" class="required">{{ __('shop::app.customer.login-form.password') }}</label>
-                    <input type="password" class="control" name="password" v-validate="'required|min:6'" value="{{ old('password') }}" data-vv-as="&quot;{{ __('shop::app.customer.login-form.password') }}&quot;">
+                    <input type="password" class="control" name="password" v-validate="'required'" value="{{ old('password') }}" data-vv-as="&quot;{{ __('shop::app.customer.login-form.password') }}&quot;">
                     <span class="control-error" v-if="errors.has('password')">@{{ errors.first('password') }}</span>
                 </div>
 
diff --git a/packages/Webkul/Shop/webpack.mix.js b/packages/Webkul/Shop/webpack.mix.js
index acf0d5b90..cc2d629f2 100755
--- a/packages/Webkul/Shop/webpack.mix.js
+++ b/packages/Webkul/Shop/webpack.mix.js
@@ -1,8 +1,8 @@
 const { mix } = require("laravel-mix");
 require("laravel-mix-merge-manifest");
 
-var publicPath = 'publishable/assets';
-// var publicPath = "../../../public/themes/default/assets";
+// var publicPath = 'publishable/assets';
+var publicPath = "../../../public/themes/default/assets";
 
 mix.setPublicPath(publicPath).mergeManifest();
 mix.disableNotifications();

From 05d3318cc80757e9e0997efa526d37d23e0de70f Mon Sep 17 00:00:00 2001
From: rahul shukla <rahulshukla.symfony517@webkul.com>
Date: Fri, 15 Feb 2019 11:32:00 +0530
Subject: [PATCH 3/3] assests compile

---
 packages/Webkul/Admin/webpack.mix.js                    | 4 ++--
 packages/Webkul/Shop/webpack.mix.js                     | 4 ++--
 packages/Webkul/Ui/publishable/assets/css/ui.css        | 2 +-
 packages/Webkul/Ui/publishable/assets/mix-manifest.json | 2 +-
 packages/Webkul/Ui/webpack.mix.js                       | 4 ++--
 5 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/Webkul/Admin/webpack.mix.js b/packages/Webkul/Admin/webpack.mix.js
index 3f72c18c8..92e3d593b 100755
--- a/packages/Webkul/Admin/webpack.mix.js
+++ b/packages/Webkul/Admin/webpack.mix.js
@@ -1,8 +1,8 @@
 const { mix } = require("laravel-mix");
 require("laravel-mix-merge-manifest");
 
-// var publicPath = 'publishable/assets';
-var publicPath = "../../../public/vendor/webkul/admin/assets";
+var publicPath = 'publishable/assets';
+// var publicPath = "../../../public/vendor/webkul/admin/assets";
 
 mix.setPublicPath(publicPath).mergeManifest();
 mix.disableNotifications();
diff --git a/packages/Webkul/Shop/webpack.mix.js b/packages/Webkul/Shop/webpack.mix.js
index cc2d629f2..acf0d5b90 100755
--- a/packages/Webkul/Shop/webpack.mix.js
+++ b/packages/Webkul/Shop/webpack.mix.js
@@ -1,8 +1,8 @@
 const { mix } = require("laravel-mix");
 require("laravel-mix-merge-manifest");
 
-// var publicPath = 'publishable/assets';
-var publicPath = "../../../public/themes/default/assets";
+var publicPath = 'publishable/assets';
+// var publicPath = "../../../public/themes/default/assets";
 
 mix.setPublicPath(publicPath).mergeManifest();
 mix.disableNotifications();
diff --git a/packages/Webkul/Ui/publishable/assets/css/ui.css b/packages/Webkul/Ui/publishable/assets/css/ui.css
index f4a5886a6..22cb38eb9 100755
--- a/packages/Webkul/Ui/publishable/assets/css/ui.css
+++ b/packages/Webkul/Ui/publishable/assets/css/ui.css
@@ -1 +1 @@
-.active.configuration-icon,.catalog-icon,.configuration-icon,.customer-icon,.dashboard-icon,.sales-icon,.settings-icon{width:48px;height:48px;display:inline-block;background-size:cover}.icon{display:inline-block;background-size:cover}.dashboard-icon{background-image:url("../images/Icon-Dashboard.svg")}.sales-icon{background-image:url("../images/Icon-Sales.svg")}.catalog-icon{background-image:url("../images/Icon-Catalog.svg")}.customer-icon{background-image:url("../images/Icon-Customers.svg")}.configuration-icon{background-image:url("../images/Icon-Configure.svg")}.settings-icon{background-image:url("../images/Icon-Settings.svg")}.angle-right-icon{background-image:url("../images/Angle-Right.svg");width:17px;height:17px}.angle-left-icon{background-image:url("../images/Angle-Left.svg");width:17px;height:17px}.arrow-down-icon{background-image:url("../images/Arrow-Down-Light.svg");width:14px;height:8px}.arrow-right-icon{background-image:url("../images/Arrow-Right.svg");width:18px;height:18px}.white-cross-sm-icon{background-image:url("../images/Icon-Sm-Cross-White.svg");width:18px;height:18px}.accordian-up-icon{background-image:url("../images/Accordion-Arrow-Up.svg");width:24px;height:24px}.accordian-down-icon{background-image:url("../images/Accordion-Arrow-Down.svg");width:24px;height:24px}.cross-icon{background-image:url("../images/Icon-Crossed.svg");width:18px;height:18px}.trash-icon{background-image:url("../images/Icon-Trash.svg");width:24px;height:24px}.remove-icon{background-image:url("../images/Icon-remove.svg");width:24px;height:24px}.pencil-lg-icon{background-image:url("../images/Icon-Pencil-Large.svg");width:24px;height:24px}.eye-icon{background-image:url("../images/Icon-eye.svg");width:24px;height:24px}.search-icon{background-image:url("../images/icon-search.svg");width:24px;height:24px}.sortable-icon{background-image:url("../images/Icon-Sortable.svg");width:24px;height:24px}.sort-down-icon,.sort-up-icon{background-image:url("../images/Icon-Sort-Down.svg");width:18px;height:18px}.sort-up-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.primary-back-icon{background-image:url("../images/Icon-Back-Primary.svg");width:24px;height:24px}.checkbox-dash-icon{background-image:url("../images/Checkbox-Dash.svg");width:24px;height:24px}.account-icon{background-image:url("../images/icon-account.svg");width:24px;height:24px}.expand-icon{background-image:url("../images/Expand-Light.svg");width:18px;height:18px}.expand-on-icon{background-image:url("../images/Expand-Light-On.svg");width:18px;height:18px}.dark-left-icon{background-image:url("../images/arrow-left-dark.svg");width:18px;height:18px}.light-right-icon{background-image:url("../images/arrow-right-light.svg");width:18px;height:18px}.folder-icon{background-image:url("../images/Folder-Icon.svg");width:24px;height:24px}.star-icon{background-image:url("../images/Star-Icon.svg");width:24px;height:24px}.arrow-down-white-icon{background-image:url("../images/down-arrow-white.svg");width:17px;height:13px}.arrow-up-white-icon{background-image:url("../images/up-arrow-white.svg");width:17px;height:13px}.profile-pic-icon{background-image:url("../images/Profile-Pic.svg");width:60px;height:60px}.graph-up-icon{background-image:url("../images/Icon-Graph-Green.svg");width:24px;height:24px}.graph-down-icon{background-image:url("../images/Icon-Graph-Red.svg");width:24px;height:24px}.no-result-icon{background-image:url("../images/limited-icon.svg");width:52px;height:47px}.active .dashboard-icon{background-image:url("../images/Icon-Dashboard-Active.svg")}.active .sales-icon{background-image:url("../images/Icon-Sales-Active.svg")}.active .catalog-icon{background-image:url("../images/Icon-Catalog-Active.svg")}.active .customer-icon{background-image:url("../images/Icon-Customers-Active.svg")}.active .settings-icon{background-image:url("../images/Icon-Settings-Active.svg")}.active .configuration-icon{background-image:url("../images/Icon-Configure-Active.svg")}.active>.arrow-down-icon{background-image:url("../images/Arrow-Down.svg");width:14px;height:8px}.active>.expand-icon{background-image:url("../images/Expand-Light-On.svg")}.active.dashboard-icon{background-image:url("../images/Icon-Dashboard-Active.svg")}.active.customer-icon{background-image:url("../images/Icon-Customers-Active.svg")}.active.sales-icon{background-image:url("../images/Icon-Sales-Active.svg")}.active.settings-icon{background-image:url("../images/Icon-Settings-Active.svg")}.active.configuration-icon{background-image:url("../images/Icon-Configure-Active.svg")}.active.arrow-down-icon{background-image:url("../images/Arrow-Down.svg");width:14px;height:8px}.active.expand-icon{background-image:url("../images/Expand-Light-On.svg")}.icon-404{background-image:url("../images/404-image.svg");width:255px;height:255px}.export-icon{background-image:url("../images/Icon-Export.svg");width:32px;height:32px}.import-icon{background-image:url("../images/Icon-Import.svg");width:32px;height:32px}.star-blue-icon{width:17px;height:17px;background-image:url("../images/Icon-star.svg")}.grid-container{display:block;width:100%}.filter-row-one{width:100%;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.filter-row-one,.filter-row-two{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-bottom:10px}.filter-row-two{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-ms-flex-wrap:wrap;flex-wrap:wrap}.search-filter{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.search-filter .control{font-size:15px;border:2px solid #c7c7c7;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-radius:3px;height:36px;width:280px;padding-left:10px}.search-filter .contorl:focus{border-color:#0041ff}.search-filter .icon-wrapper{border:2px solid #c7c7c7;border-radius:3px;border-top-left-radius:0;border-bottom-left-radius:0;height:36px;width:36px;margin-left:-1px}.search-filter .icon-wrapper .search-icon{margin-top:3px;margin-left:3px}.dropdown-header{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:36px;width:200px;border:2px solid #c7c7c7;border-radius:3px;color:#8e8e8e;padding:0 5px}.dropdown-header .arrow-icon-down{float:right}.dropdown-list.dropdown-container{padding:5px;width:100%}.dropdown-list.dropdown-container ul li .control-group{padding:15px}.dropdown-list.dropdown-container .apply-filter{padding:10px;width:80%;margin-left:10%}.filter-tag{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;border-radius:2px}.filter-tag,.filter-tag .wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:14px;height:28px}.filter-tag .wrapper{margin-left:5px;padding:0 5px;background:#e7e7e7;color:#000311;letter-spacing:-.22px}.filter-tag:not(first-child){margin-left:10px}@-webkit-keyframes jelly{0%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:0}70%{-webkit-transform:translateY(5px) scale(1.05);transform:translateY(5px) scale(1.05);opacity:1}to{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);opacity:1}}@keyframes jelly{0%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:0}70%{-webkit-transform:translateY(5px) scale(1.05);transform:translateY(5px) scale(1.05);opacity:1}to{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);opacity:1}}@-webkit-keyframes jelly-out{0%{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);opacity:1}30%{-webkit-transform:translateY(-5px) scale(1.05);transform:translateY(-5px) scale(1.05);opacity:1}to{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:0}}@keyframes jelly-out{0%{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);opacity:1}30%{-webkit-transform:translateY(-5px) scale(1.05);transform:translateY(-5px) scale(1.05);opacity:1}to{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:0}}*{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:focus{outline:none}a:active,a:focus,a:hover,a:link,a:visited{text-decoration:none;color:#0041ff}textarea{resize:none}ul{margin:0;padding:0;list-style:none}h1{font-size:28px;margin-top:0}h1,h2{color:#3a3a3a}h2{font-size:18px}.hide{display:none!important}.btn{-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,.2),0 0 8px 0 rgba(0,0,0,.1);box-shadow:0 1px 4px 0 rgba(0,0,0,.2),0 0 8px 0 rgba(0,0,0,.1);border-radius:3px;border:none;color:#fff;cursor:pointer;-webkit-transition:.2s cubic-bezier(.4,0,.2,1);transition:.2s cubic-bezier(.4,0,.2,1);font:inherit;display:inline-block}.btn:active,.btn:focus,.btn:hover{opacity:.75;border:none}.btn.btn-sm{padding:6px 12px}.btn.btn-md{padding:8px 16px}.btn.btn-lg{padding:10px 20px}.btn.btn-xl{padding:12px 24px;font-size:16px}.btn.btn-primary{background:#0041ff;color:#fff}.btn.btn-black{background:#000;color:#fff}.btn:disabled,.btn[disabled=disabled],.btn[disabled=disabled]:active,.btn[disabled=disabled]:hover{cursor:not-allowed;background:#b1b1ae;-webkit-box-shadow:none;box-shadow:none;opacity:1}.dropdown-btn{min-width:150px;text-align:left;background:#fff;border:2px solid #c7c7c7;border-radius:3px;font-size:14px;padding:8px 35px 8px 10px;cursor:pointer;position:relative}.dropdown-btn:active,.dropdown-btn:focus,.dropdown-btn:hover{opacity:.75;border:2px solid #c7c7c7}.dropdown-btn .icon{position:absolute;right:10px;top:50%;margin-top:-4px}.dropdown-open{position:relative}.dropdown-list{width:200px;margin-bottom:20px;-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);border-radius:3px;background-color:#fff;position:absolute;display:none;z-index:10;text-align:left}.dropdown-list.bottom-left{top:42px;left:0}.dropdown-list.bottom-right{top:42px;right:0}.dropdown-list.top-left{bottom:0;left:42px}.dropdown-list.top-right{bottom:0;right:42px}.dropdown-list .search-box{padding:20px;border-bottom:1px solid #e8e8e8}.dropdown-list .search-box .control{background:#fff;border:2px solid #c7c7c7;border-radius:3px;width:100%;height:36px;display:inline-block;vertical-align:middle;-webkit-transition:.2s cubic-bezier(.4,0,.2,1);transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px}.dropdown-list .search-box .control:focus{border-color:#0041ff}.dropdown-list .dropdown-container{padding:20px;overflow-y:auto}.dropdown-list .dropdown-container label{font-size:15px;display:inline-block;text-transform:uppercase;color:#9e9e9e;font-weight:700;padding-bottom:5px}.dropdown-list .dropdown-container ul{margin:0;list-style-type:none;padding:0}.dropdown-list .dropdown-container ul li{padding:5px 0}.dropdown-list .dropdown-container ul li a:active,.dropdown-list .dropdown-container ul li a:focus,.dropdown-list .dropdown-container ul li a:link,.dropdown-list .dropdown-container ul li a:visited{color:#333;display:block}.dropdown-list .dropdown-container ul li a:hover{color:#0041ff}.dropdown-list .dropdown-container ul li .checkbox{margin:0}.dropdown-list .dropdown-container ul li .control-group label{color:#3a3a3a;font-size:15px;font-weight:500;text-transform:capitalize;width:100%}.dropdown-list .dropdown-container .btn{width:100%;margin-top:10px}.table{width:100%}.table table{border-collapse:collapse;text-align:left}.table table thead th{font-weight:700;padding:12px 10px;background:#f8f9fa;color:#3a3a3a}.table table tbody td{padding:10px;border-bottom:1px solid #d3d3d3;color:#3a3a3a;vertical-align:top}.table table tbody td.actions .icon{cursor:pointer;vertical-align:middle}.table table tbody td.empty{text-align:center}.table table tbody tr:last-child td{border-bottom:none}.table .control-group{width:100%;margin-bottom:0;min-width:140px}.table .control-group .control{width:100%;margin:0}.pagination .page-item{background:#fff;border:2px solid #c7c7c7;border-radius:3px;padding:7px 14px;margin-right:5px;font-size:16px;display:inline-block;color:#8e8e8e;vertical-align:middle;text-decoration:none}.pagination .page-item.next,.pagination .page-item.previous{padding:6px 9px}.pagination .page-item.active{background:#0041ff;color:#fff;border-color:#0041ff}.pagination .page-item .icon{vertical-align:middle;margin-bottom:3px}.checkbox{position:relative;display:block}.checkbox input{left:0;opacity:0;position:absolute;top:0;height:24px;width:24px;z-index:100}.checkbox .checkbox-view{background-image:url("../images/Checkbox.svg");height:24px;width:24px;margin:0;display:inline-block!important;vertical-align:middle;margin-right:5px}.checkbox input:checked+.checkbox-view{background-image:url("../images/Checkbox-Checked.svg")}.checkbox input:disabled+.checkbox-view{opacity:.5;cursor:not-allowed}.radio{position:relative;display:block;margin:10px 5px 5px 0}.radio input{left:0;opacity:0;position:absolute;top:0;z-index:100}.radio .radio-view{background-image:url("../images/controls.svg");background-position:-21px 0;height:20px;width:20px;margin:0;display:inline-block!important;vertical-align:middle;margin-right:5px}.radio input:checked+.radio-view{background-position:-21px -21px}.radio input:disabled+.radio-view{opacity:.5;cursor:not-allowed}.control-group{display:block;margin-bottom:25px;font-size:15px;color:#333;width:750px;max-width:100%;position:relative}.control-group label{display:block;color:#3a3a3a}.control-group label.required:after{content:"*";color:#fc6868;font-weight:700;display:inline-block}.control-group textarea.control{height:100px;padding:10px}.control-group .control{background:#fff;border:2px solid #c7c7c7;border-radius:3px;width:70%;height:36px;display:inline-block;vertical-align:middle;-webkit-transition:.2s cubic-bezier(.4,0,.2,1);transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px;margin-top:10px;margin-bottom:5px}.control-group .control:focus{border-color:#0041ff}.control-group .control[disabled=disabled]{border-color:#d3d3d3;background-color:#d3d3d3;cursor:not-allowed}.control-group .control[multiple]{height:100px}.control-group.date:after,.control-group.datetime:after{background-image:url("../images/Icon-Calendar.svg");width:24px;height:24px;content:"";display:inline-block;vertical-align:middle;margin-left:-34px;margin-top:2px;pointer-events:none}.control-group .control-info{display:block;font-style:italic;color:#6f6f6f}.control-group .control-error{display:none;color:#ff5656;margin-top:5px}.control-group.has-error .control{border-color:#fc6868}.control-group.has-error .control-error{display:block}.control-group.price .currency-code{vertical-align:middle;display:inline-block}.button-group{margin-top:20px;margin-bottom:20px}.alert-wrapper{width:300px;top:10px;right:10px;position:fixed;z-index:100;text-align:left}.alert-wrapper .alert{width:300px;padding:15px;border-radius:3px;display:inline-block;-webkit-box-shadow:0 4px 15.36px .64px rgba(0,0,0,.1),0 2px 6px 0 rgba(0,0,0,.12);box-shadow:0 4px 15.36px .64px rgba(0,0,0,.1),0 2px 6px 0 rgba(0,0,0,.12);position:relative;-webkit-animation:jelly .5s ease-in-out;animation:jelly .5s ease-in-out;-webkit-transform-origin:center top;transform-origin:center top;z-index:500;margin-bottom:10px}.alert-wrapper .alert.alert-error{background:#fc6868}.alert-wrapper .alert.alert-info{background:#204d74}.alert-wrapper .alert.alert-success{background:#4caf50}.alert-wrapper .alert.alert-warning{background:#ffc107}.alert-wrapper .alert .icon{position:absolute;right:10px;top:10px;cursor:pointer}.alert-wrapper .alert p{color:#fff;margin:0;padding:0;font-size:15px}.tabs ul{border-bottom:1px solid #e8e8e8}.tabs ul li{display:inline-block}.tabs ul li a{padding:15px 20px;cursor:pointer;margin:0 2px;text-align:center;color:#000311;display:block}.tabs ul li.active a{border-bottom:3px solid #0041ff}.accordian,accordian{display:inline-block;width:100%}.accordian .accordian-header,.accordian div[slot*=header],accordian .accordian-header,accordian div[slot*=header]{width:100%;display:inline-block;font-size:18px;color:#3a3a3a;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;padding:20px 15px;cursor:pointer;margin-top:-1px}.accordian .accordian-header .expand-icon,.accordian div[slot*=header] .expand-icon,accordian .accordian-header .expand-icon,accordian div[slot*=header] .expand-icon{background-image:url("../images/Expand-Light.svg");margin-right:10px;margin-top:3px}.accordian .accordian-header h1,.accordian div[slot*=header] h1,accordian .accordian-header h1,accordian div[slot*=header] h1{margin:0;font-size:20px;display:inline-block}.accordian .accordian-header .icon,.accordian div[slot*=header] .icon,accordian .accordian-header .icon,accordian div[slot*=header] .icon{float:right}.accordian .accordian-header .icon.left,.accordian div[slot*=header] .icon.left,accordian .accordian-header .icon.left,accordian div[slot*=header] .icon.left{float:left}.accordian .accordian-content,.accordian div[slot*=body],accordian .accordian-content,accordian div[slot*=body]{width:100%;padding:20px 15px;display:none;-webkit-transition:all .3s ease;transition:all .3s ease}.accordian.active>.accordian-content,accordian.active>.accordian-content{display:inline-block}.accordian.active>.accordian-header .expand-icon,accordian.active>.accordian-header .expand-icon{background-image:url("../images/Expand-Light-On.svg")}.tree-container .tree-item{padding-left:30px;display:inline-block;margin-top:10px;width:100%}.tree-container .tree-item>.tree-item{display:none}.tree-container .tree-item.active>.tree-item{display:inline-block}.tree-container .tree-item .checkbox,.tree-container .tree-item .radio{margin:0;display:inline-block}.tree-container .tree-item .expand-icon{display:inline-block;margin-right:10px;cursor:pointer;background-image:url("../images/Expand-Light.svg");width:18px;height:18px;vertical-align:middle}.tree-container .tree-item .folder-icon{vertical-align:middle;margin-right:10px}.tree-container .tree-item.active>.expand-icon{background-image:url("../images/Expand-Light-On.svg")}.tree-container>.tree-item{padding-left:0}.panel{-webkit-box-shadow:0 2px 25px 0 rgba(0,0,0,.15);box-shadow:0 2px 25px 0 rgba(0,0,0,.15);border-radius:5px;background:#fff}.panel .panel-content{padding:20px}modal{display:none}.modal-open{overflow:hidden}.modal-overlay{display:none;overflow-y:auto;z-index:10;top:0;right:0;bottom:0;left:0;position:fixed;background:#000;opacity:.75}.modal-open .modal-overlay{display:block}.modal-container{-webkit-animation:fade-in-white .3s ease-in-out;animation:fade-in-white .3s ease-in-out;z-index:11;margin-left:-350px;width:600px;max-width:80%;background:#fff;position:fixed;left:50%;top:100px;margin-bottom:100px;-webkit-box-shadow:0 15px 25px 0 rgba(0,0,0,.03),0 20px 45px 5px rgba(0,0,0,.2);box-shadow:0 15px 25px 0 rgba(0,0,0,.03),0 20px 45px 5px rgba(0,0,0,.2);-webkit-animation:jelly .5s ease-in-out;animation:jelly .5s ease-in-out;border-radius:5px}.modal-container .modal-header{padding:20px}.modal-container .modal-header h3{display:inline-block;font-size:20px;color:#3a3a3a;margin:0}.modal-container .modal-header .icon{float:right;cursor:pointer}.modal-container .modal-body{padding:20px}.modal-container .modal-body .control-group .control{width:100%}@media only screen and (max-width:770px){.modal-container{max-width:80%;left:10%;margin-left:0}}.label{background:#e7e7e7;border-radius:2px;padding:8px;color:#000311;display:inline-block}.label.label-sm{padding:5px}.label.label-md{padding:8px}.label.label-lg{padding:11px}.label.label-xl{padding:14px}.badge{border-radius:50px;color:#fff;padding:8px;white-space:nowrap}.badge.badge-sm{padding:5px}.badge.badge-md{padding:3px 10px}.badge.badge-lg{padding:11px}.badge.badge-xl{padding:14px}.badge.badge-success{background-color:#4caf50}.badge.badge-info{background-color:#0041ff}.badge.badge-danger{background-color:#fc6868}.badge.badge-warning{background-color:#ffc107}.image-wrapper{margin-bottom:20px;margin-top:10px;display:inline-block;width:100%}.image-wrapper .image-item{width:200px;height:200px;margin-right:20px;background:#f8f9fa;border-radius:3px;display:inline-block;position:relative;background-image:url("../images/placeholder-icon.svg");background-repeat:no-repeat;background-position:50%;margin-bottom:20px}.image-wrapper .image-item img.preview{width:100%;height:100%}.image-wrapper .image-item input{display:none}.image-wrapper .image-item .remove-image{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.08)),to(rgba(0,0,0,.24)));background-image:linear-gradient(-180deg,rgba(0,0,0,.08),rgba(0,0,0,.24));border-radius:0 0 4px 4px;position:absolute;bottom:0;width:100%;padding:10px;text-align:center;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.24);margin-right:20px;cursor:pointer}.image-wrapper .image-item:hover .remove-image{display:block}.image-wrapper .image-item.has-image{background-image:none}
\ No newline at end of file
+.active.configuration-icon,.catalog-icon,.configuration-icon,.customer-icon,.dashboard-icon,.sales-icon,.settings-icon{width:48px;height:48px;display:inline-block;background-size:cover}.icon{display:inline-block;background-size:cover}.dashboard-icon{background-image:url("../images/Icon-Dashboard.svg")}.sales-icon{background-image:url("../images/Icon-Sales.svg")}.catalog-icon{background-image:url("../images/Icon-Catalog.svg")}.customer-icon{background-image:url("../images/Icon-Customers.svg")}.configuration-icon{background-image:url("../images/Icon-Configure.svg")}.settings-icon{background-image:url("../images/Icon-Settings.svg")}.angle-right-icon{background-image:url("../images/Angle-Right.svg");width:17px;height:17px}.angle-left-icon{background-image:url("../images/Angle-Left.svg");width:17px;height:17px}.arrow-down-icon{background-image:url("../images/Arrow-Down-Light.svg");width:14px;height:8px}.arrow-right-icon{background-image:url("../images/Arrow-Right.svg");width:18px;height:18px}.white-cross-sm-icon{background-image:url("../images/Icon-Sm-Cross-White.svg");width:18px;height:18px}.accordian-up-icon{background-image:url("../images/Accordion-Arrow-Up.svg");width:24px;height:24px}.accordian-down-icon{background-image:url("../images/Accordion-Arrow-Down.svg");width:24px;height:24px}.cross-icon{background-image:url("../images/Icon-Crossed.svg");width:18px;height:18px}.trash-icon{background-image:url("../images/Icon-Trash.svg");width:24px;height:24px}.remove-icon{background-image:url("../images/Icon-remove.svg");width:24px;height:24px}.pencil-lg-icon{background-image:url("../images/Icon-Pencil-Large.svg");width:24px;height:24px}.eye-icon{background-image:url("../images/Icon-eye.svg");width:24px;height:24px}.search-icon{background-image:url("../images/icon-search.svg");width:24px;height:24px}.sortable-icon{background-image:url("../images/Icon-Sortable.svg");width:24px;height:24px}.sort-down-icon,.sort-up-icon{background-image:url("../images/Icon-Sort-Down.svg");width:18px;height:18px}.sort-up-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.primary-back-icon{background-image:url("../images/Icon-Back-Primary.svg");width:24px;height:24px}.checkbox-dash-icon{background-image:url("../images/Checkbox-Dash.svg");width:24px;height:24px}.account-icon{background-image:url("../images/icon-account.svg");width:24px;height:24px}.expand-icon{background-image:url("../images/Expand-Light.svg");width:18px;height:18px}.expand-on-icon{background-image:url("../images/Expand-Light-On.svg");width:18px;height:18px}.dark-left-icon{background-image:url("../images/arrow-left-dark.svg");width:18px;height:18px}.light-right-icon{background-image:url("../images/arrow-right-light.svg");width:18px;height:18px}.folder-icon{background-image:url("../images/Folder-Icon.svg");width:24px;height:24px}.star-icon{background-image:url("../images/Star-Icon.svg");width:24px;height:24px}.arrow-down-white-icon{background-image:url("../images/down-arrow-white.svg");width:17px;height:13px}.arrow-up-white-icon{background-image:url("../images/up-arrow-white.svg");width:17px;height:13px}.profile-pic-icon{background-image:url("../images/Profile-Pic.svg");width:60px;height:60px}.graph-up-icon{background-image:url("../images/Icon-Graph-Green.svg");width:24px;height:24px}.graph-down-icon{background-image:url("../images/Icon-Graph-Red.svg");width:24px;height:24px}.no-result-icon{background-image:url("../images/limited-icon.svg");width:52px;height:47px}.active .dashboard-icon{background-image:url("../images/Icon-Dashboard-Active.svg")}.active .sales-icon{background-image:url("../images/Icon-Sales-Active.svg")}.active .catalog-icon{background-image:url("../images/Icon-Catalog-Active.svg")}.active .customer-icon{background-image:url("../images/Icon-Customers-Active.svg")}.active .settings-icon{background-image:url("../images/Icon-Settings-Active.svg")}.active .configuration-icon{background-image:url("../images/Icon-Configure-Active.svg")}.active>.arrow-down-icon{background-image:url("../images/Arrow-Down.svg");width:14px;height:8px}.active>.expand-icon{background-image:url("../images/Expand-Light-On.svg")}.active.dashboard-icon{background-image:url("../images/Icon-Dashboard-Active.svg")}.active.customer-icon{background-image:url("../images/Icon-Customers-Active.svg")}.active.sales-icon{background-image:url("../images/Icon-Sales-Active.svg")}.active.settings-icon{background-image:url("../images/Icon-Settings-Active.svg")}.active.configuration-icon{background-image:url("../images/Icon-Configure-Active.svg")}.active.arrow-down-icon{background-image:url("../images/Arrow-Down.svg");width:14px;height:8px}.active.expand-icon{background-image:url("../images/Expand-Light-On.svg")}.icon-404{background-image:url("../images/404-image.svg");width:255px;height:255px}.export-icon{background-image:url("../images/Icon-Export.svg");width:32px;height:32px}.import-icon{background-image:url("../images/Icon-Import.svg");width:32px;height:32px}.star-blue-icon{width:17px;height:17px;background-image:url("../images/Icon-star.svg")}.grid-container{display:block;width:100%}.filter-row-one{width:100%;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.filter-row-one,.filter-row-two{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-bottom:10px}.filter-row-two{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-ms-flex-wrap:wrap;flex-wrap:wrap}.search-filter{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.search-filter .control{font-size:15px;border:2px solid #c7c7c7;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-radius:3px;height:36px;width:280px;padding-left:10px}.search-filter .contorl:focus{border-color:#0041ff}.search-filter .icon-wrapper{border:2px solid #c7c7c7;border-radius:3px;border-top-left-radius:0;border-bottom-left-radius:0;height:36px;width:36px;margin-left:-1px}.search-filter .icon-wrapper .search-icon{margin-top:3px;margin-left:3px}.dropdown-header{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:36px;width:200px;border:2px solid #c7c7c7;border-radius:3px;color:#8e8e8e;padding:0 5px}.dropdown-header .arrow-icon-down{float:right}.dropdown-list.dropdown-container{padding:5px;width:100%;top:43px}.dropdown-list.dropdown-container ul li .control-group{padding:15px}.dropdown-list.dropdown-container .apply-filter{padding:10px;width:80%;margin-left:10%;margin-bottom:5%}.filter-tag{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;border-radius:2px}.filter-tag,.filter-tag .wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:14px;height:28px}.filter-tag .wrapper{margin-left:5px;padding:0 5px;background:#e7e7e7;color:#000311;letter-spacing:-.22px}.filter-tag:not(first-child){margin-left:10px}@-webkit-keyframes jelly{0%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:0}70%{-webkit-transform:translateY(5px) scale(1.05);transform:translateY(5px) scale(1.05);opacity:1}to{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);opacity:1}}@keyframes jelly{0%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:0}70%{-webkit-transform:translateY(5px) scale(1.05);transform:translateY(5px) scale(1.05);opacity:1}to{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);opacity:1}}@-webkit-keyframes jelly-out{0%{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);opacity:1}30%{-webkit-transform:translateY(-5px) scale(1.05);transform:translateY(-5px) scale(1.05);opacity:1}to{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:0}}@keyframes jelly-out{0%{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);opacity:1}30%{-webkit-transform:translateY(-5px) scale(1.05);transform:translateY(-5px) scale(1.05);opacity:1}to{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:0}}*{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:focus{outline:none}a:active,a:focus,a:hover,a:link,a:visited{text-decoration:none;color:#0041ff}textarea{resize:none}ul{margin:0;padding:0;list-style:none}h1{font-size:28px;margin-top:0}h1,h2{color:#3a3a3a}h2{font-size:18px}.hide{display:none!important}.btn{-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,.2),0 0 8px 0 rgba(0,0,0,.1);box-shadow:0 1px 4px 0 rgba(0,0,0,.2),0 0 8px 0 rgba(0,0,0,.1);border-radius:3px;border:none;color:#fff;cursor:pointer;-webkit-transition:.2s cubic-bezier(.4,0,.2,1);transition:.2s cubic-bezier(.4,0,.2,1);font:inherit;display:inline-block}.btn:active,.btn:focus,.btn:hover{opacity:.75;border:none}.btn.btn-sm{padding:6px 12px}.btn.btn-md{padding:8px 16px}.btn.btn-lg{padding:10px 20px}.btn.btn-xl{padding:12px 24px;font-size:16px}.btn.btn-primary{background:#0041ff;color:#fff}.btn.btn-black{background:#000;color:#fff}.btn:disabled,.btn[disabled=disabled],.btn[disabled=disabled]:active,.btn[disabled=disabled]:hover{cursor:not-allowed;background:#b1b1ae;-webkit-box-shadow:none;box-shadow:none;opacity:1}.dropdown-btn{min-width:150px;text-align:left;background:#fff;border:2px solid #c7c7c7;border-radius:3px;font-size:14px;padding:8px 35px 8px 10px;cursor:pointer;position:relative}.dropdown-btn:active,.dropdown-btn:focus,.dropdown-btn:hover{opacity:.75;border:2px solid #c7c7c7}.dropdown-btn .icon{position:absolute;right:10px;top:50%;margin-top:-4px}.dropdown-open{position:relative}.dropdown-list{width:200px;margin-bottom:20px;-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);border-radius:3px;background-color:#fff;position:absolute;display:none;z-index:10;text-align:left}.dropdown-list.bottom-left{top:42px;left:0}.dropdown-list.bottom-right{top:42px;right:0}.dropdown-list.top-left{bottom:0;left:42px}.dropdown-list.top-right{bottom:0;right:42px}.dropdown-list .search-box{padding:20px;border-bottom:1px solid #e8e8e8}.dropdown-list .search-box .control{background:#fff;border:2px solid #c7c7c7;border-radius:3px;width:100%;height:36px;display:inline-block;vertical-align:middle;-webkit-transition:.2s cubic-bezier(.4,0,.2,1);transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px}.dropdown-list .search-box .control:focus{border-color:#0041ff}.dropdown-list .dropdown-container{padding:20px;overflow-y:auto}.dropdown-list .dropdown-container label{font-size:15px;display:inline-block;text-transform:uppercase;color:#9e9e9e;font-weight:700;padding-bottom:5px}.dropdown-list .dropdown-container ul{margin:0;list-style-type:none;padding:0}.dropdown-list .dropdown-container ul li{padding:5px 0}.dropdown-list .dropdown-container ul li a:active,.dropdown-list .dropdown-container ul li a:focus,.dropdown-list .dropdown-container ul li a:link,.dropdown-list .dropdown-container ul li a:visited{color:#333;display:block}.dropdown-list .dropdown-container ul li a:hover{color:#0041ff}.dropdown-list .dropdown-container ul li .checkbox{margin:0}.dropdown-list .dropdown-container ul li .control-group label{color:#3a3a3a;font-size:15px;font-weight:500;text-transform:capitalize;width:100%}.dropdown-list .dropdown-container .btn{width:100%;margin-top:10px}.table{width:100%}.table table{border-collapse:collapse;text-align:left}.table table thead th{font-weight:700;padding:12px 10px;background:#f8f9fa;color:#3a3a3a}.table table tbody td{padding:10px;border-bottom:1px solid #d3d3d3;color:#3a3a3a;vertical-align:top}.table table tbody td.actions .icon{cursor:pointer;vertical-align:middle}.table table tbody td.empty{text-align:center}.table table tbody tr:last-child td{border-bottom:none}.table .control-group{width:100%;margin-bottom:0;min-width:140px}.table .control-group .control{width:100%;margin:0}.pagination .page-item{background:#fff;border:2px solid #c7c7c7;border-radius:3px;padding:7px 14px;margin-right:5px;font-size:16px;display:inline-block;color:#8e8e8e;vertical-align:middle;text-decoration:none}.pagination .page-item.next,.pagination .page-item.previous{padding:6px 9px}.pagination .page-item.active{background:#0041ff;color:#fff;border-color:#0041ff}.pagination .page-item .icon{vertical-align:middle;margin-bottom:3px}.checkbox{position:relative;display:block}.checkbox input{left:0;opacity:0;position:absolute;top:0;height:24px;width:24px;z-index:100}.checkbox .checkbox-view{background-image:url("../images/Checkbox.svg");height:24px;width:24px;margin:0;display:inline-block!important;vertical-align:middle;margin-right:5px}.checkbox input:checked+.checkbox-view{background-image:url("../images/Checkbox-Checked.svg")}.checkbox input:disabled+.checkbox-view{opacity:.5;cursor:not-allowed}.radio{position:relative;display:block;margin:10px 5px 5px 0}.radio input{left:0;opacity:0;position:absolute;top:0;z-index:100}.radio .radio-view{background-image:url("../images/controls.svg");background-position:-21px 0;height:20px;width:20px;margin:0;display:inline-block!important;vertical-align:middle;margin-right:5px}.radio input:checked+.radio-view{background-position:-21px -21px}.radio input:disabled+.radio-view{opacity:.5;cursor:not-allowed}.control-group{display:block;margin-bottom:25px;font-size:15px;color:#333;width:750px;max-width:100%;position:relative}.control-group label{display:block;color:#3a3a3a}.control-group label.required:after{content:"*";color:#fc6868;font-weight:700;display:inline-block}.control-group textarea.control{height:100px;padding:10px}.control-group .control{background:#fff;border:2px solid #c7c7c7;border-radius:3px;width:70%;height:36px;display:inline-block;vertical-align:middle;-webkit-transition:.2s cubic-bezier(.4,0,.2,1);transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px;margin-top:10px;margin-bottom:5px}.control-group .control:focus{border-color:#0041ff}.control-group .control[disabled=disabled]{border-color:#d3d3d3;background-color:#d3d3d3;cursor:not-allowed}.control-group .control[multiple]{height:100px}.control-group.date:after,.control-group.datetime:after{background-image:url("../images/Icon-Calendar.svg");width:24px;height:24px;content:"";display:inline-block;vertical-align:middle;margin-left:-34px;margin-top:2px;pointer-events:none}.control-group .control-info{display:block;font-style:italic;color:#6f6f6f}.control-group .control-error{display:none;color:#ff5656;margin-top:5px}.control-group.has-error .control{border-color:#fc6868}.control-group.has-error .control-error{display:block}.control-group.price .currency-code{vertical-align:middle;display:inline-block}.button-group{margin-top:20px;margin-bottom:20px}.alert-wrapper{width:300px;top:10px;right:10px;position:fixed;z-index:100;text-align:left}.alert-wrapper .alert{width:300px;padding:15px;border-radius:3px;display:inline-block;-webkit-box-shadow:0 4px 15.36px .64px rgba(0,0,0,.1),0 2px 6px 0 rgba(0,0,0,.12);box-shadow:0 4px 15.36px .64px rgba(0,0,0,.1),0 2px 6px 0 rgba(0,0,0,.12);position:relative;-webkit-animation:jelly .5s ease-in-out;animation:jelly .5s ease-in-out;-webkit-transform-origin:center top;transform-origin:center top;z-index:500;margin-bottom:10px}.alert-wrapper .alert.alert-error{background:#fc6868}.alert-wrapper .alert.alert-info{background:#204d74}.alert-wrapper .alert.alert-success{background:#4caf50}.alert-wrapper .alert.alert-warning{background:#ffc107}.alert-wrapper .alert .icon{position:absolute;right:10px;top:10px;cursor:pointer}.alert-wrapper .alert p{color:#fff;margin:0;padding:0;font-size:15px}.tabs ul{border-bottom:1px solid #e8e8e8}.tabs ul li{display:inline-block}.tabs ul li a{padding:15px 20px;cursor:pointer;margin:0 2px;text-align:center;color:#000311;display:block}.tabs ul li.active a{border-bottom:3px solid #0041ff}.accordian,accordian{display:inline-block;width:100%}.accordian .accordian-header,.accordian div[slot*=header],accordian .accordian-header,accordian div[slot*=header]{width:100%;display:inline-block;font-size:18px;color:#3a3a3a;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;padding:20px 15px;cursor:pointer;margin-top:-1px}.accordian .accordian-header .expand-icon,.accordian div[slot*=header] .expand-icon,accordian .accordian-header .expand-icon,accordian div[slot*=header] .expand-icon{background-image:url("../images/Expand-Light.svg");margin-right:10px;margin-top:3px}.accordian .accordian-header h1,.accordian div[slot*=header] h1,accordian .accordian-header h1,accordian div[slot*=header] h1{margin:0;font-size:20px;display:inline-block}.accordian .accordian-header .icon,.accordian div[slot*=header] .icon,accordian .accordian-header .icon,accordian div[slot*=header] .icon{float:right}.accordian .accordian-header .icon.left,.accordian div[slot*=header] .icon.left,accordian .accordian-header .icon.left,accordian div[slot*=header] .icon.left{float:left}.accordian .accordian-content,.accordian div[slot*=body],accordian .accordian-content,accordian div[slot*=body]{width:100%;padding:20px 15px;display:none;-webkit-transition:all .3s ease;transition:all .3s ease}.accordian.active>.accordian-content,accordian.active>.accordian-content{display:inline-block}.accordian.active>.accordian-header .expand-icon,accordian.active>.accordian-header .expand-icon{background-image:url("../images/Expand-Light-On.svg")}.tree-container .tree-item{padding-left:30px;display:inline-block;margin-top:10px;width:100%}.tree-container .tree-item>.tree-item{display:none}.tree-container .tree-item.active>.tree-item{display:inline-block}.tree-container .tree-item .checkbox,.tree-container .tree-item .radio{margin:0;display:inline-block}.tree-container .tree-item .expand-icon{display:inline-block;margin-right:10px;cursor:pointer;background-image:url("../images/Expand-Light.svg");width:18px;height:18px;vertical-align:middle}.tree-container .tree-item .folder-icon{vertical-align:middle;margin-right:10px}.tree-container .tree-item.active>.expand-icon{background-image:url("../images/Expand-Light-On.svg")}.tree-container>.tree-item{padding-left:0}.panel{-webkit-box-shadow:0 2px 25px 0 rgba(0,0,0,.15);box-shadow:0 2px 25px 0 rgba(0,0,0,.15);border-radius:5px;background:#fff}.panel .panel-content{padding:20px}modal{display:none}.modal-open{overflow:hidden}.modal-overlay{display:none;overflow-y:auto;z-index:10;top:0;right:0;bottom:0;left:0;position:fixed;background:#000;opacity:.75}.modal-open .modal-overlay{display:block}.modal-container{-webkit-animation:fade-in-white .3s ease-in-out;animation:fade-in-white .3s ease-in-out;z-index:11;margin-left:-350px;width:600px;max-width:80%;background:#fff;position:fixed;left:50%;top:100px;margin-bottom:100px;-webkit-box-shadow:0 15px 25px 0 rgba(0,0,0,.03),0 20px 45px 5px rgba(0,0,0,.2);box-shadow:0 15px 25px 0 rgba(0,0,0,.03),0 20px 45px 5px rgba(0,0,0,.2);-webkit-animation:jelly .5s ease-in-out;animation:jelly .5s ease-in-out;border-radius:5px}.modal-container .modal-header{padding:20px}.modal-container .modal-header h3{display:inline-block;font-size:20px;color:#3a3a3a;margin:0}.modal-container .modal-header .icon{float:right;cursor:pointer}.modal-container .modal-body{padding:20px}.modal-container .modal-body .control-group .control{width:100%}@media only screen and (max-width:770px){.modal-container{max-width:80%;left:10%;margin-left:0}}.label{background:#e7e7e7;border-radius:2px;padding:8px;color:#000311;display:inline-block}.label.label-sm{padding:5px}.label.label-md{padding:8px}.label.label-lg{padding:11px}.label.label-xl{padding:14px}.badge{border-radius:50px;color:#fff;padding:8px;white-space:nowrap}.badge.badge-sm{padding:5px}.badge.badge-md{padding:3px 10px}.badge.badge-lg{padding:11px}.badge.badge-xl{padding:14px}.badge.badge-success{background-color:#4caf50}.badge.badge-info{background-color:#0041ff}.badge.badge-danger{background-color:#fc6868}.badge.badge-warning{background-color:#ffc107}.image-wrapper{margin-bottom:20px;margin-top:10px;display:inline-block;width:100%}.image-wrapper .image-item{width:200px;height:200px;margin-right:20px;background:#f8f9fa;border-radius:3px;display:inline-block;position:relative;background-image:url("../images/placeholder-icon.svg");background-repeat:no-repeat;background-position:50%;margin-bottom:20px}.image-wrapper .image-item img.preview{width:100%;height:100%}.image-wrapper .image-item input{display:none}.image-wrapper .image-item .remove-image{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.08)),to(rgba(0,0,0,.24)));background-image:linear-gradient(-180deg,rgba(0,0,0,.08),rgba(0,0,0,.24));border-radius:0 0 4px 4px;position:absolute;bottom:0;width:100%;padding:10px;text-align:center;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.24);margin-right:20px;cursor:pointer}.image-wrapper .image-item:hover .remove-image{display:block}.image-wrapper .image-item.has-image{background-image:none}
\ No newline at end of file
diff --git a/packages/Webkul/Ui/publishable/assets/mix-manifest.json b/packages/Webkul/Ui/publishable/assets/mix-manifest.json
index a307a69c7..9f7265241 100755
--- a/packages/Webkul/Ui/publishable/assets/mix-manifest.json
+++ b/packages/Webkul/Ui/publishable/assets/mix-manifest.json
@@ -1,4 +1,4 @@
 {
     "/js/ui.js": "/js/ui.js?id=d984bc35663c0fd9cf3f",
-    "/css/ui.css": "/css/ui.css?id=907ba1f195230c84e711"
+    "/css/ui.css": "/css/ui.css?id=ec6e8734bcf3862ca9c7"
 }
diff --git a/packages/Webkul/Ui/webpack.mix.js b/packages/Webkul/Ui/webpack.mix.js
index 54dca326b..62c9ba3ef 100755
--- a/packages/Webkul/Ui/webpack.mix.js
+++ b/packages/Webkul/Ui/webpack.mix.js
@@ -1,8 +1,8 @@
 const { mix } = require("laravel-mix");
 require("laravel-mix-merge-manifest");
 
-// var publicPath = 'publishable/assets';
-var publicPath = "../../../public/vendor/webkul/ui/assets";
+var publicPath = 'publishable/assets';
+// var publicPath = "../../../public/vendor/webkul/ui/assets";
 
 mix.setPublicPath(publicPath).mergeManifest();
 mix.disableNotifications();