Change font size and colour of appointment slot and font colour of sublabel

  • Profile Image
    viennefwd
    Asked on October 21, 2020 at 06:04 AM

    Hi there,

    I would like to change the font size and colour of appointment slot as it's now wider than others. I would also like to change the colour of sublabel. Shall I input some CSS code?

    Thanks,
    Vienne


  • Profile Image
    Ariel_P
    Answered on October 21, 2020 at 10:06 AM

    Greetings,

    Thank you for reaching out to us.

    Try injecting the following CSS code into the Weekly Appointment Planner widget:

    .list-item label {
        color: #008000;
        font-size: 13px;
    }

    Once applied, it should look something like so.

    16032883162020-10-21 21_51_23.jpg

    Related Guide: How to Inject CSS Codes to Widgets.

    For the sub labels, you can inject this code into your form's CSS:

    .form-sub-label {
        color: #008000;
    }

    The rule above will have the following effect.

    16032888082020-10-21 21_59_38.jpg

    Related Guide: How to Inject Custom CSS Codes.

    Fine tune the style by changing the value of a property to your liking.

    Here's a Color Picker in case you need one for the hex color code.

    Let us know if you have any questions or if you need further assistance.