Increase the size of the "Spinner"?

  • dougwoelfle
    Asked on April 18, 2017 at 2: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

  • Kiran Support Team Lead
    Replied on April 18, 2017 at 4: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! 

  • dougwoelfle
    Replied on April 18, 2017 at 6:44 PM
    How about the height?
    ...
  • jonathan
    Replied 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: 

    Increase the size of the Spinner? Image 1 Screenshot 20

     

     

    Adjust the px number according to your preference.

    Let us know if you need further assistance.

     

     

     

  • dougwoelfle
    Replied 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.

  • Kiran Support Team Lead
    Replied 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:

    Increase the size of the Spinner? Image 1 Screenshot 20

    Thanks!