Shiloh/brotherton-erpnext
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: POS compatible for mobile view (#36534)

Browse Source 
* fix: POS compatable for mobile view

* fix: variables for margin and font size, and dark mode compatibility while selecting any item from cart

---------

Co-authored-by: Ritvik Sardana <ritviksardana@Ritviks-MacBook-Air.local>
This commit is contained in:
RitvikSardana 2023-08-13 13:27:43 +05:30 committed by GitHub
parent ce25f9e8c9
commit ae2c600223
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 62 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

65
erpnext/public/scss/point-of-sale.scss
View File

@ -53,7 +53,7 @@
.seperator { .seperator {
margin-left: var(--margin-sm); margin-left: var(--margin-sm);
margin-right: var(--margin-sm); margin-right: var(--margin-md);
border-bottom: 1px solid var(--gray-300); border-bottom: 1px solid var(--gray-300);
} }
@ -381,6 +381,7 @@
align-items: center; align-items: center;
padding: var(--padding-sm); padding: var(--padding-sm);
border-radius: var(--border-radius-md); border-radius: var(--border-radius-md);
margin-right: var(--margin-sm);
&:hover { &:hover {
background-color: var(--control-bg); background-color: var(--control-bg);
@ -858,13 +859,10 @@
> .fields-section { > .fields-section {
flex: 1; flex: 1;
position: absolute;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 50%; width: 50%;
height: 100%; height: 100%;
top: 0;
left: 0;
padding-bottom: var(--margin-md); padding-bottom: var(--margin-md);
.invoice-fields { .invoice-fields {
@ -1152,3 +1150,62 @@
} }
} }
} }
@media screen and (max-width: 620px) {
.point-of-sale-app {
grid-template-columns: repeat(1, minmax(0, 1fr));
> .items-selector {
grid-column: span 6 / span 1 !important;
> .items-container {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
> .item-details-container, .customer-cart-container {
grid-column: span 6 / span 1;
}
> .payment-container {
overflow: scroll;
> .fields-numpad-container {
flex-direction: column-reverse;
> .number-pad {
display: none;
}
> .fields-section {
width: 100%;
}
}
}
> .past-order-summary{
> .invoice-summary-wrapper {
width: 100%;
}
}
.numpad-totals {
> span {
padding: 0 5px;
font-size: var(--text-sm);
}
}
.col > * {
font-size: var(--text-sm) !important;
}
.control-input-wrapper {
padding-left: 0.15rem;
}
.pay-amount {
margin-left: 0.2rem;
}
.past-order-list {
grid-column: span 6 / span 1;
}
}
}

2
erpnext/selling/page/point_of_sale/pos_item_cart.js
View File

@ -286,7 +286,7 @@ erpnext.PointOfSale.ItemCart = class {
this.item_is_selected = false; this.item_is_selected = false;
this.$cart_container.find('.cart-item-wrapper').css("background-color", ""); this.$cart_container.find('.cart-item-wrapper').css("background-color", "");
} else { } else {
$cart_item.css("background-color", "var(--gray-50)"); $cart_item.css("background-color", "var(--control-bg)");
this.item_is_selected = true; this.item_is_selected = true;
this.$cart_container.find('.cart-item-wrapper').not(item).css("background-color", ""); this.$cart_container.find('.cart-item-wrapper').not(item).css("background-color", "");
} }