How to adjust the font size on the time picker widget?

  • Profile Image
    lritter
    Asked on April 16, 2018 at 03:34 PM

    How to adjust the font size on the time. I need help with the CSS for the font size, widget, etc. When I look at the Preview, the time 'runs off' and you can't see the minutes.

    15239073842222.png

  • Profile Image
    Jan
    Answered on April 16, 2018 at 04:43 PM

    I suggest you create a separate row for each Time Picker widget. It is because that the elements inside this widget are using Tables instead of regular div elements.

    You can unshrink these widgets and move them to next line. After that, please go to Properties and change the width. Here's an example:

    152390840704-17-uj5hh.png

    If you want to change the font-size and the font-color, please insert this CSS code inside the widget:

    .form-control {
    color: red;
    font-size: 18px;
    }

    .form-control.bfh-number {
    color: red;
    font-size: 18px;
    }

    Here's the result:

    152390894404-17-fkioj.png

    If you still want it to be in 2 columns, then I recommend you to increase the width of the whole form and then adjust the width of the Time Picker widget on the Properties.

    Hope that helps. Thank you.

  • Profile Image
    lritter
    Answered on April 17, 2018 at 11:04 AM

    Yes! This helps a lot. Thank you!