diff --git a/packages/Webkul/Cart/src/Cart.php b/packages/Webkul/Cart/src/Cart.php index 2fc24d46f..cc35d2680 100644 --- a/packages/Webkul/Cart/src/Cart.php +++ b/packages/Webkul/Cart/src/Cart.php @@ -8,6 +8,7 @@ use Webkul\Cart\Repositories\CartItemRepository; use Webkul\Cart\Repositories\CartAddressRepository; use Webkul\Customer\Repositories\CustomerRepository; use Webkul\Product\Repositories\ProductRepository; +use Webkul\Cart\Models\CartPayment; use Cookie; /** @@ -301,6 +302,10 @@ class Cart { */ public function add($id, $data) { + // session()->forget('cart'); + + // return redirect()->back(); + $itemData = $this->prepareItemData($id, $data); if(session()->has('cart')) { @@ -311,6 +316,7 @@ class Cart { if(isset($cartItems)) { foreach($cartItems as $cartItem) { if($data['is_configurable'] == "false") { + if($cartItem->product_id == $id) { $prevQty = $cartItem->quantity; @@ -323,6 +329,7 @@ class Cart { return redirect()->back(); } } else if($data['is_configurable'] == "true") { + //check the parent and child records that holds info abt this product. if($cartItem->product_id == $data['selected_configurable_option']) { $child = $cartItem; @@ -397,79 +404,66 @@ class Cart { $customerCartItems = $this->cart->items($customerCart['id']); if(isset($customerCart)) { - foreach($customerCartItems as $customerCartItem) { - foreach($cartItems as $cartItem) { + foreach($cartItems as $key => $cartItem) { + // foreach($customerCartItems as $customerCartItem) { - if($cartItem->type == "simple" && !isset($cartItem->parent_id)) { + // // dd($customerCartItems, $cartItems[0]->parent_id); - if($customerCartItem->type == "simple" && !isset($customerCartItem->parent_id)) { + // if($cartItem->type == "simple" && $cartItem->parent_id == "null") { + // if($customerCartItem->type == "simple" && $customerCartItem->parent_id == "null") { + // //update the customer cart item details and delete the guest instance - //update the customer cart item details and delete the guest instance - if($customerCartItem->product_id == $cartItem->productId) { + // if($customerCartItem->product_id == $cartItem->productId) { - $prevQty = $cartItem->quantity; - $newQty = $customerCartItem->quantity; + // $prevQty = $cartItem->quantity; + // $newQty = $customerCartItem->quantity; - $customerCartItem->update([ - 'quantity' => $prevQty + $newQty, - 'item_total' => $customerCartItem->price * ($prevQty + $newQty), - 'base_item_total' => $customerCartItem->price * ($prevQty + $newQty), - 'item_total_weight' => $customerCartItem->weight * ($prevQty + $newQty), - 'base_item_total_weight' => $customerCartItem->weight * ($prevQty + $newQty) - ]); - } - } - } else if($cartItem->type == "simple" && isset($cartItem->parent_id)) { - - if($customerCartItem->type == "simple" && isset($customerCartItem->parent_id)) { - - } - } - } - // if($customerCartItem->type == "simple" && isset($customerCartItem->parent_id)) { - // //write the merge case whem the items exists with the customer cart also. - // $child = $customerCartItem; - - // $parentId = $child->parent_id; - - // $parent = $this->cartItem->findOneByField('id', $parentId); - - // $parentPrice = $parent->price; - - // $prevQty = $parent->quantity; - - // foreach ($cartItems as $key => $cartItem) { - // if ($cartItem->type == "simple" && isset($cartItem->parent_id)) { - // $newQty = $data['quantity']; - - // $parent->update(['quantity' => $prevQty + $newQty, 'item_total' => $parentPrice * ($prevQty + $newQty)]); - // } else if($cartItem->type == "simple" && is_null($cartItem->parent_id)){ + // $customerCartItem->update([ + // 'quantity' => $prevQty + $newQty, + // 'item_total' => $customerCartItem->price * ($prevQty + $newQty), + // 'base_item_total' => $customerCartItem->price * ($prevQty + $newQty), + // 'item_total_weight' => $customerCartItem->weight * ($prevQty + $newQty), + // 'base_item_total_weight' => $customerCartItem->weight * ($prevQty + $newQty) + // ]); + // $cartItems->forget($key); + // } // } - // } - // } elseif($customerCartItem->type == "simple" && !isset($customerCartItem->parent_id)) { - // foreach($cartItems as $key => $cartItem) { - // if($cartItem->product_id == $customerCartItem->product_id) { + // } else if($cartItem->type == "simple" && $cartItem->parent_id != "null") { - // $customerItemQuantity = $customerCartItem->quantity; + // if($customerCartItem->type == "simple" && $customerCartItem->parent_id != "null") { + // //guest cartParent + // $cartItemParentId = $cartItem->parent_id; + // $cartItemParent = $this->cartItem->findOneByField('id', $cartItemParentId); - // $cartItemQuantity = $cartItem->quantity; + // //customer cartParent + // $customerItemParentId = $customerCartItem->parent_id; + // $customerItemParent = $this->cartItem->findOneByField('id', $customerItemParentId); - // $customerCartItem->update(['cart_id' => $customerCart->id, 'quantity' => $cartItemQuantity + $customerItemQuantity]); + // if($cartItem->product_id == $customerCartItem->product_id) { + // $cartItemQuantity = $cartItemParent->quantity; - // $this->cartItem->delete($cartItem->id); + // $customerCartItemQuantity = $customerItemParent->quantity; - // $cartItems->forget($key); + // $customerCartItem->update([ + // 'quantity' => $cartItemQuantity + $customerCartItemQuantity, + // 'item_total' => $customerItemParent->price * ($cartItemQuantity + $customerCartItemQuantity), + // 'base_item_total' => $customerItemParent->price * ($cartItemQuantity + $customerCartItemQuantity), + // 'item_total_weight' => $customerItemParent->weight * ($cartItemQuantity + $customerCartItemQuantity), + // 'base_item_total_weight' => $customerItemParent->weight * ($cartItemQuantity + $customerCartItemQuantity), + // ]); + + // $cartItems->forget($key); + // } // } // } // } } foreach($cartItems as $cartItem) { - $cartItem->update(['cart_id' => $customerCart->id]); + $cartItem->update(['cart_id' => $customerCart['id']]); } - $this->cart->delete($cart->id); return redirect()->back(); @@ -486,6 +480,20 @@ class Cart { } } + /** + * Destroys the session + * maintained for cart + * on customer logout. + * + * @return Mixed + */ + public function destroyCart() { + if(session()->has('cart')) { + session()->forget('cart'); + return redirect()->back(); + } + } + /** * Returns cart * @@ -496,7 +504,7 @@ class Cart { if(!$cart = session()->get('cart')) return false; - return $cart; + return $this->cart->find($cart->id); } /** @@ -553,12 +561,71 @@ class Cart { if(!$cart = $this->getCart()) return false; - foreach($cart->shipping_rates as $rate) { - if($rate->method != $shippingMethodCode) { - $rate->delete(); - } - } + $cart->shipping_method = $shippingMethodCode; + $cart->save(); + + // foreach($cart->shipping_rates as $rate) { + // if($rate->method != $shippingMethodCode) { + // $rate->delete(); + // } + // } return true; } + + /** + * Save payment method for cart + * + * @param string $payment + * @return Mixed + */ + public function savePaymentMethod($payment) + { + if(!$cart = $this->getCart()) + return false; + + if($cartPayment = $cart->payment) + $cartPayment->delete(); + + $cartPayment = new CartPayment; + + $cartPayment->method = $payment['method']; + $cartPayment->cart_id = $cart->id; + $cartPayment->save(); + + return $cartPayment; + } + + /** + * Updates cart totals + * + * @return void + */ + public function collectTotals() + { + if(!$cart = $this->getCart()) + return false; + + $cart->grand_total = 0; + $cart->base_grand_total = 0; + $cart->sub_total = 0; + $cart->base_sub_total = 0; + $cart->sub_total_with_discount = 0; + $cart->base_sub_total_with_discount = 0; + + foreach ($cart->items()->get() as $item) { + $cart->grand_total = (float) $cart->grand_total + $item->price; + $cart->base_grand_total = (float) $cart->base_grand_total + $item->base_price; + + $cart->sub_total = (float) $cart->sub_total + $item->price; + $cart->base_sub_total = (float) $cart->base_sub_total + $item->base_price; + } + + if($shipping = $cart->selected_shipping_rate) { + $cart->grand_total = (float) $cart->grand_total + $shipping->price; + $cart->base_grand_total = (float) $cart->base_grand_total + $shipping->base_price; + } + + $cart->save(); + } } \ No newline at end of file diff --git a/packages/Webkul/Cart/src/Database/Migrations/2018_09_05_150444_create_cart_table.php b/packages/Webkul/Cart/src/Database/Migrations/2018_09_05_150444_create_cart_table.php index c32dcd1dc..c11b69d97 100644 --- a/packages/Webkul/Cart/src/Database/Migrations/2018_09_05_150444_create_cart_table.php +++ b/packages/Webkul/Cart/src/Database/Migrations/2018_09_05_150444_create_cart_table.php @@ -19,6 +19,7 @@ class CreateCartTable extends Migration $table->foreign('customer_id')->references('id')->on('customers'); $table->integer('channel_id')->unsigned(); $table->foreign('channel_id')->references('id')->on('channels'); + $table->string('shipping_method')->nullable(); $table->string('coupon_code')->nullable(); $table->boolean('is_gift')->default(0); $table->integer('items_count')->nullable(); @@ -28,12 +29,12 @@ class CreateCartTable extends Migration $table->string('base_currency_code')->nullable(); $table->string('store_currency_code')->nullable(); $table->string('quote_currency_code')->nullable(); - $table->decimal('grand_total', 12, 4)->nullable(); - $table->decimal('base_grand_total', 12, 4)->nullable(); - $table->decimal('sub_total', 12, 4)->nullable(); - $table->decimal('base_sub_total', 12, 4)->nullable(); - $table->decimal('sub_total_with_discount', 12, 4)->nullable(); - $table->decimal('base_sub_total_with_discount', 12, 4)->nullable(); + $table->decimal('grand_total', 12, 4)->default(0)->nullable(); + $table->decimal('base_grand_total', 12, 4)->default(0)->nullable(); + $table->decimal('sub_total', 12, 4)->default(0)->nullable(); + $table->decimal('base_sub_total', 12, 4)->default(0)->nullable(); + $table->decimal('sub_total_with_discount', 12, 4)->default(0)->nullable(); + $table->decimal('base_sub_total_with_discount', 12, 4)->default(0)->nullable(); $table->string('checkout_method')->nullable(); $table->boolean('is_guest')->nullable(); $table->boolean('is_active')->nullable()->default(0); diff --git a/packages/Webkul/Cart/src/Database/Migrations/2018_09_19_093453_create_cart_payment.php b/packages/Webkul/Cart/src/Database/Migrations/2018_09_19_093453_create_cart_payment.php index 9521ad2b6..89ab7fd4d 100644 --- a/packages/Webkul/Cart/src/Database/Migrations/2018_09_19_093453_create_cart_payment.php +++ b/packages/Webkul/Cart/src/Database/Migrations/2018_09_19_093453_create_cart_payment.php @@ -16,6 +16,7 @@ class CreateCartPayment extends Migration Schema::create('cart_payment', function (Blueprint $table) { $table->increments('id'); $table->string('method'); + $table->string('method_title')->nullable(); $table->integer('cart_id')->nullable()->unsigned(); $table->foreign('cart_id')->references('id')->on('cart'); $table->timestamps(); diff --git a/packages/Webkul/Cart/src/Database/Migrations/2018_09_19_093508_create_cart_shipping_rates_table.php b/packages/Webkul/Cart/src/Database/Migrations/2018_09_19_093508_create_cart_shipping_rates_table.php index 3b286d510..2565b846d 100644 --- a/packages/Webkul/Cart/src/Database/Migrations/2018_09_19_093508_create_cart_shipping_rates_table.php +++ b/packages/Webkul/Cart/src/Database/Migrations/2018_09_19_093508_create_cart_shipping_rates_table.php @@ -20,7 +20,8 @@ class CreateCartShippingRatesTable extends Migration $table->string('method'); $table->string('method_title'); $table->string('method_description')->nullable(); - $table->double('price')->nullable(); + $table->double('price')->default(0)->nullable(); + $table->double('base_price')->default(0)->nullable(); $table->integer('cart_address_id')->nullable()->unsigned(); $table->foreign('cart_address_id')->references('id')->on('cart_address'); $table->timestamps(); diff --git a/packages/Webkul/Cart/src/Helpers/Checkout.php b/packages/Webkul/Cart/src/Helpers/Checkout.php new file mode 100644 index 000000000..9e695c7db --- /dev/null +++ b/packages/Webkul/Cart/src/Helpers/Checkout.php @@ -0,0 +1,43 @@ +attributeOption = $attributeOption; + } + + /** + * Returns the allowed variants + * + * @param CartItem $item + * @return array + */ + public function getItemOptionDetails($item) + { + $data = []; + + foreach ($item->product->super_attributes as $attribute) { + + } + + return $data; + } +} \ No newline at end of file diff --git a/packages/Webkul/Cart/src/Http/Controllers/CartController.php b/packages/Webkul/Cart/src/Http/Controllers/CartController.php index 6c766aa8a..01a9f145f 100644 --- a/packages/Webkul/Cart/src/Http/Controllers/CartController.php +++ b/packages/Webkul/Cart/src/Http/Controllers/CartController.php @@ -140,4 +140,14 @@ class CartController extends Controller } dd($products); } + + public function mergeTest() { + $cartItems = $this->cart->findOneByField('customer_id', auth()->guard('customer')->user()->id)->items; + + $tempId = 15; + + foreach($cartItems as $cartItem) { + + } + } } \ No newline at end of file diff --git a/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php b/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php index 486067e2d..d9271ad56 100644 --- a/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php +++ b/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php @@ -70,6 +70,13 @@ class CheckoutController extends Controller */ public function saveShipping() { + $shippingMethod = request()->get('shipping_method'); + + if(!$shippingMethod || !Cart::saveShippingMethod($shippingMethod)) + return response()->json(['redirect_url' => route('shop.checkout.cart.index')], 403); + + Cart::collectTotals(); + return response()->json(Payment::getSupportedPaymentMethods()); } @@ -80,5 +87,16 @@ class CheckoutController extends Controller */ public function savePayment() { + $payment = request()->get('payment'); + + if(!$payment || !Cart::savePaymentMethod($payment)) + return response()->json(['redirect_url' => route('shop.checkout.cart.index')], 403); + + $cart = Cart::getCart(); + + return response()->json([ + 'jump_to_section' => 'review', + 'html' => view('shop::checkout.onepage.review', compact('cart'))->render() + ]); } } \ No newline at end of file diff --git a/packages/Webkul/Cart/src/Models/Cart.php b/packages/Webkul/Cart/src/Models/Cart.php index ef1d711c0..8a39910dc 100644 --- a/packages/Webkul/Cart/src/Models/Cart.php +++ b/packages/Webkul/Cart/src/Models/Cart.php @@ -5,6 +5,7 @@ namespace Webkul\Cart\Models; use Illuminate\Database\Eloquent\Model; use Webkul\Product\Models\Product; use Webkul\Cart\Models\CartAddress; +use Webkul\Cart\Models\CartPayment; use Webkul\Cart\Models\CartShippingRate; class Cart extends Model @@ -30,7 +31,7 @@ class Cart extends Model /** * Get the biling address for the cart. */ - public function biling_address() + public function billing_address() { return $this->addresses()->where('address_type', 'billing'); } @@ -38,9 +39,9 @@ class Cart extends Model /** * Get all of the attributes for the attribute groups. */ - public function getBilingAddressAttribute() + public function getBillingAddressAttribute() { - return $this->biling_address()->first(); + return $this->billing_address()->first(); } /** @@ -66,4 +67,20 @@ class Cart extends Model { return $this->hasManyThrough(CartShippingRate::class, CartAddress::class, 'cart_id', 'cart_address_id'); } + + /** + * Get all of the attributes for the attribute groups. + */ + public function getSelectedShippingRateAttribute() + { + return $this->shipping_rates()->where('method', $this->shipping_method)->first(); + } + + /** + * Get the payment associated with the cart. + */ + public function payment() + { + return $this->hasOne(CartPayment::class); + } } \ No newline at end of file diff --git a/packages/Webkul/Cart/src/Models/CartAddress.php b/packages/Webkul/Cart/src/Models/CartAddress.php index 889328d39..935b09eb0 100644 --- a/packages/Webkul/Cart/src/Models/CartAddress.php +++ b/packages/Webkul/Cart/src/Models/CartAddress.php @@ -18,4 +18,12 @@ class CartAddress extends Model { return $this->hasMany(CartShippingRate::class); } + + /** + * Get all of the attributes for the attribute groups. + */ + public function getNameAttribute() + { + return $this->first_name . ' ' . $this->last_name; + } } \ No newline at end of file diff --git a/packages/Webkul/Cart/src/Models/CartPayment.php b/packages/Webkul/Cart/src/Models/CartPayment.php new file mode 100644 index 000000000..1d0487e40 --- /dev/null +++ b/packages/Webkul/Cart/src/Models/CartPayment.php @@ -0,0 +1,10 @@ +getCurrentCurrency()->symbol; } + /** + * Convert price with currency symbol + * + * @param float $price + * @return string + */ + public function convertPrice($price, $currencyCode = null) + { + return $price; + } + /** * Format and convert price with currency symbol * @@ -145,6 +157,17 @@ class Core return currency($price, $currencyCode); } + /** + * Format and convert price with currency symbol + * + * @param float $price + * @return string + */ + public function formatPrice($price, $currencyCode) + { + return currency($price, $currencyCode); + } + /** * Checks if current date of the given channel (in the channel timezone) is within the range * @@ -254,4 +277,21 @@ class Core return $date->format($format); } + + /** + * Retrieve information from payment configuration + * + * @param string $field + * @param int|string|null $channelId + * + * @return mixed + */ + public function getConfigData($field, $channelId = null) + { + if (null === $channelId) { + $channelId = $this->getCurrentChannel()->id; + } + + return Config::get($field); + } } \ No newline at end of file diff --git a/packages/Webkul/Payment/src/Payment.php b/packages/Webkul/Payment/src/Payment.php index ebbd54637..da4d78114 100644 --- a/packages/Webkul/Payment/src/Payment.php +++ b/packages/Webkul/Payment/src/Payment.php @@ -21,7 +21,7 @@ class Payment if($object->isAvailable()) { $paymentMethods[] = [ 'method' => $object->getCode(), - 'title' => $object->getTitle(), + 'method_title' => $object->getTitle(), 'description' => $object->getDescription(), ]; } diff --git a/packages/Webkul/Payment/src/Payment/Payment.php b/packages/Webkul/Payment/src/Payment/Payment.php index 6b4c0a063..4f3f5242c 100644 --- a/packages/Webkul/Payment/src/Payment/Payment.php +++ b/packages/Webkul/Payment/src/Payment/Payment.php @@ -58,14 +58,8 @@ abstract class Payment * * @return mixed */ - public function getConfigData($field, $channelId = null) + public function getConfigData($field) { - if (null === $channelId) { - $channelId = core()->getCurrentChannel()->id; - } - - $paymentConfig = Config::get('paymentmethods.' . $this->getCode()); - - return $paymentConfig[$field]; + return core()->getConfigData('paymentmethods.' . $this->getCode() . '.' . $field); } } \ No newline at end of file diff --git a/packages/Webkul/Shipping/src/Carriers/AbstractShipping.php b/packages/Webkul/Shipping/src/Carriers/AbstractShipping.php index 55cb97848..53be021ac 100644 --- a/packages/Webkul/Shipping/src/Carriers/AbstractShipping.php +++ b/packages/Webkul/Shipping/src/Carriers/AbstractShipping.php @@ -67,16 +67,9 @@ abstract class AbstractShipping * * @return mixed */ - public function getConfigData($field, $channelId = null) + public function getConfigData($field) { - if (null === $channelId) { - $channelId = core()->getCurrentChannel()->id; - } - - $shippingConfig = Config::get('carriers.' . $this->getCode()); - - return $shippingConfig[$field]; + return core()->getConfigData('carriers.' . $this->getCode() . '.' . $field); } - } ?> \ No newline at end of file diff --git a/packages/Webkul/Shipping/src/Carriers/FlatRate.php b/packages/Webkul/Shipping/src/Carriers/FlatRate.php index 449b32e0d..715f11538 100644 --- a/packages/Webkul/Shipping/src/Carriers/FlatRate.php +++ b/packages/Webkul/Shipping/src/Carriers/FlatRate.php @@ -36,7 +36,8 @@ class FlatRate extends AbstractShipping $object->method = 'flatrate_flatrate'; $object->method_title = $this->getConfigData('title'); $object->method_description = $this->getConfigData('description'); - $object->price = 10; + $object->price = core()->convertPrice($this->getConfigData('default_rate')); + $object->base_price = $this->getConfigData('default_rate'); return $object; } diff --git a/packages/Webkul/Shipping/src/Carriers/Free.php b/packages/Webkul/Shipping/src/Carriers/Free.php index e51a1ec53..5ef07c928 100644 --- a/packages/Webkul/Shipping/src/Carriers/Free.php +++ b/packages/Webkul/Shipping/src/Carriers/Free.php @@ -37,6 +37,7 @@ class Free extends AbstractShipping $object->method_title = $this->getConfigData('title'); $object->method_description = $this->getConfigData('description'); $object->price = 0; + $object->base_price = 0; return $object; } diff --git a/packages/Webkul/Shop/src/Http/routes.php b/packages/Webkul/Shop/src/Http/routes.php index cf15f1fa7..be9961934 100644 --- a/packages/Webkul/Shop/src/Http/routes.php +++ b/packages/Webkul/Shop/src/Http/routes.php @@ -20,6 +20,8 @@ Route::group(['middleware' => ['web']], function () { Route::get('test', 'Webkul\Cart\Http\Controllers\CartController@test'); + Route::get('mtest', 'Webkul\Cart\Http\Controllers\CartController@mergeTest'); + Route::post('/checkout/save-address', 'Webkul\Cart\Http\Controllers\CheckoutController@saveAddress')->name('shop.checkout.save-address'); Route::post('/checkout/save-shipping', 'Webkul\Cart\Http\Controllers\CheckoutController@saveShipping')->name('shop.checkout.save-shipping'); diff --git a/packages/Webkul/Shop/src/Resources/assets/js/app.js b/packages/Webkul/Shop/src/Resources/assets/js/app.js index 87860f794..d4abea11f 100644 --- a/packages/Webkul/Shop/src/Resources/assets/js/app.js +++ b/packages/Webkul/Shop/src/Resources/assets/js/app.js @@ -63,10 +63,10 @@ $(document).ready(function () { const flashes = this.$refs.flashes; flashMessages.forEach(function (flash) { - console.log(flash); flashes.addFlash(flash); }, this); }, + responsiveHeader: function () { } } }); diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/_variables.scss b/packages/Webkul/Shop/src/Resources/assets/sass/_variables.scss index dde936d7c..b9b2593e8 100644 --- a/packages/Webkul/Shop/src/Resources/assets/sass/_variables.scss +++ b/packages/Webkul/Shop/src/Resources/assets/sass/_variables.scss @@ -1,32 +1,14 @@ //shop variables $font-color: #242424; $font-size-base: 16px; -$font-name: "Montserrat", sans-serif; -$background-color: #f2f2f2; -$footer-back: #f2f2f2; -$list-heading-color: rgba(165, 165, 165, 1); -$list-color: #242424; -$subscribe-btn-color: black; -$logo-color: #0031f0; -$border-color: #c7c7c7; -$offer-color: #ff6472; +$border-color: #E8E8E8; +$brand-color: #0031f0; //shop variables ends here + +//=======>Need to be removed //customer variables -$sign-up-text-color: #5e5e5e; -$login-text: #3a3a3a; -$background-color: #ffffff; -$color-black : black; -$forgot-password-color: #0031f0; $profile-content-color: #5e5e5e; $horizontal-rule-color: #E8E8E8; //customer variables ends here - -//product -$real-price:#A5A5A5; -$product-font-color: #242424; -$product-special-price-color: #FF6472; -$product-price-color: #FF6472; -$dark-blue-shade: #0031F0; -$bar-color: #D8D8D8; -$gray-shade: #5E5E5E; \ No newline at end of file +//<=======Need to be removed \ No newline at end of file diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss index a59bf9439..970be8186 100644 --- a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss +++ b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss @@ -1,6 +1,4 @@ - @import url("https://fonts.googleapis.com/css?family=Montserrat:400,500"); - @import "icons"; @import "mixins"; @import "variables"; @@ -140,7 +138,7 @@ body { padding-right: 5px; .cart-count { - color: #0031f0; + color: $brand-color; padding-right: 3px; } } @@ -184,7 +182,6 @@ body { margin-right: auto; border-top: 1px solid lightgrey; border-bottom: 1px solid lightgrey; - font-size: 16px; display: block; ul.nav { @@ -299,8 +296,8 @@ body { } +//=======>Need to be removed // header page responsive css start here - @media all and (max-width: 480px) { .header { @@ -353,8 +350,8 @@ body { display: none; .search-content { - border-top: 1px solid #e8e8e8; - border-bottom: 1px solid #e8e8e8; + border-top: 1px solid $border-color; + border-bottom: 1px solid $border-color; height: 48px; .icon.search-icon { @@ -363,8 +360,6 @@ body { } span { - font-size: 16px; - color: #242424; margin-bottom: -7px; margin-left: 5px; } @@ -379,11 +374,9 @@ body { margin-top: 14px; height: 32px; margin-bottom: 14px; - border-bottom: 1px solid #e8e8e8; + border-bottom: 1px solid $border-color; span { - font-size: 16px; - color: #242424; margin-left: 48px; } } @@ -404,7 +397,7 @@ body { .nav > li { float: none; - border-bottom: 1px solid #e8e8e8; + border-bottom: 1px solid $border-color; a { margin-left: 10px; @@ -418,14 +411,13 @@ body { } .nav > li:first-child { - border-top: 1px solid #e8e8e8; + border-top: 1px solid $border-color; } .nav > li:last-child { float:none; span { - font-size: 16px; color: #FF6472; letter-spacing: -0.38px; } @@ -540,7 +532,7 @@ body { .nav > li { float: none; - border-bottom: 1px solid #e8e8e8; + border-bottom: 1px solid $border-color; a { margin-left: 10px; @@ -554,14 +546,13 @@ body { } .nav > li:first-child { - border-top: 1px solid #e8e8e8; + border-top: 1px solid $border-color; } .nav > li:last-child { float:none; span { - font-size: 16px; color: #FF6472; letter-spacing: -0.38px; } @@ -608,9 +599,9 @@ body { } } - - // header page responsive ends here +//<=======Need to be removed + section.slider-block { display: block; @@ -651,6 +642,7 @@ section.slider-block { width:100%; } } + div.slider-control { display: block; position: absolute; @@ -660,7 +652,7 @@ section.slider-block { .dark-left-icon { - background-color: $background-color; + background-color: #f2f2f2; height: 48px; width: 48px; max-height: 100%; @@ -668,7 +660,7 @@ section.slider-block { } .light-right-icon { - background-color: $color-black; + background-color: #000; height: 48px; width: 48px; max-height: 100%; @@ -685,27 +677,25 @@ section.slider-block { min-height: 1px; .filter-title { - border-bottom: 1px solid #E8E8E8; - font-size: 16px; + border-bottom: 1px solid $border-color; color: $font-color; padding: 10px 0; } .filter-attributes { .filter-attributes-item { - border-bottom: 1px solid #E8E8E8; + border-bottom: 1px solid $border-color; padding-bottom: 10px; .filter-attributes-title { padding: 10px 40px 0 10px; - font-size: 16px; color: #5E5E5E; cursor: pointer; position: relative; .remove-filter-link { font-weight: 400; - color: #0031F0; + color: $brand-color; margin-right: 10px; } @@ -730,7 +720,6 @@ section.slider-block { li.item { padding: 8px 0; - font-size: 16px; color: #5E5E5E; .checkbox { @@ -767,7 +756,6 @@ section.slider-block { } } - .main-container-wrapper { max-width: 80%; width: auto; @@ -812,7 +800,6 @@ section.slider-block { } .product-name { - font-size: 16px; margin-bottom: 14px; width: 100%; color: $font-color; @@ -823,7 +810,6 @@ section.slider-block { } .product-description { - font-size: 16px; margin-bottom: 14px; display: none; } @@ -907,7 +893,6 @@ section.slider-block { float: right; label { - font-size: 16px; margin-right: 5px; } @@ -915,7 +900,6 @@ section.slider-block { background: #FFFFFF; border: 1px solid #C7C7C7; border-radius: 3px; - font-size: 16px; color: $font-color; padding: 10px; } @@ -1028,8 +1012,9 @@ section.slider-block { } } -// responsive category css start here +//=======>Need to be removed +// responsive category css start here @media all and (max-width: 480px) { .main-container-wrapper { @@ -1078,7 +1063,7 @@ section.slider-block { } .top-toolbar { - border-bottom: 1px solid #E8E8E8; + border-bottom: 1px solid $border-color; margin-bottom: 10px; .page-info { @@ -1129,7 +1114,6 @@ section.slider-block { background: #FFFFFF; border: 1px solid #C7C7C7; border-radius: 3px; - font-size: 16px; color: $font-color; padding: 10px; } @@ -1189,7 +1173,7 @@ section.slider-block { } .top-toolbar { - border-bottom: 1px solid #E8E8E8; + border-bottom: 1px solid $border-color; margin-bottom: 10px; .page-info { @@ -1240,7 +1224,6 @@ section.slider-block { background: #FFFFFF; border: 1px solid #C7C7C7; border-radius: 3px; - font-size: 16px; color: $font-color; padding: 10px; } @@ -1251,9 +1234,10 @@ section.slider-block { } } } +//<=======Need to be removed + .product-price { - font-size: 16px; margin-bottom: 14px; width: 100%; font-weight: 600; @@ -1264,20 +1248,18 @@ section.slider-block { } .regular-price { - font-size: 16px; color: #A5A5A5; text-decoration: line-through; margin-right: 10px; } .special-price { - font-size: 16px; color: #FF6472; } } .footer { - background-color: $footer-back; + background-color: #f2f2f2; padding-left: 10%; padding-right: 10%; @@ -1294,10 +1276,9 @@ section.slider-block { .list-container { .list-heading { - font-size: 16px; letter-spacing: -0.26px; text-transform: uppercase; - color: $list-heading-color; + color: rgba(165, 165, 165, 1); } .list-group { @@ -1305,7 +1286,6 @@ section.slider-block { li { margin-bottom: 12px; - color: $list-color; list-style-type: none; text-transform: uppercase; @@ -1343,7 +1323,7 @@ section.slider-block { } .btn-primary { - background-color: $subscribe-btn-color; + background-color: #000; margin-top: 8px; border-radius: 0px; text-align: center; @@ -1356,7 +1336,6 @@ section.slider-block { } //customers page css goes here - .content { padding-top: 15%; padding-bottom: 15%; @@ -1367,7 +1346,7 @@ section.slider-block { margin-right: auto; text-align: center; font-size: 18px; - color: $sign-up-text-color; + color: #5e5e5e; letter-spacing: -0.29px; text-align: center; } @@ -1376,7 +1355,7 @@ section.slider-block { margin-left: auto; margin-right: auto; display: flex; - background: $background-color; + background: #f2f2f2; border: 1px solid $border-color; flex-direction: column; max-width: 530px; @@ -1388,7 +1367,7 @@ section.slider-block { .login-text { font-size: 24px; font-weight: bold; - color: $login-text; + color: #3a3a3a; letter-spacing: -0.23px; margin-top: 5%; margin-bottom: 3%; @@ -1404,7 +1383,7 @@ section.slider-block { .forgot-password-link { font-size: 17px; - color: $forgot-password-color; + color: $brand-color; letter-spacing: -0.11px; margin-bottom: 5%; } @@ -1437,16 +1416,14 @@ section.slider-block { flex-direction: column; align-content: center; justify-content: flex-start; - border: 1px solid #e8e8e8; - background: $background-color; + border: 1px solid $border-color; + background: #f2f2f2; width: 25%; height: 100%; text-transform: capitalize; - font-size: 16px; color: #5e5e5e; li { - font-size: 16px; width: 95%; height: 50px; margin-left: 5%; @@ -1467,7 +1444,7 @@ section.slider-block { } li.active { - color: $forgot-password-color; + color: $brand-color; } } @@ -1487,7 +1464,7 @@ section.slider-block { .profile-edit { font-size: 17px; margin-top: 1%; - color: #0031f0; + color: $brand-color; letter-spacing: -0.11px; float: right; } @@ -1497,13 +1474,12 @@ section.slider-block { width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: $border-color; } } } .profile-content { - font-size: 16px; color: $profile-content-color; margin-top: 1.4%; @@ -1536,7 +1512,7 @@ section.slider-block { .edit-form { display: flex; - background: $background-color; + background: #f2f2f2; border: 1px solid $border-color; flex-direction: column; min-height: 345px; @@ -1550,8 +1526,7 @@ section.slider-block { // product pages css starts here section.product-detail { - font-size: 16px; - color: $product-font-color; + color: $font-color; div.category-breadcrumbs { display: inline; @@ -1713,7 +1688,7 @@ section.product-detail { .product-heading { font-size: 24px; - color: $product-font-color; + color: $font-color; margin-bottom: 15px; } @@ -1748,7 +1723,6 @@ section.product-detail { } .accordian .accordian-header { - font-size: 16px; padding-left: 0; font-weight: 600; } @@ -1762,104 +1736,15 @@ section.product-detail { width: 100%; border-bottom: solid 1px rgba(162, 162, 162, 0.2); } - - .full-description { - font-size: 16px; - } } - - // .rating-reviews { - // margin-top: 0px; - // width: 50%; - // margin-left: 20px; - - // .title-inline { - // display: inline-flex; - // align-items: center; - // justify-content: space-between; - // margin-bottom: 20px; - // width: 100%; - - // button { - // float: right; - // border-radius: 0px !important; - // } - // } - - // .overall { - // display: flex; - // flex-direction: row; - // align-items: center; - // justify-content: space-between; - // height: 150px; - - // .left-side { - // margin-bottom: 20px; - - // .number{ - // font-size: 34px; - // } - // } - - // .right-side { - // display: block; - - // .rater { - // display: inline-flex; - // align-items: center; - - // .star { - // width: 50px; - // height: 20px; - // padding: 1px; - // margin-right: 8px; - // } - - // .line-bar { - // height: 4px; - // width: 158px; - // margin-right: 12px; - // background: $bar-color; - - // .line-value { - // background-color: $dark-blue-shade; - // } - // } - // } - // } - // } - - // .reviews { - // margin-top: 34px; - // margin-bottom: 90px; - - // .review { - // margin-bottom: 25px; - - // .title { - // margin-bottom: 5px; - // } - - // .stars { - // margin-bottom: 15px; - // } - // .message { - // margin-bottom: 10px; - // } - // } - // .view-all { - // margin-top:15px; - // color: $logo-color; - // margin-bottom:15px; - // } - // } - // } } } } +// product pages css ends here -// products responsive css start here +//=======>Need to be removed +// products responsive css starts here @media all and (max-width: 480px) { section.product-detail { @@ -1912,7 +1797,7 @@ section.product-detail { .details { width: 100%; margin-top: 20px; - border-bottom: 1px solid #e8e8e8e8; + border-bottom: 1px solid $border-color; .attributes { border-bottom: none; @@ -1976,7 +1861,7 @@ section.product-detail { .details { width: 100%; margin-top: 20px; - border-bottom: 1px solid #e8e8e8e8; + border-bottom: 1px solid $border-color; .attributes { border-bottom: none; @@ -1987,8 +1872,8 @@ section.product-detail { } } - -// products responsive css end here +// products responsive css ends here +//<=======Need to be removed .rating-reviews { @@ -2048,7 +1933,7 @@ section.product-detail { .view-all { margin-top:15px; - color: $logo-color; + color: $brand-color; margin-bottom:15px; } } @@ -2056,8 +1941,7 @@ section.product-detail { /* cart pages and elements css begins here */ section.cart { - color: $product-font-color; - font-size: 16px; + color: $font-color; margin-bottom: 80px; .title { @@ -2069,214 +1953,216 @@ section.cart { padding: 1px; display: flex; flex-direction: row; + } +} - .left-side { - width: 68.6%; - margin-right: 2.4%; +.cart { + .left-side { + width: 68.6%; + margin-right: 2.4%; + } - .item { - padding: 1.1%; - margin-bottom: 20px; - display: flex; - flex-direction: row; + .right-side { + width: 29%; + display: block; - .item-image { - height: 160px; - width: 160px; - } + .price-section { + width: 100%; + padding: 10px 10px 18px 18px; + margin-bottom: 20px; + + .title { + font-weight: bold; + padding-bottom: 8px; + margin-bottom: 10px; + } + + .all-item-details { + margin-bottom: 17px; .item-details { - display: flex; - flex-direction: column; + margin-bottom: 10px; - .item-title { - font-size: 18px; - margin-bottom: 10px; + .name { } .price { - margin-bottom: 10px; - - .main-price { - font-size: 18px; - margin-right: 4px; - } - - .real-price { - margin-right: 4px; - text-decoration-line: line-through; - } - - .discount { - color: $product-price-color; - } - } - - .summary { - margin-bottom: 17px; - } - - .misc { - display: inline-flex; - align-items: center; - justify-content: flex-start; - - div.qty-text { - color: $gray-shade; - margin-right: 10px; - } - - div.box { - height: 38px; - width: 60px; - text-align: center; - line-height: 38px; - border: 1px solid $border-color; - border-radius: 3px; - margin-right: 30px; - } - - .remove { - color: $dark-blue-shade; - margin-right: 30px; - } - - .towishlist { - color : $dark-blue-shade; - } - + float: right; } } } + .horizontal-rule { + width: 100%; + height: 1px; + vertical-align: middle; + background: $border-color; + } - .misc-controls { - float: right; + .total-details { + margin-top: 10px; - span { - margin-right: 15px; - } - - button { - border-radius: 0px; + .amount { + float: right; } } } - .right-side { - width: 29%; - display: block; + .coupon-section { + padding: 10px 10px 18px 18px; - .price-section { + .title { + font-weight: bold; + margin-bottom: 10px; + } + + .control-group { + margin-bottom: 12px !important; + + input.coupon-input::-moz-placeholder { + font-family: "montserrat", sans-serif; + color: $font-color; + } + + input.coupon-input::-webkit-input-placeholder { + font-family: "montserrat", sans-serif; + color: $font-color; + } + + } + + button { + margin-bottom: 10px; + background-color: #000; + border-radius: 0px; + } + + .coupon-details { + + .coupon { + margin-bottom: 8px; + + .discount { + float: right; + } + } + } + + .horizontal-rule { width: 100%; - padding: 10px 10px 18px 18px; - margin-bottom: 20px; - - .title { - font-size: 16px; - font-weight: bold; - padding-bottom: 8px; - margin-bottom: 10px; - } - - .all-item-details { - margin-bottom: 17px; - - .item-details { - margin-bottom: 10px; - - .name { - } - - .price { - float: right; - } - } - } - .horizontal-rule { - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - } - - .total-details { - margin-top: 10px; - - .amount { - float: right; - } - } + height: 1px; + vertical-align: middle; + background: $border-color; + margin-bottom: 9px; } - .coupon-section { - padding: 10px 10px 18px 18px; + .after-coupon-amount { - .title { - font-size: 16px; + .name { font-weight: bold; - margin-bottom: 10px; } - .control-group { - margin-bottom: 12px !important; - - input.coupon-input::-moz-placeholder { - font-family: "montserrat", sans-serif; - font-size: 16px; - color: $product-font-color; - } - - input.coupon-input::-webkit-input-placeholder { - font-family: "montserrat", sans-serif; - font-size: 16px; - color: $product-font-color; - } - - } - - button { - margin-bottom: 10px; - background-color: $color-black; - border-radius: 0px; - } - - .coupon-details { - - .coupon { - margin-bottom: 8px; - - .discount { - float: right; - } - } - } - - .horizontal-rule { - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - margin-bottom: 9px; - } - - .after-coupon-amount { - - .name { - font-weight: bold; - } - - .amount { - float: right; - font-weight: bold; - } - + .amount { + float: right; + font-weight: bold; } } } + + } +} + +.cart-item-list { + margin-top: 21px; + padding: 1px; + + .item { + padding: 1.1%; + margin-bottom: 20px; + display: flex; + flex-direction: row; + + .item-image { + height: 160px; + width: 160px; + } + + .item-details { + display: flex; + flex-direction: column; + + .item-title { + font-size: 18px; + margin-bottom: 10px; + } + + .price { + margin-bottom: 10px; + + .main-price { + font-size: 18px; + margin-right: 4px; + } + + .real-price { + margin-right: 4px; + text-decoration-line: line-through; + } + + .discount { + color: #FF6472; + } + } + + .summary { + margin-bottom: 17px; + } + + .misc { + display: inline-flex; + align-items: center; + justify-content: flex-start; + + div.qty-text { + color: #5E5E5E; + margin-right: 10px; + } + + div.box { + height: 38px; + width: 60px; + text-align: center; + line-height: 38px; + border: 1px solid $border-color; + border-radius: 3px; + margin-right: 30px; + } + + .remove { + color: $brand-color; + margin-right: 30px; + } + + .towishlist { + color : $brand-color; + } + + } + } } + .misc-controls { + float: right; + + span { + margin-right: 15px; + } + + button { + border-radius: 0px; + } + } } .attached-products-wrapper { @@ -2285,7 +2171,7 @@ section.cart { .title { margin-bottom: 40px; font-size: 18px; - color: $product-font-color; + color: $font-color; text-align: center; position: relative; @@ -2310,6 +2196,8 @@ section.cart { } } + +//=======>Need to be removed @media all and (max-width: 480px){ .attached-products-wrapper { @@ -2328,7 +2216,12 @@ section.cart { } } } +//<=======Need to be removed + + + +//=======>Need to be removed @media all and (min-width: 481px) and (max-width: 920px) { .attached-products-wrapper { @@ -2347,10 +2240,13 @@ section.cart { } } } +//<=======Need to be removed + + +//=======>Need to be removed // order page css start here - .order { margin-left: 5.5%; margin-top: 1%; @@ -2359,7 +2255,6 @@ section.cart { .order-section-head { .order-number { font-size: 28px; - color: #242424; text-transform: capitalize; text-align: left; } @@ -2367,7 +2262,7 @@ section.cart { .order-cancel { font-size: 17px; margin-top: 1%; - color: #0031f0; + color: $brand-color; letter-spacing: -0.11px; float: right; } @@ -2387,7 +2282,7 @@ section.cart { width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: $border-color; } } @@ -2396,7 +2291,6 @@ section.cart { } .payment-place { - font-size: 16px; color: $profile-content-color; margin-top: 1.4%; @@ -2410,7 +2304,6 @@ section.cart { span { color: #5E5E5E; letter-spacing: -0.12px; - font-size: 16px; } .processing { @@ -2423,7 +2316,6 @@ section.cart { span { color: #5E5E5E; letter-spacing: -0.12px; - font-size: 16px; } } } @@ -2439,7 +2331,6 @@ section.cart { span { color: #5E5E5E; letter-spacing: -0.12px; - font-size: 16px; } } @@ -2448,7 +2339,6 @@ section.cart { span { color: #5E5E5E; letter-spacing: -0.12px; - font-size: 16px; } } } @@ -2458,7 +2348,7 @@ section.cart { width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: $border-color; } } @@ -2595,7 +2485,7 @@ section.cart { width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: $border-color; } .order-information { @@ -2614,17 +2504,14 @@ section.cart { } p { - font-size: 16px; color: #3A3A3A; } } } - // oder page css end here // responsive order page css start here - @media all and (max-width: 480px) { .order { @@ -2653,8 +2540,6 @@ section.cart { .order-number { text-align: center; - font-size: 16px; - color: #242424; letter-spacing: -0.38px; text-align: center; margin-top: 13px; @@ -2665,14 +2550,14 @@ section.cart { float: right; text-align: right; font-size: 17px; - color: #0031F0; + color: $brand-color; letter-spacing: -0.11px; margin-top: 13px; margin-bottom: 13px; } .horizon-rule { - border: .5px solid #E8E8E8; + border: .5px solid $border-color; width: 150%; margin-left: -10%; margin-right: -10%; @@ -2680,7 +2565,6 @@ section.cart { } .payment-place { - font-size: 16px; color: $profile-content-color; margin-top: 4%; @@ -2738,7 +2622,7 @@ section.cart { width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: $border-color; } } @@ -2846,7 +2730,7 @@ section.cart { } .product-config { - border: 1px solid #E8E8E8; + border: 1px solid $border-color; height: 19%; width:100%; margin-top: 10px; @@ -2873,7 +2757,6 @@ section.cart { width:50%; span { - font-size: 16px; color: #5E5E5E; letter-spacing: -0.11px; } @@ -2933,8 +2816,6 @@ section.cart { .order-number { text-align: center; - font-size: 16px; - color: #242424; letter-spacing: -0.38px; text-align: center; margin-top: 13px; @@ -2945,14 +2826,14 @@ section.cart { float: right; text-align: right; font-size: 17px; - color: #0031F0; + color: $brand-color; letter-spacing: -0.11px; margin-top: 13px; margin-bottom: 13px; } .horizon-rule { - border: .5px solid #E8E8E8; + border: .5px solid $border-color; width: 150%; margin-left: -10%; margin-right: -10%; @@ -2960,7 +2841,6 @@ section.cart { } .payment-place { - font-size: 16px; color: $profile-content-color; margin-top: 4%; @@ -3018,7 +2898,7 @@ section.cart { width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: $border-color; } } @@ -3126,7 +3006,7 @@ section.cart { } .product-config { - border: 1px solid #E8E8E8; + border: 1px solid $border-color; height: 19%; width:100%; margin-top: 10px; @@ -3153,7 +3033,6 @@ section.cart { width:50%; span { - font-size: 16px; color: #5E5E5E; letter-spacing: -0.11px; } @@ -3186,9 +3065,11 @@ section.cart { } // responsive order css end here +//<=======Need to be removed + // checkout starts here -.checkout-process{ +.checkout-process { display: flex; flex-direction: row; width: 100%; @@ -3205,7 +3086,7 @@ section.cart { justify-content: space-between; width: 100%; padding-bottom: 15px; - border-bottom: 1px solid #E8E8E8;; + border-bottom: 1px solid $border-color; li { height: 48px; @@ -3217,7 +3098,7 @@ section.cart { border: 1px solid black; border-radius: 50%; display: inline-flex; - border: 1px solid #E8E8E8; + border: 1px solid $border-color; background-repeat: no-repeat; background-position: center; @@ -3241,8 +3122,8 @@ section.cart { &.completed { cursor: pointer; - img { - margin: auto; + .decorator { + background-image: url('../images/complete.svg'); } } @@ -3250,7 +3131,6 @@ section.cart { margin-left: 7px; margin-top: auto; margin-bottom: auto; - font-size: 16px; } &.active { @@ -3280,7 +3160,7 @@ section.cart { } .form-container { - border-bottom: 1px solid #E8E8E8; + border-bottom: 1px solid $border-color; padding-top: 20px; padding-bottom: 20px; } @@ -3300,774 +3180,151 @@ section.cart { margin-left: 28px; } } + + .address { + display: inline-block; + width: 100%; + + .address-card { + width: 50%; + float: left; + + .card-title span { + font-weight: 600; + } + + .card-content { + margin-top: 15px; + color: #121212; + line-height: 25px; + + .horizontal-rule { + margin: 12px 0; + display: block; + width: 25px; + background: #121212; + } + } + } + } + + .cart-item-list { + .item { + border: 1px solid $border-color; + border-radius: 3px; + padding: 20px; + + .row { + .title { + width: 100px; + display: inline-block; + color: #5E5E5E; + font-weight: 500; + margin-bottom: 10px; + } + + .value { + font-size: 18px; + font-weight: 600; + } + } + } + } + + .order-description { + display: inline-block; + width: 100%; + + .shipping { + margin-bottom: 25px; + } + + .decorator { + height: 48px; + width: 48px; + border-radius: 50%; + border: 1px solid $border-color; + vertical-align: middle; + display: inline-block; + text-align: center; + + .icon { + margin-top: 7px; + } + } + + .text { + font-weight: 600; + vertical-align: middle; + display: inline-block; + + .info { + font-weight: 500; + margin-top: 2px; + } + } + } + // complete page end here + + + + + + + + + + + + + + + + + } } .col-right { width: 35%; padding-left: 40px; - - .order-summary { - - .price { - - span { - margin-left: 3px; - font-size: 16px; - color: #242424; - font-weight: bold; - } - } - - .item-detail { - margin-top:12px; - - span { - margin-left: 3px; - - label { - font-size: 16px; - color: #242424; - } - - .right { - float: right; - font-size: 16px; - color: #242424; - } - } - } - - .horizontal-rule { - margin-top: 6%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - } - - .payble-amount { - margin-top: 12px; - - span { - margin-left: 3px; - font-weight: bold; - - label { - font-size: 16px; - color: #242424; - font-weight: bold; - } - - .right { - - float:right; - font-size: 16px; - color: #242424; - } - } - } - } } -} - -// checkout ends here - -// responsive checkout start here - -@media all and (max-width: 480px) { - .checkout-process{ - width: 100%; - margin-top: 3%; - - .left-side { - width: 100%; - margin-right: 0%; - height: 60px; - - .checkout-menu { - width: 100%; - - ul.checkout-detail { - height: 60px; - width: 100%; - padding: 5px; - - li { - height: 48px; - - .wrapper { - display: flex; - - span { - display: none; - } - } - } - - .line { - margin-top: 23px; - width: 100%; - margin-left: 5px; - margin-right: 5px; - border: 1px solid #E7E7E7; - height: 1px; - } - } - - .horizontal-rule { - display: none; - } - } - } - - .right-side { - display: none; - } - } - - .order-info{ - width: 100%; - margin-right: 0%; - margin-top: 10px; - height:50px; - - .control-group { - - .control{ - width:100%; - } - } - - .different-billing-addr { - margin-top: 5%; - } - - .horizontal-rule { - margin-top: 10%; - } - - .countinue-button { - margin-top: 8%; - } - } -} - -@media all and (min-width: 481px) and (max-width: 920px) { - - .checkout-process{ - width: 100%; - margin-top:3%; - - .left-side { - width: 100%; - margin-right: 0%; - height: 60px; - - .checkout-menu { - width: 100%; - - ul.checkout-detail { - height: 60px; - width: 100%; - padding: 5px; - - li { - height: 48px; - - .wrapper { - display:flex; - - span { - display: none; - } - - } - } - - .line { - margin-top: 23px; - width: 100%; - margin-left: 10px; - margin-right: 10px; - border: 1px solid #E7E7E7; - height: 1px; - } - } - - .horizontal-rule { - display: none; - } - } - } - - .right-side { - display:none; - } - } - - .order-info{ - width: 100%; - margin-right: 0%; - margin-top: 10px; - height:50px; - - .control-group { - - .control{ - width:100%; - } - } - - .different-billing-addr { - margin-top: 3%; - } - - .horizontal-rule { - margin-top: 10%; - } - - .countinue-button { - margin-top: 5%; - } - } -} -// responsive checkout end here - - - -//shipment start here -.ship-method { - width: 67%; - margin-right: 6%; - height: 600px; - margin-top: -190px; - - .ship-info { - - .ship-text{ - font-size: 24px; - color: #242424; - letter-spacing: -0.58px; - font-weight: bold; - } - } - - .ship-price { - margin-top: 31px; - - .price-checkbox { - display:flex; - - span { - margin-left: 8px; - font-size: 16px; - color: #242424; - line-height: 22px; - font-weight: bold; - } - - } - - .price-checkbox-text { - margin-left: 25px; - width:580px; - height:44px; - margin-top: 4px; - - b { - font-size: 16px; - } - - span { - font-size: 16px; - color: #242424; - line-height: 22px; - } - } - - - } - - .horizontal-rule { - margin-top: 7%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - } - - .countinue-button { - margin-top: 3%; - - button { - background: #0031F0; - font-size: 14px; - color: #FFFFFF; - letter-spacing: -0.26px; - text-align: center; - height: 38px; - width: 137px; - border: none; - } - } -} -//shipment end here - -// payment method start here -.payment-method { - width: 67%; - margin-right: 6%; - height: 600px; - margin-top: -190px; - - .payment-info { - - .payment-text{ - font-size: 24px; - color: #242424; - letter-spacing: -0.58px; - font-weight: bold; - } - } - - .payment-price { - margin-top: 31px; - - .payment-checkbox { - display:flex; - - span { - margin-left: 8px; - font-size: 16px; - color: #242424; - line-height: 22px; - font-weight: bold; - } - - } - - .payment-checkbox-text { - margin-left: 25px; - width:580px; - height:44px; - margin-top: 4px; - - b { - font-size: 16px; - } - - span { - font-size: 16px; - color: #242424; - line-height: 22px; - } - } - - - } - - .horizontal-rule { - margin-top: 7%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - } - - .countinue-button { - margin-top: 3%; - - button { - background: #0031F0; - font-size: 14px; .horizontal-rule { - margin-top: 7%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - } - color: #FFFFFF; - letter-spacing: -0.26px; .horizontal-rule { - margin-top: 7%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - } - text-align: center; - height: 38px; - width: 137px; - border: none; - } - } -} -// payment method end here - - -// complete page start here -.complete-page{ - width:880px; - height: 1050px; .order-summary { - - span { - font-size: 24px; - color: #242424; - font-weight: bold; - letter-spacing: -0.58px; + h3 { + font-size: 16px; } - } - .address { - display: flex; - flex-direction: row; - margin-top: 30px; + .item-detail { + margin-top:12px; - .shipping-address { - height: 100px; - width: 415px; - - .shipping-title { - - span { - font-weight: bold; - font-size: 16px; - color: #242424 - } - } - - .shipping-content { - margin-top: 15px; - width: 175px; - - .addr { - margin-top: 5px; - - span { - font-size: 16px; - color: #121212; - } - } - - .horizontal-rule { - margin-top: 7%; - width: 25px; - height: 1px; - vertical-align: middle; - background: #121212; - } - - .contact { - margin-top: 10px; - - span { - font-size: 16px; - color: #121212; - } + label { + &.right { + float: right; } } } - .billing-address { - width: 415px; + .payble-amount { + margin-top: 17px; + border-top: 1px solid $border-color; + padding-top: 12px; - .shipping-title { + label { + font-weight: bold; - span { - font-weight: bold; - font-size: 16px; - color: #242424 - } - } - - .shipping-content { - margin-top: 15px; - width: 175px; - - .addr { - margin-top: 5px; - - span { - font-size: 16px; - color: #121212; - } - } - - .horizontal-rule { - margin-top: 7%; - width: 25px; - height: 1px; - vertical-align: middle; - background: #121212; - } - - .contact { - margin-top: 10px; - - span { - font-size: 16px; - color: #121212; - } - } - } - } - } - - .product-detail { - height: 200px; - border: 1px solid #E8E8E8; - border-radius: 3px; - margin-top: 30px; - display: flex; - flex-direction: row; - - .product-image { - margin: 20px 0px 20px 20px; - - img { - height: 160px; - width:160px; - } - } - margin-top: 30px; - .product-desc { - margin-top: 20px; - margin-left: 10px; - - .product-title { - - span { - font-size: 18px; - color: #242424; - letter-spacing: -0.43px; - font-weight: bold; - } - } - - .price { - margin-top:11px; - - span { - - label { - font-size: 16px; - color: #5E5E5E; - } - - label.bold { - margin-left:45px; - font-weight: bold; - font-size: 18px; - color: #242424; - } - } - } - - .quantity { - margin-top:11px; - - span { - - label { - font-size: 16px; - color: #5E5E5E; - } - - label.quat-bold { - margin-left:15px; - font-weight: bold; - font-size: 18px; - color: #242424; - } - } - } - - .pro-attribute { - width:413px; - margin-top:14px; - - span { - - font-size: 16px; - color: #242424; - } - } - } - } - - .order-description { - height: 140px; - border-radius: 3px; - margin-top: 30px; - display: flex; - flex-direction: row; - justify-content: space-between; - - .payment { - - .shipping{ - display: flex; - flex-direction: row; - - .pay-icon { - height: 48px; - width: 48px; - border-radius: 50%; - border: 1px solid #E8E8E8; - - img { - margin-left: 8px; - margin-top: 8px; - } - - span { - margin-left: 10px; - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; - } - } - - .shipping-text { - display: flex; - flex-direction: column; - - .price { - margin-top: 5px; - margin-left: 5px; - - span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; - } - } - - .fedex-shipping { - margin-left: 5px; - - span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; - } - } - } - } - - .net-banking{ - margin-top: 23px; - display: flex; - flex-direction: row; - - .pay-icon { - height: 48px; - width: 48px; - border-radius: 50%; - border: 1px solid #E8E8E8; - - img { - margin-left: 8px; - margin-top: 8px; - } - } - - span { - margin-left: 5px; - margin-top: 15px; - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; - } - } - } - - .product-bill { - height:200px; - width:300px; - - .sub-total { - - span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; - } - - .right{ + &.right { float:right; } } - - .charge-discount { - margin-top: 10px; - - span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; - } - - .right{ - float:right; - } - } - - .horizontal-rule { - margin-top: 5%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - } - - .amount-pay { - margin-top: 15px; - - span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; - } - - .right{ - float:right; - } - } - } - } - - .horizontal-rule { - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - } - - .palce-order-button { - margin-top: 30px; - - button { - width:137px; - height: 38px; - background: #0031F0; - font-size: 14px; - color: #FFFFFF; - letter-spacing: -0.26px; - text-align: center; - border:none; } } } -// complete page end here - +// checkout ends here // review page start here section.review { - font-size: 16px; - color: $product-font-color; + color: $font-color; .category-breadcrumbs { display: inline; @@ -4094,7 +3351,6 @@ section.review { span { font-size: 24px; - color: #242424; letter-spacing: -0.58px; } } @@ -4110,15 +3366,12 @@ section.review { .pro-price-not { margin-left: 10px; - font-size: 16px; color: #A5A5A5; letter-spacing: -0.26px; } .offer { margin-left: 10px; - font-size: 16px; - color: #242424; letter-spacing: -0.26px; } } @@ -4132,8 +3385,6 @@ section.review { margin-top: 10px; span { - font-size: 16px; - color: #242424; letter-spacing: -0.26px; } @@ -4145,7 +3396,6 @@ section.review { .rating { margin-top : 25px; - font-size: 16px; color: #5E5E5E; letter-spacing: -0.12px; @@ -4191,7 +3441,7 @@ section.review { margin-top: 10px; button { - background: #0031F0; + background: $brand-color; font-size: 14px; color: #FFFFFF; letter-spacing: -0.26px; @@ -4218,7 +3468,6 @@ section.review { span { font-size: 34px; - color: #242424; letter-spacing: -0.82px; text-align: center; } @@ -4236,12 +3485,10 @@ section.review { } } } - // review page end here // customer section css start here - .cusomer-section { margin-left: 50px; width:100%; @@ -4249,7 +3496,7 @@ section.review { .customer-section-info { display: flex; flex-direction: row; - border-top: 1px solid #E8E8E8; + border-top: 1px solid $border-color; .pro-img { margin-top: 10px; @@ -4266,8 +3513,7 @@ section.review { width: 100%; .title { - font-size: 16px; - color: #0031F0; + color: $brand-color; margin-top: 15px; } @@ -4287,8 +3533,7 @@ section.review { } .customer-section-info:last-child { - border-bottom: 1px solid #e8e8e8; + border-bottom: 1px solid $border-color; } } - // customer section css end here \ No newline at end of file diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss b/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss index d4c2de509..df3227acc 100644 --- a/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss +++ b/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss @@ -53,4 +53,16 @@ background-image:URL('../images/icon-share.svg'); width: 24px; height: 24px; +} + +.shipping-icon { + background-image: url('../images/shipping.svg'); + width: 32px; + height: 32px; +} + +.payment-icon { + background-image: url('../images/payment.svg'); + width: 32px; + height: 32px; } \ No newline at end of file diff --git a/packages/Webkul/Shop/src/Resources/lang/en/app.php b/packages/Webkul/Shop/src/Resources/lang/en/app.php index 1ad002407..d2ccf7be8 100644 --- a/packages/Webkul/Shop/src/Resources/lang/en/app.php +++ b/packages/Webkul/Shop/src/Resources/lang/en/app.php @@ -87,7 +87,21 @@ return [ 'use_for_shipping' => 'Ship to this address', 'continue' => 'Continue', 'shipping-method' => 'Shipping Method', - 'payment-information' => 'Payment Information' + 'payment-information' => 'Payment Information', + 'summary' => 'Summary of Order', + 'price' => 'Price', + 'quantity' => 'Quantity', + 'billing-address' => 'Billing Address', + 'shipping-address' => 'Shipping Address', + 'contact' => 'Contact', + 'place-order' => 'Place Order' + ], + + 'total' => [ + 'order-summary' => 'Order Summary', + 'sub-total' => 'Sub Total', + 'grand-total' => 'Grand Total', + 'delivery-charges' => 'Delivery Charges' ] ] ]; \ No newline at end of file diff --git a/packages/Webkul/Shop/src/Resources/views/checkout/cart/index.blade.php b/packages/Webkul/Shop/src/Resources/views/checkout/cart/index.blade.php index 361731c3b..0b21826d7 100644 --- a/packages/Webkul/Shop/src/Resources/views/checkout/cart/index.blade.php +++ b/packages/Webkul/Shop/src/Resources/views/checkout/cart/index.blade.php @@ -20,51 +20,55 @@
- @foreach($cart->items as $item) +
+ @foreach($cart->items as $item) - product; + product; - $productBaseImage = $productImageHelper->getProductBaseImage($product); - ?> + $productBaseImage = $productImageHelper->getProductBaseImage($product); + ?> + +
+
+ +
+ +
+ +
+ {{ $product->name }} +
+ +
+ + {{ $item->price }} + + + $25.00 + + + 10% Off + +
+ +
+ Color : Gray, Size : S +
+ +
+
Quantity
+
{{ $item->quantity }}
+ Remove + Move to Wishlist +
+
-
-
-
+ @endforeach -
- -
- {{ $product->name }} -
- -
- - {{ $item->price }} - - - $25.00 - - - 10% Off - -
- -
- Color : Gray, Size : S -
- -
-
Quantity
-
{{ $item->quantity }}
- Remove - Move to Wishlist -
-
- -
- @endforeach +
+
Continue Shopping @@ -73,6 +77,7 @@
+
Price Detail @@ -94,6 +99,7 @@
+
Apply Coupon 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 9fb6fbbf0..11de9111c 100644 --- a/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php +++ b/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php @@ -55,7 +55,7 @@
- +
@@ -69,7 +69,7 @@
- +
@@ -83,21 +83,34 @@
- @include('shop::checkout.onepage.review') + + +
+ + + +
- @include('shop::checkout.onepage.summary') +
+ + + +
- - - - - -@endpush - - - diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/payment-method.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/payment-method.blade.php deleted file mode 100644 index 5eda20d85..000000000 --- a/packages/Webkul/Shop/src/Resources/views/customers/checkout/payment-method.blade.php +++ /dev/null @@ -1,57 +0,0 @@ - -@extends('shop::layouts.master') - -@section('content-wrapper') - -@include('shop::customers.checkout.common.common') - -
-
- - Payment Method - -
- -
-
- - Cash on Delivery -
-
- Fadex - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut. -
-
- -
-
- - Net Banking -
-
- Fadex - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut. -
-
- -
-
- - Debit / Credit Card -
-
- Fadex - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut. -
-
- - -
-
- -
- -
-
- -@endsection \ No newline at end of file diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/ship-method.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/ship-method.blade.php deleted file mode 100644 index b0303e15d..000000000 --- a/packages/Webkul/Shop/src/Resources/views/customers/checkout/ship-method.blade.php +++ /dev/null @@ -1,52 +0,0 @@ - - -
-
- - Shipment Method - -
- -
-
- {{-- --}} - - $ 25.00 -
-
- Fadex - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut. -
-
- -
-
- - $ 25.00 -
-
- Fadex - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut. -
-
- -
-
- - $ 25.00 -
-
- Fadex - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut. -
-
- - -
-
- -
- -
-
- diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/signin.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/signin.blade.php deleted file mode 100644 index 6d550259e..000000000 --- a/packages/Webkul/Shop/src/Resources/views/customers/checkout/signin.blade.php +++ /dev/null @@ -1,40 +0,0 @@ - -@extends('shop::layouts.master') - -@section('content-wrapper') - -@include('shop::customers.checkout.common') - - - -@endsection \ No newline at end of file diff --git a/packages/Webkul/Shop/src/Resources/views/layouts/master.blade.php b/packages/Webkul/Shop/src/Resources/views/layouts/master.blade.php index 143fc99f6..129790e8b 100644 --- a/packages/Webkul/Shop/src/Resources/views/layouts/master.blade.php +++ b/packages/Webkul/Shop/src/Resources/views/layouts/master.blade.php @@ -21,6 +21,8 @@
+ +
@include('shop::layouts.header.index') diff --git a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php index 8d61b6af9..8ff545cc2 100644 --- a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php +++ b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php @@ -11,7 +11,7 @@ Home > Men > Slit Open Jeans
-
+ @csrf() diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php index bcd24f163..317e4c5ca 100644 --- a/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php +++ b/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php @@ -49,6 +49,8 @@ template: '#product-options-template', + inject: ['$validator'], + data: () => ({ config: @json($config), diff --git a/public/mix-manifest.json b/public/mix-manifest.json index e2b79fac9..585e57f48 100644 --- a/public/mix-manifest.json +++ b/public/mix-manifest.json @@ -1,3 +1,4 @@ { - "/js/app.js": "/js/app.js" + "/js/app.js": "/js/app.js", + "/css/app.css": "/css/app.css" } \ No newline at end of file diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css index af04610fa..84a0cc127 100644 --- a/public/themes/default/assets/css/shop.css +++ b/public/themes/default/assets/css/shop.css @@ -55,6 +55,18 @@ height: 24px; } +.shipping-icon { + background-image: url("../images/shipping.svg"); + width: 32px; + height: 32px; +} + +.payment-icon { + background-image: url("../images/payment.svg"); + width: 32px; + height: 32px; +} + body { margin: 0; padding: 0; @@ -135,7 +147,7 @@ body { .header .header-top div.left-content ul.search-container li.search-group .search-field { height: 38px; - border: 2px solid #c7c7c7; + border: 2px solid #E8E8E8; border-radius: 3px; border-right: none; border-top-right-radius: 0px; @@ -150,7 +162,7 @@ body { box-sizing: border-box; height: 38px; width: 38px; - border: 2px solid #c7c7c7; + border: 2px solid #E8E8E8; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } @@ -180,7 +192,7 @@ body { .header .header-top div.right-content ul.account-dropdown-container { float: right; - border-right: 2px solid #c7c7c7; + border-right: 2px solid #E8E8E8; } .header .header-top div.right-content ul.account-dropdown-container li.account-dropdown { @@ -289,7 +301,6 @@ body { margin-right: auto; border-top: 1px solid lightgrey; border-bottom: 1px solid lightgrey; - font-size: 16px; display: block; /* submenu positioning*/ } @@ -462,8 +473,8 @@ body { display: none; } .header .search-suggestion .search-content { - border-top: 1px solid #e8e8e8; - border-bottom: 1px solid #e8e8e8; + border-top: 1px solid #E8E8E8; + border-bottom: 1px solid #E8E8E8; height: 48px; } .header .search-suggestion .search-content .icon.search-icon { @@ -471,8 +482,6 @@ body { margin-top: 12px; } .header .search-suggestion .search-content span { - font-size: 16px; - color: #242424; margin-bottom: -7px; margin-left: 5px; } @@ -484,11 +493,9 @@ body { margin-top: 14px; height: 32px; margin-bottom: 14px; - border-bottom: 1px solid #e8e8e8; + border-bottom: 1px solid #E8E8E8; } .header .search-suggestion .suggestion span { - font-size: 16px; - color: #242424; margin-left: 48px; } .header .header-bottom { @@ -506,7 +513,7 @@ body { } .header .header-bottom .nav > li { float: none; - border-bottom: 1px solid #e8e8e8; + border-bottom: 1px solid #E8E8E8; } .header .header-bottom .nav > li a { margin-left: 10px; @@ -517,13 +524,12 @@ body { margin-right: 5px; } .header .header-bottom .nav > li:first-child { - border-top: 1px solid #e8e8e8; + border-top: 1px solid #E8E8E8; } .header .header-bottom .nav > li:last-child { float: none; } .header .header-bottom .nav > li:last-child span { - font-size: 16px; color: #FF6472; letter-spacing: -0.38px; } @@ -628,7 +634,7 @@ body { } .header .header-bottom .nav > li { float: none; - border-bottom: 1px solid #e8e8e8; + border-bottom: 1px solid #E8E8E8; } .header .header-bottom .nav > li a { margin-left: 10px; @@ -639,13 +645,12 @@ body { margin-right: 5px; } .header .header-bottom .nav > li:first-child { - border-top: 1px solid #e8e8e8; + border-top: 1px solid #E8E8E8; } .header .header-bottom .nav > li:last-child { float: none; } .header .header-bottom .nav > li:last-child span { - font-size: 16px; color: #FF6472; letter-spacing: -0.38px; } @@ -744,7 +749,7 @@ section.slider-block div.slider-content div.slider-control { } section.slider-block div.slider-content div.slider-control .dark-left-icon { - background-color: #ffffff; + background-color: #f2f2f2; height: 48px; width: 48px; max-height: 100%; @@ -752,7 +757,7 @@ section.slider-block div.slider-content div.slider-control .dark-left-icon { } section.slider-block div.slider-content div.slider-control .light-right-icon { - background-color: black; + background-color: #000; height: 48px; width: 48px; max-height: 100%; @@ -768,7 +773,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { .layered-filter-wrapper .filter-title { border-bottom: 1px solid #E8E8E8; - font-size: 16px; color: #242424; padding: 10px 0; } @@ -780,7 +784,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-title { padding: 10px 40px 0 10px; - font-size: 16px; color: #5E5E5E; cursor: pointer; position: relative; @@ -788,7 +791,7 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-title .remove-filter-link { font-weight: 400; - color: #0031F0; + color: #0031f0; margin-right: 10px; } @@ -814,7 +817,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { .layered-filter-wrapper .filter-attributes .filter-attributes-item .filter-attributes-content ol.items li.item { padding: 8px 0; - font-size: 16px; color: #5E5E5E; } @@ -893,7 +895,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { } .main-container-wrapper .product-card .product-name { - font-size: 16px; margin-bottom: 14px; width: 100%; color: #242424; @@ -904,7 +905,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { } .main-container-wrapper .product-card .product-description { - font-size: 16px; margin-bottom: 14px; display: none; } @@ -991,7 +991,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { } .main-container-wrapper .top-toolbar .pager label { - font-size: 16px; margin-right: 5px; } @@ -999,7 +998,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { background: #FFFFFF; border: 1px solid #C7C7C7; border-radius: 3px; - font-size: 16px; color: #242424; padding: 10px; } @@ -1182,7 +1180,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { background: #FFFFFF; border: 1px solid #C7C7C7; border-radius: 3px; - font-size: 16px; color: #242424; padding: 10px; } @@ -1257,7 +1254,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { background: #FFFFFF; border: 1px solid #C7C7C7; border-radius: 3px; - font-size: 16px; color: #242424; padding: 10px; } @@ -1267,7 +1263,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { } .product-price { - font-size: 16px; margin-bottom: 14px; width: 100%; font-weight: 600; @@ -1279,14 +1274,12 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { } .product-price .regular-price { - font-size: 16px; color: #A5A5A5; text-decoration: line-through; margin-right: 10px; } .product-price .special-price { - font-size: 16px; color: #FF6472; } @@ -1308,7 +1301,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { } .footer .footer-content .footer-list-container .list-container .list-heading { - font-size: 16px; letter-spacing: -0.26px; text-transform: uppercase; color: #a5a5a5; @@ -1320,7 +1312,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { .footer .footer-content .footer-list-container .list-container .list-group li { margin-bottom: 12px; - color: #242424; list-style-type: none; text-transform: uppercase; } @@ -1359,7 +1350,7 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { } .footer .footer-content .footer-list-container .list-container .form-container .control-group .btn-primary { - background-color: black; + background-color: #000; margin-top: 8px; border-radius: 0px; text-align: center; @@ -1387,8 +1378,8 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { display: -webkit-box; display: -ms-flexbox; display: flex; - background: #ffffff; - border: 1px solid #c7c7c7; + background: #f2f2f2; + border: 1px solid #E8E8E8; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; @@ -1463,17 +1454,15 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; - border: 1px solid #e8e8e8; - background: #ffffff; + border: 1px solid #E8E8E8; + background: #f2f2f2; width: 25%; height: 100%; text-transform: capitalize; - font-size: 16px; color: #5e5e5e; } .account-content .account-side-menu li { - font-size: 16px; width: 95%; height: 50px; margin-left: 5%; @@ -1490,7 +1479,7 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { -webkit-box-align: center; -ms-flex-align: center; align-items: center; - border-bottom: 1px solid #c7c7c7; + border-bottom: 1px solid #E8E8E8; text-align: center; } @@ -1532,11 +1521,10 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: #E8E8E8; } .account-content .profile-content { - font-size: 16px; color: #5e5e5e; margin-top: 1.4%; } @@ -1567,8 +1555,8 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { display: -webkit-box; display: -ms-flexbox; display: flex; - background: #ffffff; - border: 1px solid #c7c7c7; + background: #f2f2f2; + border: 1px solid #E8E8E8; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; @@ -1578,7 +1566,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon { } section.product-detail { - font-size: 16px; color: #242424; } @@ -1794,7 +1781,6 @@ section.product-detail div.layouter form .details .full-specifications td:first- } section.product-detail div.layouter form .details .accordian .accordian-header { - font-size: 16px; padding-left: 0; font-weight: 600; } @@ -1809,10 +1795,6 @@ section.product-detail div.layouter form .details .attributes { border-bottom: solid 1px rgba(162, 162, 162, 0.2); } -section.product-detail div.layouter form .details .full-description { - font-size: 16px; -} - @media all and (max-width: 480px) { section.product-detail div.category-breadcrumbs { display: none; @@ -1855,7 +1837,7 @@ section.product-detail div.layouter form .details .full-description { section.product-detail div.layouter form .details { width: 100%; margin-top: 20px; - border-bottom: 1px solid #e8e8e8e8; + border-bottom: 1px solid #E8E8E8; } section.product-detail div.layouter form .details .attributes { border-bottom: none; @@ -1904,7 +1886,7 @@ section.product-detail div.layouter form .details .full-description { section.product-detail div.layouter form .details { width: 100%; margin-top: 20px; - border-bottom: 1px solid #e8e8e8e8; + border-bottom: 1px solid #E8E8E8; } section.product-detail div.layouter form .details .attributes { border-bottom: none; @@ -1980,7 +1962,6 @@ section.product-detail div.layouter form .details .full-description { /* cart pages and elements css begins here */ section.cart { color: #242424; - font-size: 16px; margin-bottom: 80px; } @@ -2000,12 +1981,115 @@ section.cart .cart-content { flex-direction: row; } -section.cart .cart-content .left-side { +.cart .left-side { width: 68.6%; margin-right: 2.4%; } -section.cart .cart-content .left-side .item { +.cart .right-side { + width: 29%; + display: block; +} + +.cart .right-side .price-section { + width: 100%; + padding: 10px 10px 18px 18px; + margin-bottom: 20px; +} + +.cart .right-side .price-section .title { + font-weight: bold; + padding-bottom: 8px; + margin-bottom: 10px; +} + +.cart .right-side .price-section .all-item-details { + margin-bottom: 17px; +} + +.cart .right-side .price-section .all-item-details .item-details { + margin-bottom: 10px; +} + +.cart .right-side .price-section .all-item-details .item-details .price { + float: right; +} + +.cart .right-side .price-section .horizontal-rule { + width: 100%; + height: 1px; + vertical-align: middle; + background: #E8E8E8; +} + +.cart .right-side .price-section .total-details { + margin-top: 10px; +} + +.cart .right-side .price-section .total-details .amount { + float: right; +} + +.cart .right-side .coupon-section { + padding: 10px 10px 18px 18px; +} + +.cart .right-side .coupon-section .title { + font-weight: bold; + margin-bottom: 10px; +} + +.cart .right-side .coupon-section .control-group { + margin-bottom: 12px !important; +} + +.cart .right-side .coupon-section .control-group input.coupon-input::-moz-placeholder { + font-family: "montserrat", sans-serif; + color: #242424; +} + +.cart .right-side .coupon-section .control-group input.coupon-input::-webkit-input-placeholder { + font-family: "montserrat", sans-serif; + color: #242424; +} + +.cart .right-side .coupon-section button { + margin-bottom: 10px; + background-color: #000; + border-radius: 0px; +} + +.cart .right-side .coupon-section .coupon-details .coupon { + margin-bottom: 8px; +} + +.cart .right-side .coupon-section .coupon-details .coupon .discount { + float: right; +} + +.cart .right-side .coupon-section .horizontal-rule { + width: 100%; + height: 1px; + vertical-align: middle; + background: #E8E8E8; + margin-bottom: 9px; +} + +.cart .right-side .coupon-section .after-coupon-amount .name { + font-weight: bold; +} + +.cart .right-side .coupon-section .after-coupon-amount .amount { + float: right; + font-weight: bold; +} + +.cart-item-list { + margin-top: 21px; + padding: 1px; +} + +.cart-item-list .item { padding: 1.1%; margin-bottom: 20px; display: -webkit-box; @@ -2017,12 +2101,12 @@ section.cart .cart-content .left-side .item { flex-direction: row; } -section.cart .cart-content .left-side .item .item-image { +.cart-item-list .item .item-image { height: 160px; width: 160px; } -section.cart .cart-content .left-side .item .item-details { +.cart-item-list .item .item-details { display: -webkit-box; display: -ms-flexbox; display: flex; @@ -2032,35 +2116,35 @@ section.cart .cart-content .left-side .item .item-details { flex-direction: column; } -section.cart .cart-content .left-side .item .item-details .item-title { +.cart-item-list .item .item-details .item-title { font-size: 18px; margin-bottom: 10px; } -section.cart .cart-content .left-side .item .item-details .price { +.cart-item-list .item .item-details .price { margin-bottom: 10px; } -section.cart .cart-content .left-side .item .item-details .price .main-price { +.cart-item-list .item .item-details .price .main-price { font-size: 18px; margin-right: 4px; } -section.cart .cart-content .left-side .item .item-details .price .real-price { +.cart-item-list .item .item-details .price .real-price { margin-right: 4px; -webkit-text-decoration-line: line-through; text-decoration-line: line-through; } -section.cart .cart-content .left-side .item .item-details .price .discount { +.cart-item-list .item .item-details .price .discount { color: #FF6472; } -section.cart .cart-content .left-side .item .item-details .summary { +.cart-item-list .item .item-details .summary { margin-bottom: 17px; } -section.cart .cart-content .left-side .item .item-details .misc { +.cart-item-list .item .item-details .misc { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; @@ -2072,144 +2156,42 @@ section.cart .cart-content .left-side .item .item-details .misc { justify-content: flex-start; } -section.cart .cart-content .left-side .item .item-details .misc div.qty-text { +.cart-item-list .item .item-details .misc div.qty-text { color: #5E5E5E; margin-right: 10px; } -section.cart .cart-content .left-side .item .item-details .misc div.box { +.cart-item-list .item .item-details .misc div.box { height: 38px; width: 60px; text-align: center; line-height: 38px; - border: 1px solid #c7c7c7; + border: 1px solid #E8E8E8; border-radius: 3px; margin-right: 30px; } -section.cart .cart-content .left-side .item .item-details .misc .remove { - color: #0031F0; +.cart-item-list .item .item-details .misc .remove { + color: #0031f0; margin-right: 30px; } -section.cart .cart-content .left-side .item .item-details .misc .towishlist { - color: #0031F0; +.cart-item-list .item .item-details .misc .towishlist { + color: #0031f0; } -section.cart .cart-content .left-side .misc-controls { +.cart-item-list .misc-controls { float: right; } -section.cart .cart-content .left-side .misc-controls span { +.cart-item-list .misc-controls span { margin-right: 15px; } -section.cart .cart-content .left-side .misc-controls button { +.cart-item-list .misc-controls button { border-radius: 0px; } -section.cart .cart-content .right-side { - width: 29%; - display: block; -} - -section.cart .cart-content .right-side .price-section { - width: 100%; - padding: 10px 10px 18px 18px; - margin-bottom: 20px; -} - -section.cart .cart-content .right-side .price-section .title { - font-size: 16px; - font-weight: bold; - padding-bottom: 8px; - margin-bottom: 10px; -} - -section.cart .cart-content .right-side .price-section .all-item-details { - margin-bottom: 17px; -} - -section.cart .cart-content .right-side .price-section .all-item-details .item-details { - margin-bottom: 10px; -} - -section.cart .cart-content .right-side .price-section .all-item-details .item-details .price { - float: right; -} - -section.cart .cart-content .right-side .price-section .horizontal-rule { - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; -} - -section.cart .cart-content .right-side .price-section .total-details { - margin-top: 10px; -} - -section.cart .cart-content .right-side .price-section .total-details .amount { - float: right; -} - -section.cart .cart-content .right-side .coupon-section { - padding: 10px 10px 18px 18px; -} - -section.cart .cart-content .right-side .coupon-section .title { - font-size: 16px; - font-weight: bold; - margin-bottom: 10px; -} - -section.cart .cart-content .right-side .coupon-section .control-group { - margin-bottom: 12px !important; -} - -section.cart .cart-content .right-side .coupon-section .control-group input.coupon-input::-moz-placeholder { - font-family: "montserrat", sans-serif; - font-size: 16px; - color: #242424; -} - -section.cart .cart-content .right-side .coupon-section .control-group input.coupon-input::-webkit-input-placeholder { - font-family: "montserrat", sans-serif; - font-size: 16px; - color: #242424; -} - -section.cart .cart-content .right-side .coupon-section button { - margin-bottom: 10px; - background-color: black; - border-radius: 0px; -} - -section.cart .cart-content .right-side .coupon-section .coupon-details .coupon { - margin-bottom: 8px; -} - -section.cart .cart-content .right-side .coupon-section .coupon-details .coupon .discount { - float: right; -} - -section.cart .cart-content .right-side .coupon-section .horizontal-rule { - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; - margin-bottom: 9px; -} - -section.cart .cart-content .right-side .coupon-section .after-coupon-amount .name { - font-weight: bold; -} - -section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amount { - float: right; - font-weight: bold; -} - .attached-products-wrapper { margin-bottom: 80px; } @@ -2273,7 +2255,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo .order .order-section-head .order-number { font-size: 28px; - color: #242424; text-transform: capitalize; text-align: left; } @@ -2301,7 +2282,7 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: #E8E8E8; } .order .order-section-head-small { @@ -2309,7 +2290,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo } .order .payment-place { - font-size: 16px; color: #5e5e5e; margin-top: 1.4%; } @@ -2331,7 +2311,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo .order .payment-place .placed-on .place-text span { color: #5E5E5E; letter-spacing: -0.12px; - font-size: 16px; } .order .payment-place .placed-on .place-text .processing { @@ -2341,7 +2320,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo .order .payment-place .placed-on .place-date span { color: #5E5E5E; letter-spacing: -0.12px; - font-size: 16px; } .order .payment-place .payment-status { @@ -2362,13 +2340,11 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo .order .payment-place .payment-status .payment-text span { color: #5E5E5E; letter-spacing: -0.12px; - font-size: 16px; } .order .payment-place .payment-status .status span { color: #5E5E5E; letter-spacing: -0.12px; - font-size: 16px; } .order .payment-place .horizontal-rule { @@ -2376,7 +2352,7 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: #E8E8E8; } .order .order-details { @@ -2510,7 +2486,7 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: #E8E8E8; } .order .order-information { @@ -2537,7 +2513,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo } .order .order-information p { - font-size: 16px; color: #3A3A3A; } @@ -2564,8 +2539,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo } .order .order-section-head-small .order-number { text-align: center; - font-size: 16px; - color: #242424; letter-spacing: -0.38px; text-align: center; margin-top: 13px; @@ -2575,19 +2548,18 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo float: right; text-align: right; font-size: 17px; - color: #0031F0; + color: #0031f0; letter-spacing: -0.11px; margin-top: 13px; margin-bottom: 13px; } .order .order-section-head-small .horizon-rule { - border: .5px solid #E8E8E8; + border: 0.5px solid #E8E8E8; width: 150%; margin-left: -10%; margin-right: -10%; } .order .payment-place { - font-size: 16px; color: #5e5e5e; margin-top: 4%; } @@ -2644,7 +2616,7 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: #E8E8E8; } .order .order-details { display: none; @@ -2745,7 +2717,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo width: 50%; } .order .product-config .product-attribute .property-name span { - font-size: 16px; color: #5E5E5E; letter-spacing: -0.11px; } @@ -2792,8 +2763,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo } .order .order-section-head-small .order-number { text-align: center; - font-size: 16px; - color: #242424; letter-spacing: -0.38px; text-align: center; margin-top: 13px; @@ -2803,19 +2772,18 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo float: right; text-align: right; font-size: 17px; - color: #0031F0; + color: #0031f0; letter-spacing: -0.11px; margin-top: 13px; margin-bottom: 13px; } .order .order-section-head-small .horizon-rule { - border: .5px solid #E8E8E8; + border: 0.5px solid #E8E8E8; width: 150%; margin-left: -10%; margin-right: -10%; } .order .payment-place { - font-size: 16px; color: #5e5e5e; margin-top: 4%; } @@ -2872,7 +2840,7 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo width: 100%; height: 1px; vertical-align: middle; - background: #e8e8e8; + background: #E8E8E8; } .order .order-details { display: none; @@ -2973,7 +2941,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo width: 50%; } .order .product-config .product-attribute .property-name span { - font-size: 16px; color: #5E5E5E; letter-spacing: -0.11px; } @@ -3068,15 +3035,14 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo cursor: pointer; } -.checkout-process .col-main ul.checkout-steps li.completed img { - margin: auto; +.checkout-process .col-main ul.checkout-steps li.completed .decorator { + background-image: url("../images/complete.svg"); } .checkout-process .col-main ul.checkout-steps li span { margin-left: 7px; margin-top: auto; margin-bottom: auto; - font-size: 16px; } .checkout-process .col-main ul.checkout-steps li.active { @@ -3122,718 +3088,118 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo margin-left: 28px; } +.checkout-process .col-main .step-content .address { + display: inline-block; + width: 100%; +} + +.checkout-process .col-main .step-content .address .address-card { + width: 50%; + float: left; +} + +.checkout-process .col-main .step-content .address .address-card .card-title span { + font-weight: 600; +} + +.checkout-process .col-main .step-content .address .address-card .card-content { + margin-top: 15px; + color: #121212; + line-height: 25px; +} + +.checkout-process .col-main .step-content .address .address-card .card-content .horizontal-rule { + margin: 12px 0; + display: block; + width: 25px; + background: #121212; +} + +.checkout-process .col-main .step-content .cart-item-list .item { + border: 1px solid #E8E8E8; + border-radius: 3px; + padding: 20px; +} + +.checkout-process .col-main .step-content .cart-item-list .item .row .title { + width: 100px; + display: inline-block; + color: #5E5E5E; + font-weight: 500; + margin-bottom: 10px; +} + +.checkout-process .col-main .step-content .cart-item-list .item .row .value { + font-size: 18px; + font-weight: 600; +} + +.checkout-process .col-main .step-content .order-description { + display: inline-block; + width: 100%; +} + +.checkout-process .col-main .step-content .order-description .shipping { + margin-bottom: 25px; +} + +.checkout-process .col-main .step-content .order-description .decorator { + height: 48px; + width: 48px; + border-radius: 50%; + border: 1px solid #E8E8E8; + vertical-align: middle; + display: inline-block; + text-align: center; +} + +.checkout-process .col-main .step-content .order-description .decorator .icon { + margin-top: 7px; +} + +.checkout-process .col-main .step-content .order-description .text { + font-weight: 600; + vertical-align: middle; + display: inline-block; +} + +.checkout-process .col-main .step-content .order-description .text .info { + font-weight: 500; + margin-top: 2px; +} + .checkout-process .col-right { width: 35%; padding-left: 40px; } -.checkout-process .col-right .order-summary .price span { - margin-left: 3px; +.checkout-process .order-summary h3 { font-size: 16px; - color: #242424; - font-weight: bold; } -.checkout-process .col-right .order-summary .item-detail { +.checkout-process .order-summary .item-detail { margin-top: 12px; } -.checkout-process .col-right .order-summary .item-detail span { - margin-left: 3px; -} - -.checkout-process .col-right .order-summary .item-detail span label { - font-size: 16px; - color: #242424; -} - -.checkout-process .col-right .order-summary .item-detail span .right { - float: right; - font-size: 16px; - color: #242424; -} - -.checkout-process .col-right .order-summary .horizontal-rule { - margin-top: 6%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; -} - -.checkout-process .col-right .order-summary .payble-amount { - margin-top: 12px; -} - -.checkout-process .col-right .order-summary .payble-amount span { - margin-left: 3px; - font-weight: bold; -} - -.checkout-process .col-right .order-summary .payble-amount span label { - font-size: 16px; - color: #242424; - font-weight: bold; -} - -.checkout-process .col-right .order-summary .payble-amount span .right { - float: right; - font-size: 16px; - color: #242424; -} - -@media all and (max-width: 480px) { - .checkout-process { - width: 100%; - margin-top: 3%; - } - .checkout-process .left-side { - width: 100%; - margin-right: 0%; - height: 60px; - } - .checkout-process .left-side .checkout-menu { - width: 100%; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail { - height: 60px; - width: 100%; - padding: 5px; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail li { - height: 48px; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail li .wrapper { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail li .wrapper span { - display: none; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail .line { - margin-top: 23px; - width: 100%; - margin-left: 5px; - margin-right: 5px; - border: 1px solid #E7E7E7; - height: 1px; - } - .checkout-process .left-side .checkout-menu .horizontal-rule { - display: none; - } - .checkout-process .right-side { - display: none; - } - .order-info { - width: 100%; - margin-right: 0%; - margin-top: 10px; - height: 50px; - } - .order-info .control-group .control { - width: 100%; - } - .order-info .different-billing-addr { - margin-top: 5%; - } - .order-info .horizontal-rule { - margin-top: 10%; - } - .order-info .countinue-button { - margin-top: 8%; - } -} - -@media all and (min-width: 481px) and (max-width: 920px) { - .checkout-process { - width: 100%; - margin-top: 3%; - } - .checkout-process .left-side { - width: 100%; - margin-right: 0%; - height: 60px; - } - .checkout-process .left-side .checkout-menu { - width: 100%; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail { - height: 60px; - width: 100%; - padding: 5px; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail li { - height: 48px; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail li .wrapper { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail li .wrapper span { - display: none; - } - .checkout-process .left-side .checkout-menu ul.checkout-detail .line { - margin-top: 23px; - width: 100%; - margin-left: 10px; - margin-right: 10px; - border: 1px solid #E7E7E7; - height: 1px; - } - .checkout-process .left-side .checkout-menu .horizontal-rule { - display: none; - } - .checkout-process .right-side { - display: none; - } - .order-info { - width: 100%; - margin-right: 0%; - margin-top: 10px; - height: 50px; - } - .order-info .control-group .control { - width: 100%; - } - .order-info .different-billing-addr { - margin-top: 3%; - } - .order-info .horizontal-rule { - margin-top: 10%; - } - .order-info .countinue-button { - margin-top: 5%; - } -} - -.ship-method { - width: 67%; - margin-right: 6%; - height: 600px; - margin-top: -190px; -} - -.ship-method .ship-info .ship-text { - font-size: 24px; - color: #242424; - letter-spacing: -0.58px; - font-weight: bold; -} - -.ship-method .ship-price { - margin-top: 31px; -} - -.ship-method .ship-price .price-checkbox { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -.ship-method .ship-price .price-checkbox span { - margin-left: 8px; - font-size: 16px; - color: #242424; - line-height: 22px; - font-weight: bold; -} - -.ship-method .ship-price .price-checkbox-text { - margin-left: 25px; - width: 580px; - height: 44px; - margin-top: 4px; -} - -.ship-method .ship-price .price-checkbox-text b { - font-size: 16px; -} - -.ship-method .ship-price .price-checkbox-text span { - font-size: 16px; - color: #242424; - line-height: 22px; -} - -.ship-method .horizontal-rule { - margin-top: 7%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; -} - -.ship-method .countinue-button { - margin-top: 3%; -} - -.ship-method .countinue-button button { - background: #0031F0; - font-size: 14px; - color: #FFFFFF; - letter-spacing: -0.26px; - text-align: center; - height: 38px; - width: 137px; - border: none; -} - -.payment-method { - width: 67%; - margin-right: 6%; - height: 600px; - margin-top: -190px; -} - -.payment-method .payment-info .payment-text { - font-size: 24px; - color: #242424; - letter-spacing: -0.58px; - font-weight: bold; -} - -.payment-method .payment-price { - margin-top: 31px; -} - -.payment-method .payment-price .payment-checkbox { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -.payment-method .payment-price .payment-checkbox span { - margin-left: 8px; - font-size: 16px; - color: #242424; - line-height: 22px; - font-weight: bold; -} - -.payment-method .payment-price .payment-checkbox-text { - margin-left: 25px; - width: 580px; - height: 44px; - margin-top: 4px; -} - -.payment-method .payment-price .payment-checkbox-text b { - font-size: 16px; -} - -.payment-method .payment-price .payment-checkbox-text span { - font-size: 16px; - color: #242424; - line-height: 22px; -} - -.payment-method .horizontal-rule { - margin-top: 7%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; -} - -.payment-method .countinue-button { - margin-top: 3%; -} - -.payment-method .countinue-button button { - background: #0031F0; - font-size: 14px; - color: #FFFFFF; - letter-spacing: -0.26px; - text-align: center; - height: 38px; - width: 137px; - border: none; -} - -.payment-method .countinue-button button .horizontal-rule { - margin-top: 7%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; -} - -.payment-method .countinue-button button .horizontal-rule { - margin-top: 7%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; -} - -.complete-page { - width: 880px; - height: 1050px; -} - -.complete-page .order-summary span { - font-size: 24px; - color: #242424; - font-weight: bold; - letter-spacing: -0.58px; -} - -.complete-page .address { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - margin-top: 30px; -} - -.complete-page .address .shipping-address { - height: 100px; - width: 415px; -} - -.complete-page .address .shipping-address .shipping-title span { - font-weight: bold; - font-size: 16px; - color: #242424; -} - -.complete-page .address .shipping-address .shipping-content { - margin-top: 15px; - width: 175px; -} - -.complete-page .address .shipping-address .shipping-content .addr { - margin-top: 5px; -} - -.complete-page .address .shipping-address .shipping-content .addr span { - font-size: 16px; - color: #121212; -} - -.complete-page .address .shipping-address .shipping-content .horizontal-rule { - margin-top: 7%; - width: 25px; - height: 1px; - vertical-align: middle; - background: #121212; -} - -.complete-page .address .shipping-address .shipping-content .contact { - margin-top: 10px; -} - -.complete-page .address .shipping-address .shipping-content .contact span { - font-size: 16px; - color: #121212; -} - -.complete-page .address .billing-address { - width: 415px; -} - -.complete-page .address .billing-address .shipping-title span { - font-weight: bold; - font-size: 16px; - color: #242424; -} - -.complete-page .address .billing-address .shipping-content { - margin-top: 15px; - width: 175px; -} - -.complete-page .address .billing-address .shipping-content .addr { - margin-top: 5px; -} - -.complete-page .address .billing-address .shipping-content .addr span { - font-size: 16px; - color: #121212; -} - -.complete-page .address .billing-address .shipping-content .horizontal-rule { - margin-top: 7%; - width: 25px; - height: 1px; - vertical-align: middle; - background: #121212; -} - -.complete-page .address .billing-address .shipping-content .contact { - margin-top: 10px; -} - -.complete-page .address .billing-address .shipping-content .contact span { - font-size: 16px; - color: #121212; -} - -.complete-page .product-detail { - height: 200px; - border: 1px solid #E8E8E8; - border-radius: 3px; - margin-top: 30px; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - margin-top: 30px; -} - -.complete-page .product-detail .product-image { - margin: 20px 0px 20px 20px; -} - -.complete-page .product-detail .product-image img { - height: 160px; - width: 160px; -} - -.complete-page .product-detail .product-desc { - margin-top: 20px; - margin-left: 10px; -} - -.complete-page .product-detail .product-desc .product-title span { - font-size: 18px; - color: #242424; - letter-spacing: -0.43px; - font-weight: bold; -} - -.complete-page .product-detail .product-desc .price { - margin-top: 11px; -} - -.complete-page .product-detail .product-desc .price span label { - font-size: 16px; - color: #5E5E5E; -} - -.complete-page .product-detail .product-desc .price span label.bold { - margin-left: 45px; - font-weight: bold; - font-size: 18px; - color: #242424; -} - -.complete-page .product-detail .product-desc .quantity { - margin-top: 11px; -} - -.complete-page .product-detail .product-desc .quantity span label { - font-size: 16px; - color: #5E5E5E; -} - -.complete-page .product-detail .product-desc .quantity span label.quat-bold { - margin-left: 15px; - font-weight: bold; - font-size: 18px; - color: #242424; -} - -.complete-page .product-detail .product-desc .pro-attribute { - width: 413px; - margin-top: 14px; -} - -.complete-page .product-detail .product-desc .pro-attribute span { - font-size: 16px; - color: #242424; -} - -.complete-page .order-description { - height: 140px; - border-radius: 3px; - margin-top: 30px; - 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-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; -} - -.complete-page .order-description .payment .shipping { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; -} - -.complete-page .order-description .payment .shipping .pay-icon { - height: 48px; - width: 48px; - border-radius: 50%; - border: 1px solid #E8E8E8; -} - -.complete-page .order-description .payment .shipping .pay-icon img { - margin-left: 8px; - margin-top: 8px; -} - -.complete-page .order-description .payment .shipping .pay-icon span { - margin-left: 10px; - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; -} - -.complete-page .order-description .payment .shipping .shipping-text { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; -} - -.complete-page .order-description .payment .shipping .shipping-text .price { - margin-top: 5px; - margin-left: 5px; -} - -.complete-page .order-description .payment .shipping .shipping-text .price span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; -} - -.complete-page .order-description .payment .shipping .shipping-text .fedex-shipping { - margin-left: 5px; -} - -.complete-page .order-description .payment .shipping .shipping-text .fedex-shipping span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; -} - -.complete-page .order-description .payment .net-banking { - margin-top: 23px; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; -} - -.complete-page .order-description .payment .net-banking .pay-icon { - height: 48px; - width: 48px; - border-radius: 50%; - border: 1px solid #E8E8E8; -} - -.complete-page .order-description .payment .net-banking .pay-icon img { - margin-left: 8px; - margin-top: 8px; -} - -.complete-page .order-description .payment .net-banking span { - margin-left: 5px; - margin-top: 15px; - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; -} - -.complete-page .order-description .product-bill { - height: 200px; - width: 300px; -} - -.complete-page .order-description .product-bill .sub-total span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; -} - -.complete-page .order-description .product-bill .sub-total .right { +.checkout-process .order-summary .item-detail label.right { float: right; } -.complete-page .order-description .product-bill .charge-discount { - margin-top: 10px; +.checkout-process .order-summary .payble-amount { + margin-top: 17px; + border-top: 1px solid #E8E8E8; + padding-top: 12px; } -.complete-page .order-description .product-bill .charge-discount span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; +.checkout-process .order-summary .payble-amount label { + font-weight: bold; } -.complete-page .order-description .product-bill .charge-discount .right { +.checkout-process .order-summary .payble-amount label.right { float: right; } -.complete-page .order-description .product-bill .horizontal-rule { - margin-top: 5%; - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; -} - -.complete-page .order-description .product-bill .amount-pay { - margin-top: 15px; -} - -.complete-page .order-description .product-bill .amount-pay span { - font-size: 16px; - color: #242424; - letter-spacing: -0.38px; -} - -.complete-page .order-description .product-bill .amount-pay .right { - float: right; -} - -.complete-page .horizontal-rule { - width: 100%; - height: 1px; - vertical-align: middle; - background: #e8e8e8; -} - -.complete-page .palce-order-button { - margin-top: 30px; -} - -.complete-page .palce-order-button button { - width: 137px; - height: 38px; - background: #0031F0; - font-size: 14px; - color: #FFFFFF; - letter-spacing: -0.26px; - text-align: center; - border: none; -} - section.review { - font-size: 16px; color: #242424; } @@ -3867,7 +3233,6 @@ section.review .review-layouter .product-info .heading { section.review .review-layouter .product-info .heading span { font-size: 24px; - color: #242424; letter-spacing: -0.58px; } @@ -3883,15 +3248,12 @@ section.review .review-layouter .product-info .price .pro-price { section.review .review-layouter .product-info .price .pro-price-not { margin-left: 10px; - font-size: 16px; color: #A5A5A5; letter-spacing: -0.26px; } section.review .review-layouter .product-info .price .offer { margin-left: 10px; - font-size: 16px; - color: #242424; letter-spacing: -0.26px; } @@ -3905,8 +3267,6 @@ section.review .review-layouter .review-info .heading { } section.review .review-layouter .review-info .heading span { - font-size: 16px; - color: #242424; letter-spacing: -0.26px; } @@ -3917,7 +3277,6 @@ section.review .review-layouter .review-info .heading .btn.btn-primary.right { section.review .review-layouter .review-info .rating { margin-top: 25px; - font-size: 16px; color: #5E5E5E; letter-spacing: -0.12px; } @@ -3963,7 +3322,7 @@ section.review .review-layouter .review-info .submit-button { } section.review .review-layouter .review-info .submit-button button { - background: #0031F0; + background: #0031f0; font-size: 14px; color: #FFFFFF; letter-spacing: -0.26px; @@ -3994,7 +3353,6 @@ section.review .review-layouter .review-info .review-detail .rating-review { section.review .review-layouter .review-info .review-detail .rating-review .avg-rating-count span { font-size: 34px; - color: #242424; letter-spacing: -0.82px; text-align: center; } @@ -4036,8 +3394,7 @@ section.review .review-layouter .review-info .review-detail .rating-calculate .p } .cusomer-section .customer-section-info .pro-discription .title { - font-size: 16px; - color: #0031F0; + color: #0031f0; margin-top: 15px; } @@ -4055,5 +3412,5 @@ section.review .review-layouter .review-info .review-detail .rating-calculate .p } .cusomer-section .customer-section-info:last-child { - border-bottom: 1px solid #e8e8e8; + border-bottom: 1px solid #E8E8E8; } diff --git a/public/themes/default/assets/js/shop.js b/public/themes/default/assets/js/shop.js index dbc0ab9c7..7d4777e2e 100644 --- a/public/themes/default/assets/js/shop.js +++ b/public/themes/default/assets/js/shop.js @@ -1460,10 +1460,10 @@ $(document).ready(function () { var flashes = this.$refs.flashes; flashMessages.forEach(function (flash) { - console.log(flash); flashes.addFlash(flash); }, this); }, + responsiveHeader: function responsiveHeader() {} } });