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)
This commit is contained in:
marination 2021-06-08 19:40:26 +05:30
parent 24ba06c37b
commit aca3c8fce7
14 changed files with 104 additions and 68 deletions

View File

@ -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>
`;
}
}

View File

@ -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>
`;
}
}

View File

@ -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);

View File

@ -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"):

View File

@ -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;
}

View File

@ -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") }}

View File

@ -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" %}

View File

@ -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>

View File

@ -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">

View File

@ -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'),

View File

@ -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 -%}

View File

@ -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 %}

View File

@ -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

View File

@ -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>