Update cart ui from cur_frm, Add number pad
diff --git a/erpnext/public/css/pos.css b/erpnext/public/css/pos.css
index 399613d..de1e097 100644
--- a/erpnext/public/css/pos.css
+++ b/erpnext/public/css/pos.css
@@ -23,6 +23,9 @@
   width: 40%;
   margin-left: 15px;
 }
+.cart-wrapper {
+  margin-bottom: 10px;
+}
 .cart-wrapper .list-item__content:not(:first-child) {
   justify-content: flex-end;
 }
@@ -30,6 +33,10 @@
   height: 200px;
   overflow: auto;
 }
+.cart-items input {
+  height: 22px;
+  font-size: 12px;
+}
 .fields {
   display: flex;
 }
@@ -63,3 +70,38 @@
   left: 50%;
   transform: translate(-50%, -50%);
 }
+@keyframes yellow-fade {
+  0% {
+    background-color: #fffce7;
+  }
+  100% {
+    background-color: transparent;
+  }
+}
+.highlight {
+  animation: yellow-fade 1s ease-in 1;
+}
+input[type=number]::-webkit-inner-spin-button,
+input[type=number]::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+.number-pad {
+  border-collapse: collapse;
+  cursor: pointer;
+  display: table;
+  margin: auto;
+}
+.num-row {
+  display: table-row;
+}
+.num-col {
+  display: table-cell;
+  border: 1px solid #d1d8dd;
+}
+.num-col > div {
+  width: 50px;
+  height: 50px;
+  text-align: center;
+  line-height: 50px;
+}
diff --git a/erpnext/public/less/pos.less b/erpnext/public/less/pos.less
index 9358f0a..de16514 100644
--- a/erpnext/public/less/pos.less
+++ b/erpnext/public/less/pos.less
@@ -35,6 +35,7 @@
 }
 
 .cart-wrapper {
+	margin-bottom: 10px;
 	.list-item__content:not(:first-child) {
 		justify-content: flex-end;
 	}
@@ -43,6 +44,11 @@
 .cart-items {
 	height: 200px;
 	overflow: auto;
+
+	input {
+		height: 22px;
+		font-size: @text-medium;
+	}
 }
 
 .fields {
@@ -84,4 +90,42 @@
 		left: 50%;
 		transform: translate(-50%, -50%);
 	}
+}
+
+@keyframes yellow-fade {
+	0% {background-color: @light-yellow;}
+	100% {background-color: transparent;}
+}
+
+.highlight {
+	animation: yellow-fade 1s ease-in 1;
+}
+
+input[type=number]::-webkit-inner-spin-button,
+input[type=number]::-webkit-outer-spin-button {
+	-webkit-appearance: none;
+	margin: 0;
+}
+
+// number pad
+
+.number-pad {
+	border-collapse: collapse;
+	cursor: pointer;
+	display: table;
+	margin: auto;
+}
+.num-row {
+	display: table-row;
+}
+.num-col {
+	display: table-cell;
+	border: 1px solid @border-color;
+
+	& > div {
+		width: 50px;
+		height: 50px;
+		text-align: center;
+		line-height: 50px;
+	}
 }
\ No newline at end of file