Increase the size of the "Spinner"?

  • Profile Image
    dougwoelfle
    Asked on April 18, 2017 at 02:25 PM

    I want to use the spinner to do inventory....basically only the spinner on an iPhone (or mobile phone) screen.

     

    Can you help me increase the size so it would be very easy to do entries?

     

    Thanks

  • Profile Image
    Kiran
    Answered on April 18, 2017 at 04:03 PM

    I am not sure if I understand your query correctly. Do you mean to increase the size of the spinner only for mobile devices? 

    Please try injecting the following CSS code to the form to increase the width of the spinner. However, this code would display the increased width of the spinner both on desktop and mobile devices. If you want to display the increased width of the spinner only on mobile devices, you may add this code to the form inside the media query.

    .form-spinner {

      width: 100%;

    }

    #cid_25 div {

    width: 100% !important;

    }

    Thank you! 

  • Profile Image
    dougwoelfle
    Answered on April 18, 2017 at 06:44 PM
    How about the height?
    ...
  • Profile Image
    jonathan
    Answered on April 18, 2017 at 11:46 PM

    You can adjust the CSS codes to this

    .form-spinner {

      width: 100%;

    height : 30px !important;

    }

    #cid_25 div {

    width: 100% !important;

    }

    ---

    Example result: 

     

     

    Adjust the px number according to your preference.

    Let us know if you need further assistance.

     

     

     

  • Profile Image
    dougwoelfle
    Answered on April 19, 2017 at 10:27 AM

    Thank you!  Very helpful!

    Finally, how do I increase the size of the number, inside the Spinner?  

    This will make it easier to see by the user.

  • Profile Image
    Kiran
    Answered on April 19, 2017 at 12:18 PM

    Please add the following CSS code to the form to increase the font size of the number inside the spinner.

    #cid_25 {

    width: 70%;

    }

    #input_25 {

    font-size: 70px !important;

    }

    The spinner should be displaying on the form as shown below:

    Thanks!