From aca3c8fce7f38f77f653967fae15e5af518e13bb Mon Sep 17 00:00:00 2001
From: marination <maricadsouza221197@gmail.com>
Date: Tue, 8 Jun 2021 19:40:26 +0530
Subject: [PATCH] fix: Font size, empty image styles, and minor cleanup

- some frappe css font variables weren't loading, remove dependency
- fixed fallback display for missing images in views
- py code cleanup (minor)
---
 erpnext/e_commerce/product_grid.js            | 12 +++--
 erpnext/e_commerce/product_list.js            | 13 +++--
 erpnext/e_commerce/product_search.js          |  6 ++-
 erpnext/patches/v13_0/create_website_items.py |  4 +-
 erpnext/public/scss/shopping_cart.scss        | 49 ++++++++++++++-----
 .../generators/item/item_add_to_cart.html     |  2 +-
 .../generators/item/item_inquiry.html         |  8 +--
 erpnext/templates/generators/item_group.html  |  5 +-
 .../templates/includes/cart/address_card.html |  2 +-
 .../templates/includes/cart/cart_address.html | 15 +++---
 erpnext/templates/includes/macros.html        | 39 +++++++--------
 erpnext/templates/pages/cart.html             | 10 ++--
 erpnext/templates/pages/product_search.py     |  2 +-
 erpnext/www/all-products/index.html           |  5 +-
 14 files changed, 104 insertions(+), 68 deletions(-)

diff --git a/erpnext/e_commerce/product_grid.js b/erpnext/e_commerce/product_grid.js
index bd7a568ac0..c0e5ffa845 100644
--- a/erpnext/e_commerce/product_grid.js
+++ b/erpnext/e_commerce/product_grid.js
@@ -47,11 +47,13 @@ erpnext.ProductGrid = class {
 			`;
 		} else {
 			return `
-				<a href="/${ item.route || '#' }" style="text-decoration: none;">
-					<div class="card-img-top no-image">
-						${ frappe.get_abbr(title) }
-					</div>
-				</a>
+				<div class="card-img-container">
+					<a href="/${ item.route || '#' }" style="text-decoration: none;">
+						<div class="card-img-top no-image">
+							${ frappe.get_abbr(title) }
+						</div>
+					</a>
+				</div>
 			`;
 		}
 	}
diff --git a/erpnext/e_commerce/product_list.js b/erpnext/e_commerce/product_list.js
index d5ba6f5b29..6c7d7ff7dc 100644
--- a/erpnext/e_commerce/product_list.js
+++ b/erpnext/e_commerce/product_list.js
@@ -48,11 +48,14 @@ erpnext.ProductList = class {
 			`;
 		} else {
 			return `
-				<a href="/${ item.route || '#' }" style="text-decoration: none;">
-					<div class="card-img-top no-image">
-						${ frappe.get_abbr(title) }
-					</div>
-				</a>
+				<div class="col-2 border text-center rounded list-image">
+					<a class="product-link product-list-link" href="/${ item.route || '#' }"
+						style="text-decoration: none">
+						<div class="card-img-top no-image-list">
+							${ frappe.get_abbr(title) }
+						</div>
+					</a>
+				</div>
 			`;
 		}
 	}
diff --git a/erpnext/e_commerce/product_search.js b/erpnext/e_commerce/product_search.js
index 037878b63c..e537688199 100644
--- a/erpnext/e_commerce/product_search.js
+++ b/erpnext/e_commerce/product_search.js
@@ -179,7 +179,11 @@ erpnext.ProductSearch = class {
 
 		let html = "";
 		recents.forEach((key) => {
-			html += `<button class="btn btn-sm recent-chip mr-1 mb-2">${ key }</button>`;
+			html += `
+				<button class="btn btn-sm recent-chip mr-1 mb-2" style="font-size: 13px">
+					${ key }
+				</button>
+			`;
 		});
 
 		this.recents_container.html(html);
diff --git a/erpnext/patches/v13_0/create_website_items.py b/erpnext/patches/v13_0/create_website_items.py
index 78e9dda42a..a8bdc5c263 100644
--- a/erpnext/patches/v13_0/create_website_items.py
+++ b/erpnext/patches/v13_0/create_website_items.py
@@ -1,6 +1,4 @@
-from __future__ import unicode_literals
 import frappe
-
 from erpnext.e_commerce.doctype.website_item.website_item import make_website_item
 
 def execute():
@@ -48,7 +46,7 @@ def execute():
 		website_item.ranking = item.get("weightage")
 		for field in web_fields_to_map:
 			website_item.update({field: item.get(field)})
-			website_item.save()
+		website_item.save()
 
 		# move Website Item Group & Website Specification table to Website Item
 		for doctype in ("Website Item Group", "Item Website Specification"):
diff --git a/erpnext/public/scss/shopping_cart.scss b/erpnext/public/scss/shopping_cart.scss
index 48eb6dc540..b14743b833 100644
--- a/erpnext/public/scss/shopping_cart.scss
+++ b/erpnext/public/scss/shopping_cart.scss
@@ -100,6 +100,17 @@ body.product-page {
 		color: var(--gray-500);
 	}
 
+	.no-image-list {
+		@include flex(flex, center, center, null);
+		height: 150px;
+		background: var(--gray-100);
+		border-radius: var(--border-radius);
+		font-size: 2rem;
+		color: var(--gray-500);
+		margin-top: 15px;
+		margin-bottom: 15px;
+	}
+
 	.product-title {
 		font-size: 14px;
 		color: var(--gray-800);
@@ -198,7 +209,7 @@ body.product-page {
 		max-width: 50%;
 
 		.btn-add-to-cart {
-			font-size: var(--text-base);
+			font-size: 14px;
 		}
 	}
 
@@ -211,7 +222,7 @@ body.product-page {
 			max-width: 90% !important;
 
 			.btn-add-to-cart {
-				font-size: var(--text-base);
+				font-size: 14px;
 			}
 		}
 	}
@@ -294,7 +305,7 @@ body.product-page {
 
 			.formatted-price {
 				color: var(--text-muted);
-				font-size: var(--text-base);
+				font-size: 14px;
 			}
 		}
 
@@ -420,7 +431,7 @@ body.product-page {
 }
 
 .total-discount {
-	font-size: var(--text-base);
+	font-size: 14px;
 	color: var(--primary-color) !important;
 }
 
@@ -466,23 +477,23 @@ body.product-page {
 
 			.cart-items {
 				.item-title {
-					font-size: var(--text-base);
+					font-size: 14px;
 					font-weight: 500;
 					color: var(--text-color);
 				}
 
 				.item-subtitle {
 					color: var(--text-muted);
-					font-size: var(--text-md);
+					font-size: 13px;
 				}
 
 				.item-subtotal {
-					font-size: var(--text-base);
+					font-size: 14px;
 					font-weight: 500;
 				}
 
 				.sm-item-subtotal {
-					font-size: var(--text-base);
+					font-size: 14px;
 					font-weight: 500;
 					display: none;
 
@@ -492,7 +503,7 @@ body.product-page {
 				}
 
 				.item-rate {
-					font-size: var(--text-md);
+					font-size: 13px;
 					color: var(--text-muted);
 				}
 
@@ -568,7 +579,7 @@ body.product-page {
 
 			.cart-qty {
 				height: 28px;
-				font-size: var(--text-md);
+				font-size: 13px;
 			}
 		}
 
@@ -593,7 +604,7 @@ body.product-page {
 
 .address-card {
 	.card-title {
-		font-size: var(--text-base);
+		font-size: 14px;
 		font-weight: 500;
 	}
 
@@ -602,12 +613,12 @@ body.product-page {
 	}
 
 	.card-text {
-		font-size: var(--text-md);
+		font-size: 13px;
 		color: var(--gray-700);
 	}
 
 	.card-link {
-		font-size: var(--text-md);
+		font-size: 13px;
 
 		svg use {
 			stroke: var(--blue-500);
@@ -717,6 +728,7 @@ body.product-page {
 	color: var(--primary-color);
 	background-color: transparent;
 	border: 1px solid var(--blue-500);
+	font-size: 13px;
 
 	&:hover {
 		background-color: var(--primary-color);
@@ -728,6 +740,7 @@ body.product-page {
 	background-color: var(--dark-green-400);
 	color: white;
 	border: 2px solid var(--green-300);
+	font-size: 13px;
 
 	&:hover {
 		color: white;
@@ -739,6 +752,7 @@ body.product-page {
 	background-color: white;
 	border: 1px solid var(--blue-500);
 	--icon-stroke: var(--blue-500);
+	font-size: 14px;
 
 	&:hover {
 		background-color: var(--blue-500);
@@ -750,6 +764,7 @@ body.product-page {
 .remove-wish {
 	background-color: var(--gray-200);
 	position: absolute;
+	cursor: pointer;
 	top:10px;
 	right: 20px;
 	border-radius: 50%;
@@ -877,3 +892,11 @@ body.product-page {
 .brand-line {
 	color: gray;
 }
+
+.btn-next, .btn-prev {
+	font-size: 14px;
+}
+
+.font-md {
+	font-size: 14px !important;
+}
diff --git a/erpnext/templates/generators/item/item_add_to_cart.html b/erpnext/templates/generators/item/item_add_to_cart.html
index d42453dacd..d3bc097d8e 100644
--- a/erpnext/templates/generators/item/item_add_to_cart.html
+++ b/erpnext/templates/generators/item/item_add_to_cart.html
@@ -79,7 +79,7 @@
 				<!-- Add to Cart -->
 				{% if product_info.price and (cart_settings.allow_items_not_in_stock or product_info.in_stock) %}
 				<a href="/cart"
-					class="btn btn-light btn-view-in-cart hidden mr-2"
+					class="btn btn-light btn-view-in-cart hidden mr-2 font-md"
 					role="button"
 				>
 					{{ _("View in Cart") }}
diff --git a/erpnext/templates/generators/item/item_inquiry.html b/erpnext/templates/generators/item/item_inquiry.html
index 83653b6821..72b41676e7 100644
--- a/erpnext/templates/generators/item/item_inquiry.html
+++ b/erpnext/templates/generators/item/item_inquiry.html
@@ -1,9 +1,9 @@
 {% if shopping_cart and shopping_cart.cart_settings.enabled %}
 {% set cart_settings = shopping_cart.cart_settings %}
-    {% if cart_settings.show_contact_us_button | int %}
-        <button class="btn btn-inquiry btn-primary-light" data-item-code="{{ doc.name }}">
-            {{ _('Contact Us') }}
-        </button>
+	{% if cart_settings.show_contact_us_button | int %}
+		<button class="btn btn-inquiry btn-primary-light font-md" data-item-code="{{ doc.name }}">
+			{{ _('Contact Us') }}
+		</button>
 	{% endif %}
 <script>
 {% include "templates/generators/item/item_inquiry.js" %}
diff --git a/erpnext/templates/generators/item_group.html b/erpnext/templates/generators/item_group.html
index 0b2fb03263..fe200b1e5d 100644
--- a/erpnext/templates/generators/item_group.html
+++ b/erpnext/templates/generators/item_group.html
@@ -7,7 +7,10 @@
 
 	<div class="input-group mb-6 col-8 order-2">
 		<div class="dropdown w-100" id="dropdownMenuSearch">
-			<input type="search" name="query" id="search-box" class="form-control" placeholder="Search for products..." aria-label="Product" aria-describedby="button-addon2">
+			<input type="search" name="query" id="search-box" class="form-control"
+				placeholder="Search for products..."
+				aria-label="Product" aria-describedby="button-addon2"
+				style="font-size: 14px">
 			<!-- Results dropdown rendered in product_search.js -->
 		</div>
 	</div>
diff --git a/erpnext/templates/includes/cart/address_card.html b/erpnext/templates/includes/cart/address_card.html
index 667144bd87..830ed649f5 100644
--- a/erpnext/templates/includes/cart/address_card.html
+++ b/erpnext/templates/includes/cart/address_card.html
@@ -1,5 +1,5 @@
 <div class="card address-card h-100">
-	<div class="btn btn-sm btn-default btn-change-address" style="position: absolute; right: 0; top: 0;">
+	<div class="btn btn-sm btn-default btn-change-address font-md" style="position: absolute; right: 0; top: 0;">
 		{{ _('Change') }}
 	</div>
 	<div class="card-body p-0">
diff --git a/erpnext/templates/includes/cart/cart_address.html b/erpnext/templates/includes/cart/cart_address.html
index a9377f3aed..4f391e1821 100644
--- a/erpnext/templates/includes/cart/cart_address.html
+++ b/erpnext/templates/includes/cart/cart_address.html
@@ -8,9 +8,9 @@
 {% if show_coupon_code == 1%}
 <div class="mb-3">
 	<div class="row no-gutters">
-		<input type="text" class="txtcoupon form-control mr-3 w-25" placeholder="Enter Coupon Code" name="txtcouponcode"  ></input>
-		<button class="btn btn-primary btn-sm  bt-coupon">{{ _("Apply Coupon Code") }}</button>
-		<input type="hidden" class="txtreferral_sales_partner" placeholder="Enter Sales Partner" name="txtreferral_sales_partner" type="text"></input>
+		<input type="text" class="txtcoupon form-control mr-3 w-50 font-md" placeholder="Enter Coupon Code" name="txtcouponcode"  ></input>
+		<button class="btn btn-primary btn-sm bt-coupon font-md">{{ _("Apply Coupon Code") }}</button>
+		<input type="hidden" class="txtreferral_sales_partner font-md" placeholder="Enter Sales Partner" name="txtreferral_sales_partner" type="text"></input>
 		</div>
 </div>
 {% endif %}
@@ -30,7 +30,7 @@
 <div class="checkbox ml-1 mb-2">
 	<label for="input_same_billing">
 		<input type="checkbox" id="input_same_billing" checked>
-		<span class="label-area">{{ _('Billing Address is same as Shipping Address') }}</span>
+		<span class="label-area font-md">{{ _('Billing Address is same as Shipping Address') }}</span>
 	</label>
 </div>
 <div class="mb-3 frappe-card p-5" data-section="billing-address">
@@ -46,7 +46,9 @@
 		{% endif %}
 	{% endfor %}
 </div>
-<button class="btn btn-outline-primary btn-sm mt-1 btn-new-address bg-white">{{ _("Add a new address") }}</button>
+<button class="btn btn-outline-primary btn-sm mt-1 btn-new-address bg-white font-md">
+	{{ _("Add a new address") }}
+</button>
 
 <script>
 frappe.ready(() => {
@@ -125,7 +127,8 @@ frappe.ready(() => {
 				{
 					fieldname: "phone",
 					fieldtype: "Data",
-					label: "Phone"
+					label: "Phone",
+					reqd: 1
 				},
 			],
 			primary_action_label: __('Save'),
diff --git a/erpnext/templates/includes/macros.html b/erpnext/templates/includes/macros.html
index e3511de780..2224fdc311 100644
--- a/erpnext/templates/includes/macros.html
+++ b/erpnext/templates/includes/macros.html
@@ -138,33 +138,30 @@
 
 
 {%- macro wishlist_card(item, settings) %}
+{%- set title = item.item_name or item.item_code -%}
+{%- set title = title[:50] + "..." if title|len > 50 else title -%}
 <div class="col-sm-3 wishlist-card">
 	<div class="card text-center" style="max-height: 390px;">
-		{% if item.image %}
-			<div class="card-img-container">
-				<a href="/{{ item.route or '#' }}" style="text-decoration: none;">
+		<div class="card-img-container">
+			<a href="/{{ item.route or '#' }}" style="text-decoration: none;">
+				{% if item.image %}
 					<img class="card-img" src="{{ item.image }}" alt="{{ title }}">
-				</a>
-				<div class="remove-wish" data-item-code="{{ item.item_code }}">
-					<span style="padding-bottom: 2px;">
-						<svg class="icon sm remove-wish-icon" style="margin-bottom: 4px; margin-left: 0.5px;">
-							<use class="close" href="#icon-close"></use>
-						</svg>
-					</span>
-				</div>
-
+				{% else %}
+					<div class="card-img-top no-image">
+						{{ frappe.utils.get_abbr(title) }}
+					</div>
+				{% endif %}
+			</a>
+			<div class="remove-wish" data-item-code="{{ item.item_code }}">
+				<span style="padding-bottom: 2px;">
+					<svg class="icon sm remove-wish-icon" style="margin-bottom: 4px; margin-left: 0.5px;">
+						<use class="close" href="#icon-close"></use>
+					</svg>
+				</span>
 			</div>
-		{% else %}
-		<a href="/{{ item.route or '#' }}" style="text-decoration: none;">
-			<div class="card-img-top no-image">
-				{{ frappe.utils.get_abbr(title) }}
-			</div>
-		</a>
-		{% endif %}
+		</div>
 
 		{{ wishlist_card_body(item, settings) }}
-
-
 	</div>
 </div>
 {%- endmacro -%}
diff --git a/erpnext/templates/pages/cart.html b/erpnext/templates/pages/cart.html
index 262b86f130..92deb1419c 100644
--- a/erpnext/templates/pages/cart.html
+++ b/erpnext/templates/pages/cart.html
@@ -52,11 +52,11 @@
 			<div class="row mt-2">
 				<div class="col-3">
 					{% if cart_settings.enable_checkout %}
-						<a class="btn btn-outline-primary" href="/orders">
+						<a class="btn btn-outline-primary font-md" href="/orders">
 							{{ _('Past Orders') }}
 						</a>
 					{% else %}
-						<a class="btn btn-outline-primary" href="/quotations">
+						<a class="btn btn-outline-primary font-md" href="/quotations">
 							{{ _('See past quotations') }}
 						</a>
 					{% endif %}
@@ -64,15 +64,15 @@
 				<div class="col-9">
 					{% if doc.items %}
 					<div class="place-order-container">
-						<a class="btn btn-primary-light mr-2" href="/all-products">
+						<a class="btn btn-primary-light mr-2 font-md" href="/all-products">
 							{{ _('Back to Shop') }}
 						</a>
 						{% if cart_settings.enable_checkout %}
-							<button class="btn btn-primary btn-place-order" type="button">
+							<button class="btn btn-primary btn-place-order font-md" type="button">
 								{{ _('Place Order') }}
 							</button>
 						{% else %}
-							<button class="btn btn-primary btn-request-for-quotation" type="button">
+							<button class="btn btn-primary btn-request-for-quotation font-md" type="button">
 								{{ _('Request for Quotation') }}
 							</button>
 						{% endif %}
diff --git a/erpnext/templates/pages/product_search.py b/erpnext/templates/pages/product_search.py
index 190abfdd6c..b6601a8f67 100644
--- a/erpnext/templates/pages/product_search.py
+++ b/erpnext/templates/pages/product_search.py
@@ -80,7 +80,7 @@ def search(query, limit=10, fuzzy_search=True):
 	suggestions = ac.get_suggestions(
 		query,
 		num=limit,
-		fuzzy= fuzzy_search and len(query) > 4 # Fuzzy on length < 3 can be real slow
+		fuzzy= fuzzy_search and len(query) > 3 # Fuzzy on length < 3 can be real slow
 	)
 
 	# Build a query
diff --git a/erpnext/www/all-products/index.html b/erpnext/www/all-products/index.html
index 0a62bc4cd6..df3377e9bd 100644
--- a/erpnext/www/all-products/index.html
+++ b/erpnext/www/all-products/index.html
@@ -8,7 +8,10 @@
 
 	<div class="input-group mb-6 col-8 order-2">
 		<div class="dropdown w-100" id="dropdownMenuSearch">
-			<input type="search" name="query" id="search-box" class="form-control" placeholder="Search for products..." aria-label="Product" aria-describedby="button-addon2">
+			<input type="search" name="query" id="search-box" class="form-control"
+				placeholder="Search for products..."
+				aria-label="Product" aria-describedby="button-addon2"
+				style="font-size: 14px">
 			<!-- Results dropdown rendered in product_search.js -->
 		</div>
 	</div>