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

[pos] ui cleanup

Browse Source
This commit is contained in:
Faris Ansari 2017-03-10 14:50:39 +05:30 committed by Rohit Waghchaure
parent 6068aecc2e
commit 1fe1518398
5 changed files with 518 additions and 614 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
erpnext/accounts/page/pos/pos.js
View File

@ -748,7 +748,8 @@ erpnext.pos.PointOfSale = erpnext.taxes_and_totals.extend({
.on('focus', function (e) { .on('focus', function (e) {
$(e.target).val('').trigger('input'); $(e.target).val('').trigger('input');
me.toggle_edit_button(false); me.toggle_edit_button(false);
if(me.frm.doc.items.length){
if(me.frm.doc.items.length) {
me.toggle_list_customer(false) me.toggle_list_customer(false)
me.toggle_item_cart(true) me.toggle_item_cart(true)
} else { } else {

443
erpnext/public/css/erpnext.css
View File

@ -12,93 +12,11 @@
height: 32px; height: 32px;
margin: -10px auto; margin: -10px auto;
} }
/* pos */
.pos-item-wrapper {
padding: 5px;
}
.pos-item {
overflow: hidden;
text-overflow: ellipsis;
cursor: pointer;
padding: 5px;
padding-bottom: 15px;
border: 1px solid #d1d8dd;
margin-bottom: 5px;
}
.pos-item-text {
padding: 0px 5px;
}
.pos-item .item-code {
margin-bottom: 0px;
}
.pos-item .no-image {
background-color: #fafbfc;
border: 1px dashed #d1d8dd;
}
.pos-item-image {
width: 100%;
height: 0px;
padding: 50% 0;
text-align: center;
line-height: 0;
color: #d1d8dd;
font-size: 30px;
background-size: contain;
border: 1px solid transparent;
background-position: center;
background-repeat: no-repeat;
}
.pos-item-toolbar {
height: 51px;
padding: 10px 0px;
border-bottom: 1px solid #d1d8dd;
}
.pos-toolbar,
.pos-bill-toolbar {
padding: 10px 0px;
height: 51px;
}
.pos-item-toolbar .form-group {
margin-bottom: 0px;
}
.edit-pos-item {
height: 50px;
font-size: 14px;
border-top: 1px solid #d1d8dd;
padding-top: 12px;
}
.pos-bill-item:hover {
background-color: #f5f7fa;
cursor: pointer;
}
.pos-item-qty {
display: inline-block;
}
.pos-qty-row > div {
padding: 5px 0px;
}
.pos-qty-btn {
margin-top: 3px;
cursor: pointer;
font-size: 120%;
}
.pos .search-area .form-group {
max-width: 100% !important;
}
.pos .tax-table {
margin-bottom: 10px;
}
.erpnext-icon { .erpnext-icon {
width: 24px; width: 24px;
margin-right: 0px; margin-right: 0px;
margin-top: -3px; margin-top: -3px;
} }
.pos .discount-amount-area .discount-field-col {
padding-left: 0px;
}
.pos .discount-amount-area .input-group {
margin-top: 2px;
}
.dashboard-list-item { .dashboard-list-item {
background-color: inherit; background-color: inherit;
padding: 5px 0px; padding: 5px 0px;
@ -110,135 +28,6 @@
.dashboard-list-item:last-child { .dashboard-list-item:last-child {
border-bottom: none; border-bottom: none;
} }
.payment-toolbar .row {
width: 323px;
margin: 0 auto;
}
.payment-mode {
cursor: pointer;
font-family: sans-serif;
font-size: 15px;
}
.pos-payment-row .col-xs-6 {
padding: 15px;
}
.pos-payment-row {
border-bottom: 1px solid #d1d8dd;
margin: 2px 0px 5px 0px;
height: 60px;
margin-top: 0px;
margin-bottom: 0px;
}
.pos-payment-row:hover,
.pos-keyboard-key:hover {
background-color: #FAFBFC;
cursor: pointer;
}
.pos-keyboard-key,
.delete-btn {
border: 1px solid #d1d8dd;
height: 85px;
width: 85px;
margin: 10px 10px;
font-size: 24px;
font-weight: 200;
background-color: #FDFDFD;
border-color: #e8e8e8;
}
.numeric-keypad {
border: 1px solid #d1d8dd;
height: 69px;
width: 69px;
font-size: 20px;
font-weight: 200;
background-color: #FDFDFD;
border-color: #e8e8e8;
margin-left: -4px;
}
.pos-pay {
height: 69px;
width: 69px;
font-size: 17px;
font-weight: 200;
margin-left: -4px;
}
.numeric-keypad {
height: 60px;
width: 60px;
font-size: 20px;
font-weight: 200;
border-radius: 0;
background-color: #fff;
margin-left: -4px;
}
.numeric_keypad {
margin-left: -15px;
}
.numeric_keypad > .row > button {
border: none;
border-right: 1px solid #d1d8dd;
border-bottom: 1px solid #d1d8dd;
}
.numeric_keypad > .row > button:first-child {
border-left: 1px solid #d1d8dd;
}
.numeric_keypad > .row:first-child > button {
border-top: 1px solid #d1d8dd;
}
.pos-pay {
background-color: #5E64FF;
border: none;
}
.multimode-payments {
padding-left: 30px;
}
.payment-toolbar {
padding-right: 30px;
}
.list-row-head.pos-invoice-list {
border-top: 1px solid #d1d8dd;
}
body[data-route="pos"] .modal-dialog {
width: 750px;
}
@media (max-width: 767px) {
body[data-route="pos"] .modal-dialog {
width: auto;
}
body[data-route="pos"] .modal-dialog .modal-content {
height: auto;
}
}
@media (max-width: 767px) {
.amount-row h3 {
font-size: 15px;
}
.pos-keyboard-key,
.delete-btn {
height: 50px;
}
.multimode-payments {
padding-left: 15px;
}
.payment-toolbar {
padding-right: 15px;
}
}
.amount-label {
font-size: 16px;
}
.selected-payment-mode {
background-color: #FAFBFC;
cursor: pointer;
}
.pos-invoice-list {
padding: 15px 10px;
}
.write_off_amount,
.change_amount {
margin: 15px;
width: 130px;
}
.frappe-control[data-fieldname='result_html'] { .frappe-control[data-fieldname='result_html'] {
overflow: scroll; overflow: scroll;
} }
@ -261,7 +50,169 @@ body[data-route="pos"] .modal-dialog {
.assessment-result-tool .score { .assessment-result-tool .score {
text-align: right; text-align: right;
} }
.pos-list-row { /* pos */
body[data-route="pos"] .pos-bill-toolbar {
padding: 10px 0px;
height: 51px;
}
body[data-route="pos"] .pos-bill-item:hover,
body[data-route="pos"] .list-customers-table > .pos-list-row:hover {
background-color: #f5f7fa;
cursor: pointer;
}
body[data-route="pos"] .pos-item-qty {
display: inline-block;
}
body[data-route="pos"] .pos-qty-row > div {
padding: 5px 0px;
}
body[data-route="pos"] .pos-qty-btn {
margin-top: 3px;
cursor: pointer;
font-size: 120%;
}
body[data-route="pos"] .search-area .form-group {
max-width: 100% !important;
}
body[data-route="pos"] .tax-table {
margin-bottom: 10px;
}
body[data-route="pos"] .discount-field-col {
padding-left: 24px;
}
body[data-route="pos"] .discount-amount-area .input-group:first-child {
margin-bottom: 2px;
}
body[data-route="pos"] .payment-toolbar .row {
width: 323px;
margin: 0 auto;
}
body[data-route="pos"] .payment-mode {
cursor: pointer;
font-family: sans-serif;
font-size: 15px;
}
body[data-route="pos"] .pos-payment-row .col-xs-6 {
padding: 15px;
}
body[data-route="pos"] .pos-payment-row {
border-bottom: 1px solid #d1d8dd;
margin: 2px 0px 5px 0px;
height: 60px;
margin-top: 0px;
margin-bottom: 0px;
}
body[data-route="pos"] .pos-payment-row:hover,
body[data-route="pos"] .pos-keyboard-key:hover {
background-color: #FAFBFC;
cursor: pointer;
}
body[data-route="pos"] .pos-keyboard-key,
body[data-route="pos"] .delete-btn {
border: 1px solid #d1d8dd;
height: 85px;
width: 85px;
margin: 10px 10px;
font-size: 24px;
font-weight: 200;
background-color: #FDFDFD;
border-color: #e8e8e8;
}
body[data-route="pos"] .numeric-keypad {
border: 1px solid #d1d8dd;
height: 69px;
width: 69px;
font-size: 20px;
font-weight: 200;
background-color: #FDFDFD;
border-color: #e8e8e8;
margin-left: -4px;
}
body[data-route="pos"] .pos-pay {
height: 69px;
width: 69px;
font-size: 17px;
font-weight: 200;
margin-left: -4px;
}
body[data-route="pos"] .numeric-keypad {
height: 60px;
width: 60px;
font-size: 20px;
font-weight: 200;
border-radius: 0;
background-color: #fff;
margin-left: -4px;
}
body[data-route="pos"] .numeric_keypad {
margin-left: -15px;
}
body[data-route="pos"] .numeric_keypad > .row > button {
border: none;
border-right: 1px solid #d1d8dd;
border-bottom: 1px solid #d1d8dd;
}
body[data-route="pos"] .numeric_keypad > .row > button:first-child {
border-left: 1px solid #d1d8dd;
}
body[data-route="pos"] .numeric_keypad > .row:first-child > button {
border-top: 1px solid #d1d8dd;
}
body[data-route="pos"] .pos-pay {
background-color: #5E64FF;
border: none;
}
body[data-route="pos"] .multimode-payments {
padding-left: 30px;
}
body[data-route="pos"] .payment-toolbar {
padding-right: 30px;
}
body[data-route="pos"] .list-row-head.pos-invoice-list {
border-top: 1px solid #d1d8dd;
}
body[data-route="pos"] .modal-dialog {
width: 750px;
}
@media (max-width: 767px) {
body[data-route="pos"] .modal-dialog {
width: auto;
}
body[data-route="pos"] .modal-dialog .modal-content {
height: auto;
}
}
@media (max-width: 767px) {
body[data-route="pos"] .amount-row h3 {
font-size: 15px;
}
body[data-route="pos"] .pos-keyboard-key,
body[data-route="pos"] .delete-btn {
height: 50px;
}
body[data-route="pos"] .multimode-payments {
padding-left: 15px;
}
body[data-route="pos"] .payment-toolbar {
padding-right: 15px;
}
}
body[data-route="pos"] .amount-label {
font-size: 16px;
}
body[data-route="pos"] .selected-payment-mode {
background-color: #FAFBFC;
cursor: pointer;
}
body[data-route="pos"] .pos-invoice-list {
padding: 15px 10px;
}
body[data-route="pos"] .write_off_amount,
body[data-route="pos"] .change_amount {
margin: 15px;
width: 130px;
}
body[data-route="pos"] .pos-list-row {
display: table; display: table;
table-layout: fixed; table-layout: fixed;
width: 100%; width: 100%;
@ -270,99 +221,102 @@ body[data-route="pos"] .modal-dialog {
margin: 0px; margin: 0px;
border-bottom: 1px solid #d1d8dd; border-bottom: 1px solid #d1d8dd;
} }
.pos-list-row .cell { body[data-route="pos"] .pos-list-row .cell {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
} }
.pos-list-row .subject { body[data-route="pos"] .pos-list-row .cell.price-cell {
width: 50%;
}
body[data-route="pos"] .pos-list-row .subject {
width: 40%; width: 40%;
} }
.pos-list-row .list-row-checkbox, body[data-route="pos"] .pos-list-row .list-row-checkbox,
.pos-list-row .list-select-all { body[data-route="pos"] .pos-list-row .list-select-all {
margin-right: 7px; margin-right: 7px;
} }
.pos-bill-header { body[data-route="pos"] .pos-bill-header {
background-color: #f5f7fa; background-color: #f5f7fa;
border: 1px solid #d1d8dd; border: 1px solid #d1d8dd;
padding: 13px 15px; padding: 13px 15px;
} }
.pos-list-row.active { body[data-route="pos"] .pos-list-row.active {
background-color: #fffce7; background-color: #fffce7;
} }
.totals-area { body[data-route="pos"] .totals-area {
border-right: 1px solid #d1d8dd; border-right: 1px solid #d1d8dd;
border-left: 1px solid #d1d8dd; border-left: 1px solid #d1d8dd;
margin-bottom: 15px; margin-bottom: 15px;
} }
.item-cart-items { body[data-route="pos"] .tax-area .pos-list-row {
border: none;
}
body[data-route="pos"] .item-cart-items {
height: calc(100vh - 526px); height: calc(100vh - 526px);
overflow: auto; overflow: auto;
border: 1px solid #d1d8dd; border: 1px solid #d1d8dd;
border-top: none; border-top: none;
} }
.pos .no-items-message { body[data-route="pos"] .no-items-message {
min-height: 200px; min-height: 200px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 100%; height: 100%;
} }
.pos .pos-list-row:last-child { body[data-route="pos"] .pos-list-row:last-child {
border-bottom: none; border-bottom: none;
} }
.pos .form-section-heading { body[data-route="pos"] .form-section-heading {
padding: 0; padding: 0;
} }
.pos { body[data-route="pos"] .item-list {
overflow: hidden;
}
.pos .item-list {
border: 1px solid #d1d8dd; border: 1px solid #d1d8dd;
border-top: none; border-top: none;
max-height: calc(100vh - 190px); max-height: calc(100vh - 190px);
overflow: auto; overflow: auto;
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.pos .item-list { body[data-route="pos"] .item-list {
max-height: initial; max-height: initial;
} }
} }
.pos .item-list .image-field { body[data-route="pos"] .item-list .image-field {
height: 140px; height: 140px;
} }
.pos .item-list .pos-item-wrapper { body[data-route="pos"] .item-list .pos-item-wrapper {
position: relative; position: relative;
} }
.pos .item-list .price-info { body[data-route="pos"] .item-list .price-info {
width: 99%;
text-align: center;
position: absolute; position: absolute;
right: 0; left: 0;
bottom: 0; bottom: 0;
margin: 2px 1px 2px 2px; margin: 0 0 15px 15px;
background-color: rgba(162, 161, 161, 0.1); background-color: rgba(141, 153, 166, 0.6);
padding: 9px 15px; padding: 5px 9px;
border-radius: 3px;
color: #fff;
} }
.pos-bill-toolbar { body[data-route="pos"] .pos-bill-toolbar {
margin-top: 10px; margin-top: 10px;
} }
.pos .search-item .form-group { body[data-route="pos"] .search-item .form-group {
margin: 0; margin: 0;
} }
.item-list-area .pos-bill-header { body[data-route="pos"] .item-list-area .pos-bill-header {
padding: 5px; padding: 5px;
padding-left: 15px; padding-left: 15px;
} }
.pos-selected-item-action > .pos-list-row { body[data-route="pos"] .pos-selected-item-action > .pos-list-row {
border: none; border: none;
} }
.edit-customer-btn { body[data-route="pos"] .edit-customer-btn {
position: absolute; position: absolute;
right: 57px; right: 57px;
top: 15px; top: 15px;
z-index: 100; z-index: 100;
} }
.btn-more { body[data-route="pos"] .btn-more {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -370,3 +324,6 @@ body[data-route="pos"] .modal-dialog {
background-color: #fafbfc; background-color: #fafbfc;
min-height: 200px; min-height: 200px;
} }
body[data-route="pos"] .collapse-btn {
cursor: pointer;
}

30
erpnext/public/js/pos/pos.html
View File

@ -27,27 +27,25 @@
</div> </div>
<div class="totals-area"> <div class="totals-area">
<div class="pos-list-row net-total-area"> <div class="pos-list-row net-total-area">
<div class="cell subject"></div>
<div class="cell"></div> <div class="cell"></div>
<div class="cell text-right">{%= __("Net Total") %}</div> <div class="cell text-right">{%= __("Net Total") %}</div>
<div class="cell net-total text-right"></div> <div class="cell price-cell bold net-total text-right"></div>
</div> </div>
<div class="pos-list-row tax-area"> <div class="pos-list-row tax-area">
<div class="cell subject"></div>
<div class="cell"></div> <div class="cell"></div>
<div class="cell text-muted">{%= __("Taxes") %}</div> <div class="cell text-right">{%= __("Taxes") %}</div>
<div class="cell text-right tax-table"></div> <div class="cell price-cell text-right tax-table">
</div>
</div> </div>
{% if (apply_discount_on) { %} {% if (apply_discount_on) { %}
<div class="pos-list-row discount-amount-area"> <div class="pos-list-row discount-amount-area">
<div class="cell text-muted">{%= __("Discount") %}</div> <div class="cell"></div>
<div class="cell discount-field-col"> <div class="cell text-right">{%= __("Discount") %}</div>
<div class="cell price-cell discount-field-col">
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<span class="input-group-addon">%</span> <span class="input-group-addon">%</span>
<input type="text" class="form-control discount-percentage text-right"> <input type="text" class="form-control discount-percentage text-right">
</div> </div>
</div>
<div class="cell discount-field-col">
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<span class="input-group-addon">{%= get_currency_symbol(currency) %}</span> <span class="input-group-addon">{%= get_currency_symbol(currency) %}</span>
<input type="text" class="form-control discount-amount text-right" placeholder="{%= 0.00 %}"> <input type="text" class="form-control discount-amount text-right" placeholder="{%= 0.00 %}">
@ -55,21 +53,21 @@
</div> </div>
</div> </div>
{% } %} {% } %}
<div class="pos-list-row grand-total-area" style="border-bottom:1px solid #d1d8dd;"> <div class="pos-list-row grand-total-area collapse-btn" style="border-bottom:1px solid #d1d8dd;">
<div class="cell"> <div class="cell">
<a class="collapse-btn"> <a class="">
<i class="octicon octicon-chevron-down"></i> <i class="octicon octicon-chevron-down"></i>
</a> </a>
</div> </div>
<div class="cell text-right bold">{%= __("Grand Total") %}</div> <div class="cell text-right bold">{%= __("Grand Total") %}</div>
<div class="cell subject grand-total text-right lead"></div> <div class="cell price-cell grand-total text-right lead"></div>
</div> </div>
</div> </div>
<div class="row" style="margin-top: 30px"> <div class="row" style="margin-top: 30px">
<div class="col-xs-6 selected-item"> <div class="col-sm-6 selected-item">
</div> </div>
<div class="col-xs-6 numeric_keypad" style="display:none"> <div class="col-xs-6 numeric_keypad hidden-xs" style="display:none">
{% var chartData = ["Qty", "Disc", "Price"] %} {% for(var i=0; i {% var chartData = ["Qty", "Disc", "Price"] %} {% for(var i=0; i
<3; i++) { %} <div class="row text-right"> <3; i++) { %} <div class="row text-right">
{% for(var j=i*3; j {% for(var j=i*3; j
@ -110,10 +108,6 @@
</div> </div>
<span id="customer-results" style="color:#68a;"></span> <span id="customer-results" style="color:#68a;"></span>
<div class="row pos-item-toolbar hide">
<!--<div class="search-item-group col-xs-5"></div>-->
<!--<div class="search-item col-xs-7"></div>-->
</div>
<div class="item-list-area"> <div class="item-list-area">
<div class="pos-list-row pos-bill-header text-muted h6"> <div class="pos-list-row pos-bill-header text-muted h6">
<div class="cell subject search-item-group"> <div class="cell subject search-item-group">

6
erpnext/public/js/pos/pos_tax_row.html
View File

@ -1,4 +1,4 @@
<div class="row"> <div class="pos-list-row" style="padding-right: 0;">
<div class="col-xs-9">{%= description %}</div> <div class="cell">{%= description %}</div>
<div class="col-xs-3 text-right">{%= tax_amount %}</div> <div class="cell text-right bold">{%= tax_amount %}</div>
</div> </div>

536
erpnext/public/less/erpnext.less
View File

@ -17,114 +17,12 @@
margin: -10px auto; margin: -10px auto;
} }
/* pos */
.pos-item-wrapper {
padding: 5px;
}
.pos-item {
overflow: hidden;
text-overflow: ellipsis;
cursor: pointer;
padding: 5px;
padding-bottom: 15px;
border: 1px solid #d1d8dd;
margin-bottom: 5px;
}
.pos-item-text {
padding: 0px 5px;
}
.pos-item .item-code {
margin-bottom: 0px;
}
.pos-item .no-image {
background-color: #fafbfc;
border: 1px dashed #d1d8dd;
}
.pos-item-image {
width: 100%;
height: 0px;
padding: 50% 0;
text-align: center;
line-height: 0;
color: @text-extra-muted;
font-size: 30px;
background-size: contain;
border: 1px solid transparent;
background-position: center;
background-repeat: no-repeat;
}
.pos-item-toolbar {
height: 51px; // remove later
padding: 10px 0px;
border-bottom: 1px solid #d1d8dd;
}
.pos-toolbar, .pos-bill-toolbar {
padding: 10px 0px;
// border-bottom: 1px solid #d1d8dd;
height: 51px;
}
.pos-item-toolbar .form-group {
margin-bottom: 0px;
}
.edit-pos-item {
height: 50px;
font-size: 14px;
border-top: 1px solid @border-color;
padding-top: 12px;
}
.pos-bill-item:hover {
background-color: #f5f7fa;
cursor: pointer;
}
.pos-item-qty {
display: inline-block;
}
.pos-qty-row > div {
padding: 5px 0px;
}
.pos-qty-btn {
margin-top: 3px;
cursor: pointer;
font-size: 120%;
}
.pos .search-area .form-group {
max-width: 100% !important;
}
.pos .tax-table {
margin-bottom: 10px;
}
.erpnext-icon { .erpnext-icon {
width: 24px; width: 24px;
margin-right: 0px; margin-right: 0px;
margin-top: -3px; margin-top: -3px;
} }
.pos .discount-amount-area {
.discount-field-col {
padding-left: 0px;
}
.input-group {
margin-top: 2px;
}
}
.dashboard-list-item { .dashboard-list-item {
background-color: inherit; background-color: inherit;
padding: 5px 0px; padding: 5px 0px;
@ -139,157 +37,6 @@
border-bottom: none; border-bottom: none;
} }
.payment-toolbar {
.row {
width: 323px;
margin: 0 auto;
}
}
.payment-mode {
cursor: pointer;
font-family: sans-serif;
font-size: 15px;
}
.pos-payment-row .col-xs-6 {
padding :15px;
}
.pos-payment-row {
border-bottom:1px solid #d1d8dd;
margin: 2px 0px 5px 0px;
height: 60px;
margin-top: 0px;
margin-bottom: 0px;
}
.pos-payment-row:hover, .pos-keyboard-key:hover{
background-color: #FAFBFC;
cursor: pointer;
}
.pos-keyboard-key, .delete-btn {
border: 1px solid #d1d8dd;
height:85px;
width:85px;
margin:10px 10px;
font-size:24px;
font-weight:200;
background-color: #FDFDFD;
border-color: #e8e8e8;
}
.numeric-keypad {
border: 1px solid #d1d8dd;
height:69px;
width:69px;
font-size:20px;
font-weight:200;
background-color: #FDFDFD;
border-color: #e8e8e8;
margin-left:-4px;
}
.pos-pay {
height:69px;
width:69px;
font-size:17px;
font-weight:200;
margin-left:-4px;
}
.numeric-keypad {
height: 60px;
width: 60px;
font-size: 20px;
font-weight: 200;
border-radius: 0;
background-color: #fff;
margin-left:-4px;
}
.numeric_keypad {
margin-left: -15px;
& > .row > button {
border: none;
border-right: 1px solid @border-color;
border-bottom: 1px solid @border-color;
&:first-child {
border-left: 1px solid @border-color;
}
}
& > .row:first-child > button {
border-top: 1px solid @border-color;
}
}
.pos-pay {
background-color: @brand-primary;
border: none;
}
.multimode-payments {
padding-left: 30px;
}
.payment-toolbar {
padding-right: 30px;
}
.list-row-head.pos-invoice-list {
border-top: 1px solid @border-color;
}
body[data-route="pos"] .modal-dialog {
width: 750px;
@media (max-width: @screen-xs) {
width: auto;
.modal-content {
height: auto;
}
}
}
@media (max-width: @screen-xs) {
.amount-row h3 {
font-size: 15px;
}
.pos-keyboard-key, .delete-btn {
height: 50px;
}
.multimode-payments {
padding-left: 15px;
}
.payment-toolbar {
padding-right: 15px;
}
}
.amount-label {
font-size: 16px;
}
.selected-payment-mode {
background-color: #FAFBFC;
cursor: pointer;
}
.pos-invoice-list {
padding: 15px 10px;
}
.write_off_amount, .change_amount {
margin: 15px;
width: 130px;
}
// assessment tool // assessment tool
.frappe-control[data-fieldname='result_html'] { .frappe-control[data-fieldname='result_html'] {
overflow: scroll; overflow: scroll;
@ -315,7 +62,203 @@ body[data-route="pos"] .modal-dialog {
} }
} }
.pos-list-row { /* pos */
body[data-route="pos"] {
.pos-bill-toolbar {
padding: 10px 0px;
height: 51px;
}
.pos-bill-item:hover, .list-customers-table > .pos-list-row:hover {
background-color: #f5f7fa;
cursor: pointer;
}
.pos-item-qty {
display: inline-block;
}
.pos-qty-row > div {
padding: 5px 0px;
}
.pos-qty-btn {
margin-top: 3px;
cursor: pointer;
font-size: 120%;
}
.search-area .form-group {
max-width: 100% !important;
}
.tax-table {
margin-bottom: 10px;
}
.discount-field-col {
padding-left: 24px;
}
.discount-amount-area {
.input-group:first-child {
margin-bottom: 2px;
}
}
.payment-toolbar {
.row {
width: 323px;
margin: 0 auto;
}
}
.payment-mode {
cursor: pointer;
font-family: sans-serif;
font-size: 15px;
}
.pos-payment-row .col-xs-6 {
padding :15px;
}
.pos-payment-row {
border-bottom:1px solid #d1d8dd;
margin: 2px 0px 5px 0px;
height: 60px;
margin-top: 0px;
margin-bottom: 0px;
}
.pos-payment-row:hover, .pos-keyboard-key:hover{
background-color: #FAFBFC;
cursor: pointer;
}
.pos-keyboard-key, .delete-btn {
border: 1px solid #d1d8dd;
height:85px;
width:85px;
margin:10px 10px;
font-size:24px;
font-weight:200;
background-color: #FDFDFD;
border-color: #e8e8e8;
}
.numeric-keypad {
border: 1px solid #d1d8dd;
height:69px;
width:69px;
font-size:20px;
font-weight:200;
background-color: #FDFDFD;
border-color: #e8e8e8;
margin-left:-4px;
}
.pos-pay {
height:69px;
width:69px;
font-size:17px;
font-weight:200;
margin-left:-4px;
}
.numeric-keypad {
height: 60px;
width: 60px;
font-size: 20px;
font-weight: 200;
border-radius: 0;
background-color: #fff;
margin-left:-4px;
}
.numeric_keypad {
margin-left: -15px;
& > .row > button {
border: none;
border-right: 1px solid @border-color;
border-bottom: 1px solid @border-color;
&:first-child {
border-left: 1px solid @border-color;
}
}
& > .row:first-child > button {
border-top: 1px solid @border-color;
}
}
.pos-pay {
background-color: @brand-primary;
border: none;
}
.multimode-payments {
padding-left: 30px;
}
.payment-toolbar {
padding-right: 30px;
}
.list-row-head.pos-invoice-list {
border-top: 1px solid @border-color;
}
.modal-dialog {
width: 750px;
@media (max-width: @screen-xs) {
width: auto;
.modal-content {
height: auto;
}
}
}
@media (max-width: @screen-xs) {
.amount-row h3 {
font-size: 15px;
}
.pos-keyboard-key, .delete-btn {
height: 50px;
}
.multimode-payments {
padding-left: 15px;
}
.payment-toolbar {
padding-right: 15px;
}
}
.amount-label {
font-size: 16px;
}
.selected-payment-mode {
background-color: #FAFBFC;
cursor: pointer;
}
.pos-invoice-list {
padding: 15px 10px;
}
.write_off_amount, .change_amount {
margin: 15px;
width: 130px;
}
.pos-list-row {
display: table; display: table;
table-layout: fixed; table-layout: fixed;
width: 100%; width: 100%;
@ -327,6 +270,10 @@ body[data-route="pos"] .modal-dialog {
.cell { .cell {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
&.price-cell {
width: 50%;
}
} }
.subject { .subject {
@ -336,52 +283,52 @@ body[data-route="pos"] .modal-dialog {
.list-row-checkbox, .list-select-all { .list-row-checkbox, .list-select-all {
margin-right: 7px; margin-right: 7px;
} }
} }
.pos-bill-header { .pos-bill-header {
background-color: #f5f7fa; background-color: #f5f7fa;
border: 1px solid @border-color; border: 1px solid @border-color;
padding: 13px 15px; padding: 13px 15px;
} }
.pos-list-row.active { .pos-list-row.active {
background-color: @light-yellow; background-color: @light-yellow;
} }
.totals-area { .totals-area {
border-right: 1px solid @border-color; border-right: 1px solid @border-color;
border-left: 1px solid @border-color; border-left: 1px solid @border-color;
margin-bottom: 15px; margin-bottom: 15px;
} }
.item-cart-items { .tax-area .pos-list-row {
border: none;
}
.item-cart-items {
height: ~"calc(100vh - 526px)"; height: ~"calc(100vh - 526px)";
overflow: auto; overflow: auto;
border: 1px solid @border-color; border: 1px solid @border-color;
border-top: none; border-top: none;
}
} .no-items-message {
.pos .no-items-message {
min-height: 200px; min-height: 200px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 100%; height: 100%;
} }
.pos .pos-list-row:last-child { .pos-list-row:last-child {
border-bottom: none; border-bottom: none;
} }
.pos .form-section-heading { .form-section-heading {
padding: 0; padding: 0;
} }
.pos { .item-list {
overflow: hidden;
}
.pos .item-list {
border: 1px solid @border-color; border: 1px solid @border-color;
border-top: none; border-top: none;
max-height: ~"calc(100vh - 190px)"; max-height: ~"calc(100vh - 190px)";
@ -400,46 +347,51 @@ body[data-route="pos"] .modal-dialog {
} }
.price-info { .price-info {
width: 99%;
text-align: center;
position: absolute; position: absolute;
right: 0; left: 0;
bottom: 0; bottom: 0;
margin: 2px 1px 2px 2px; margin: 0 0 15px 15px;
background-color: rgba(162, 161, 161, 0.1); background-color: rgba(141, 153, 166, 0.6);
padding: 9px 15px; padding: 5px 9px;
border-radius: 3px;
color: #fff;
}
} }
}
.pos-bill-toolbar { .pos-bill-toolbar {
margin-top: 10px; margin-top: 10px;
} }
.pos .search-item .form-group { .search-item .form-group {
margin: 0; margin: 0;
} }
.item-list-area .pos-bill-header { .item-list-area .pos-bill-header {
padding: 5px; padding: 5px;
padding-left: 15px; padding-left: 15px;
} }
.pos-selected-item-action > .pos-list-row { .pos-selected-item-action > .pos-list-row {
border: none; border: none;
} }
.edit-customer-btn { .edit-customer-btn {
position: absolute; position: absolute;
right: 57px; right: 57px;
top: 15px; top: 15px;
z-index: 100; z-index: 100;
} }
.btn-more { .btn-more {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
background-color: @light-bg; background-color: @light-bg;
min-height: 200px; min-height: 200px;
}
.collapse-btn {
cursor: pointer;
}
} }