diff options
Diffstat (limited to 'src/components/Form')
-rw-r--r-- | src/components/Form/AddNewItemForm.js | 22 | ||||
-rw-r--r-- | src/components/Form/Form.css | 11 | ||||
-rw-r--r-- | src/components/Form/Form.scss | 13 |
3 files changed, 35 insertions, 11 deletions
diff --git a/src/components/Form/AddNewItemForm.js b/src/components/Form/AddNewItemForm.js index 07b3092..09536b1 100644 --- a/src/components/Form/AddNewItemForm.js +++ b/src/components/Form/AddNewItemForm.js @@ -25,15 +25,15 @@ const AddNewItemForm = (props) => { // set description and price // when item is entered const setItemInfo = (itemName) => { - for (let i = 0; i <= props.savedItems.length - 1; i++) { - const mod = props.savedItems[i].Model.toLowerCase(); - const desc = props.savedItems[i].Description; - const price = props.savedItems[i].Price; + for (let i = 0; i < props.savedItems.length - 1; i++) { + const mod = props.savedItems[i].Model.toLowerCase(); + const desc = props.savedItems[i].Description; + const price = props.savedItems[i].Price; - if (mod === itemName) { - setItemDescValue(desc); - setItemPriceValue(price); - break; + if (mod === itemName) { + setItemDescValue(desc); + setItemPriceValue(price); + break; } } } @@ -56,7 +56,7 @@ const AddNewItemForm = (props) => { "Model": itemNameValue, "Description": itemDescValue, "Quantity": parseInt(itemQtyValue), - "Price": parseInt(itemPriceValue), + "Price": parseFloat(itemPriceValue), "Discount": parseInt(itemDiscountValue), "GST": parseInt(itemGSTValue) }; @@ -105,7 +105,7 @@ const AddNewItemForm = (props) => { </label> <label> - Price: <input type="number" min="1" value={itemPriceValue} onChange={ + Price: <input type="number" min="1.00" step="0.001" value={itemPriceValue} onChange={ (event) => { const value = event.target.value; setItemPriceValue(value); @@ -114,7 +114,7 @@ const AddNewItemForm = (props) => { </label> <label> - Discount: <input type="number" min="0" value={itemDiscountValue} onChange={ + Discount: <input type="number" min="0" step="0.001" value={itemDiscountValue} onChange={ (event) => { const value = event.target.value; setItemDiscountValue(value); diff --git a/src/components/Form/Form.css b/src/components/Form/Form.css index 9d46f62..cf9bc60 100644 --- a/src/components/Form/Form.css +++ b/src/components/Form/Form.css @@ -64,6 +64,17 @@ label { scrollbar-width: none; /* Firefox */ } +/* hide arrows in numericInputs */ +/* Chrome, Safari, Edge, Opera */ +input::-webkit-outer-spin-button, +input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; } + +/* Firefox */ +input[type=number] { + -moz-appearance: textfield; } + .addNewItemForm label { display: flex; justify-content: space-between; diff --git a/src/components/Form/Form.scss b/src/components/Form/Form.scss index 74a5252..b11c9ab 100644 --- a/src/components/Form/Form.scss +++ b/src/components/Form/Form.scss @@ -61,6 +61,19 @@ label { scrollbar-width: none; /* Firefox */ } +/* hide arrows in numericInputs */ +/* Chrome, Safari, Edge, Opera */ +input::-webkit-outer-spin-button, +input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; +} + +/* Firefox */ +input[type=number] { + -moz-appearance: textfield; +} + .addNewItemForm label { display: flex; justify-content: space-between; |