<!-- CUSTOM QUANTITY BUTTONS -->
<style>
/* remove form styles & set margin at 0 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
input[type="number"] {
-moz-appearance: textfield;
}
</style>
With Code Comments:
<!-- CUSTOM QUANTITY BUTTONS -->
<script src="https://cdn.jsdelivr.net/gh/CodeCrumbsApp/quantity-buttons@v0.1.4/index.min.js"></script>
<script>
window.CodeCrumbs.QuantityButtons({
quantityGroupClass: 'q-group',
quantityIncrementButtonClass: 'q-inc',
quantityDecrementButtonClass: 'q-dec',
quantityNumberFieldClass: 'q-num',
disableDecrementAtOne: true,
})
</script>
Quickly copy and paste the code crumbs into your project. If you are not familiar with how this snippet works then click the button below to view the full snippet page.