Chore: Miscellaneous UI review changes

- Added bg (variable) to pages, card space separation visible
- Removed `show brand line` in settings, shown by default
- Re-arranged settings by importance
- View toggling primary colour is grey
- Only populate recent searches on successful search
- Hit only one server side api, once while searching
- List view primary button float right
- Discounts takes upper limit eg. 10% and below
- Navbar icons only wiggle on qty increase in cart/wishlist
- Pay button in SO portal
- Remove bottom white space below item full page image, min-height fits to content
- List view vertical space between heading and item code
- Empty offer subtitle handled

erpnext/templates/generators/item/item_add_to_cart.html

@@ -71,7 +71,7 @@
 					</div>
 					<p class="mr-1 mb-1">
 						{{ _(offer.offer_title) }}:
-						{{ _(offer.offer_subtitle) }}
+						{{ _(offer.offer_subtitle) if offer.offer_subtitle else '' }}
 						<a class="offer-details" href="#"
 							data-offer-title="{{ offer.offer_title }}" data-offer-id="{{ offer.name }}"
 							role="button">
@@ -117,7 +117,7 @@
 			const $btn = $(e.currentTarget);
 			$btn.prop('disabled', true);
 			const item_code = $btn.data('item-code');
-			e_commerce.shopping_cart.update_cart({
+			erpnext.e_commerce.shopping_cart.update_cart({
 				item_code,
 				qty: 1,
 				callback(r) {

erpnext/templates/generators/item/item_details.html

@@ -58,6 +58,6 @@
 	$('.page_content').on('click', '.like-action-item-fp', (e) => {
 			// Bind action on wishlist button
 			const $btn = $(e.currentTarget);
-			e_commerce.wishlist.wishlist_action($btn);
+			erpnext.e_commerce.wishlist.wishlist_action($btn);
 		});
 </script>

erpnext/templates/generators/item/item_image.html

@@ -1,30 +1,30 @@
 {% set column_size = 5 if slides else 4 %}
 <div class="col-md-{{ column_size }} h-100 d-flex mb-4">
 	{% if slides %}
-	<div class="item-slideshow d-flex flex-column mr-3">
-		{% for item in slides %}
-		<img class="item-slideshow-image mb-2 {% if loop.first %}active{% endif %}"
-				src="{{ item.image }}" alt="{{ item.heading }}">
-		{% endfor %}
-	</div>
-	{{ product_image(slides[0].image, 'product-image') }}
-	<!-- Simple image slideshow -->
-	<script>
-		frappe.ready(() => {
-			$('.page_content').on('click', '.item-slideshow-image', (e) => {
-				const $img = $(e.currentTarget);
-				const link = $img.prop('src');
-				const $product_image = $('.product-image');
-				$product_image.find('a').prop('href', link);
-				$product_image.find('img').prop('src', link);
+		<div class="item-slideshow d-flex flex-column mr-3">
+			{% for item in slides %}
+			<img class="item-slideshow-image mb-2 {% if loop.first %}active{% endif %}"
+					src="{{ item.image }}" alt="{{ item.heading }}">
+			{% endfor %}
+		</div>
+		{{ product_image(slides[0].image, 'product-image') }}
+		<!-- Simple image slideshow -->
+		<script>
+			frappe.ready(() => {
+				$('.page_content').on('click', '.item-slideshow-image', (e) => {
+					const $img = $(e.currentTarget);
+					const link = $img.prop('src');
+					const $product_image = $('.product-image');
+					$product_image.find('a').prop('href', link);
+					$product_image.find('img').prop('src', link);
 
-				$('.item-slideshow-image').removeClass('active');
-				$img.addClass('active');
-			});
-		})
-	</script>
+					$('.item-slideshow-image').removeClass('active');
+					$img.addClass('active');
+				});
+			})
+		</script>
 	{% else %}
-	{{ product_image(doc.website_image or doc.image, alt=doc.website_image_alt or doc.item_name) }}
+		{{ product_image(doc.website_image or doc.image, alt=doc.website_image_alt or doc.item_name) }}
 	{% endif %}
 
 	<!-- Simple image preview -->

erpnext/templates/generators/item/item_specifications.html

@@ -1,9 +1,9 @@
 <!-- Is reused to render within tabs as well as independently -->
 {% if website_specifications %}
-<div class="mt-5 item-website-specification">
+<div class="{{ 'mt-2' if not show_tabs else 'mt-5'}} item-website-specification">
 	<div class="col-md-11">
 		{% if not show_tabs %}
-			<div class="product-title mb-5 mt-8">
+			<div class="product-title mb-5 mt-4">
 				Product Details
 			</div>
 		{% endif %}

erpnext/templates/includes/macros.html

@@ -363,9 +363,9 @@
 <div class="recommended-item mb-6 d-flex">
 	<div class="r-item-image">
 		{% if item.website_item_thumbnail %}
-			{{ product_image(item.website_item_thumbnail, alt="item.website_item_name", no_border=True) }}
+			{{ product_image(item.website_item_thumbnail, css_class="r-product-image", alt="item.website_item_name", no_border=True) }}
 		{% else %}
-			<div class = "no-image-r-item">
+			<div class="no-image-r-item">
 				{{ frappe.utils.get_abbr(item.website_item_name) or "NA" }}
 			</div>
 		{% endif %}

erpnext/templates/pages/cart.py

@@ -8,4 +8,5 @@ import frappe
 from erpnext.e_commerce.shopping_cart.cart import get_cart_quotation
 
 def get_context(context):
+	context.body_class = "product-page"
 	context.update(get_cart_quotation())

erpnext/templates/pages/customer_reviews.py

@@ -6,6 +6,7 @@ from erpnext.e_commerce.doctype.website_item.website_item import check_if_user_i
 from erpnext.e_commerce.doctype.e_commerce_settings.e_commerce_settings import get_shopping_cart_settings
 
 def get_context(context):
+	context.body_class = "product-page"
 	context.no_cache = 1
 	context.full_page = True
 	context.reviews = None
@@ -14,6 +15,7 @@ def get_context(context):
 		context.web_item = frappe.form_dict.get("web_item")
 		context.user_is_customer = check_if_user_is_customer()
 		context.enable_reviews = get_shopping_cart_settings().enable_reviews
+
 		if context.enable_reviews:
 			reviews_data = get_item_reviews(context.web_item)
 			context.update(reviews_data)

erpnext/templates/pages/order.html

@@ -139,9 +139,12 @@
 				<div class="form-column col-sm-6">
 					<div id="loyalty-points-status" style="text-align: right"></div>
 					<div class="page-header-actions-block" data-html-block="header-actions">
-						<p>
+						<p class="mt-2" style="float: right;">
 							<a href="/api/method/erpnext.accounts.doctype.payment_request.payment_request.make_payment_request?dn={{ doc.name }}&dt={{ doc.doctype }}&submit_doc=1&order_type=Shopping Cart"
-								class="btn btn-primary btn-sm" id="pay-for-order">{{ _("Pay") }} {{ doc.get_formatted("grand_total") }} </a>
+								class="btn btn-primary btn-sm"
+								id="pay-for-order">
+								{{ _("Pay") }} {{ doc.get_formatted("grand_total") }}
+							</a>
 						</p>
 					</div>
 				</div>

erpnext/templates/pages/product_search.py

@@ -58,7 +58,17 @@ def get_product_data(search=None, start=0, limit=12):
 	}, as_dict=1)
 
 @frappe.whitelist(allow_guest=True)
-def search(query, limit=10, fuzzy_search=True):
+def search(query):
+	product_results = product_search(query)
+	category_results = get_category_suggestions(query)
+
+	return {
+		"product_results": product_results.get("results") or [],
+		"category_results": category_results.get("results") or []
+	}
+
+@frappe.whitelist(allow_guest=True)
+def product_search(query, limit=10, fuzzy_search=True):
 	search_results = {"from_redisearch": True, "results": []}
 
 	if not is_search_module_loaded():

erpnext/templates/pages/wishlist.py

@@ -14,6 +14,7 @@ def get_context(context):
 
 	items = set_stock_price_details(items, settings, selling_price_list)
 
+	context.body_class = "product-page"
 	context.items = items
 	context.settings = settings
 	context.no_cache = 1