Appointments+ not working as shown in demo

Hello, I have just installed appointments+ on my scribe theme. Appointment page has some serious css issues. Buttons css is very bad and dropdown dont have border at all. Complete css looks messedup. Some one please help. This is my page http://www.lataushaj.com/make-an-appointment/

  • Nastia
    • Support Rock Star

    Hello @Kireeti, I hope you are well today!

    The interface of Appontments+ plugin, it's depending a lot from a theme installed on WordPress.

    You can add the following CSS code to improve the view of dropdown buttons:

    .app_services_dropdown_select select, .app_workers_dropdown_select select, .app_service_locations_dropdown select, .app_provider_locations_dropdown select {
    box-shadow: 0 1px 1px #b2b2b2, inset 0 -1px 2px #f9f9f9, 0 0 0 1px #9b9b9b;}
    
    button, html input[type=button], input[type=reset], input[type=submit] {
        box-shadow: 0 1px 1px #b2b2b2, inset 0 -1px 2px #f9f9f9, 0 0 0 1px #9b9b9b;
        padding: 5px;
        background: #f4f4f4;
        border-radius: 5px;}

    Please put the following code inside CSS editor, from your Upfront Edit mode -> Theme Settings -> Add custom CSS rules as it shown in the attached screenshot.

    If we can be of any further assistance, please, let us know!

    Cheers,
    Nastia

  • Kireeti
    • Flash Drive

    Thanks Nastia, That really worked well. But in the registration form, fields dont have borders. It will be hard to complete the form for visitors. Can we have borders please. Also is there a way we can change the font to lato

    Thank You

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Kireeti,

    Hope you are doing good today :slight_smile:

    The following code can help you achieve that effect (site wide) for your form fields (text, email and password).

    input[type="text"],
    input[type="email"],
    input[type="password"] {
      padding: 10px;
      border: solid 1px #dcdcdc;
      transition: box-shadow 0.3s, border 0.3s;
    }
    input[type="text"]:focus,
    input[type="email"].focus,
    input[type="password"].focus {
      border: solid 1px #707070;
      box-shadow: 0 0 5px 1px #969696;
    }

    Add this in custom CSS section of upfront as described by @Nastia above.

    For Lato font, yes this and lots of other free Google fonts are already included in upfront theme. You can chose them from Upfront Editor > Theme Settings > Typography > Theme fonts manager > Theme Text Fonts > Typeface as seen in attached screenshot.

    Take care and have a nice day :slight_smile:

    Kind Regards,
    Sajid J

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Kireeti,

    Hope you are doing good today :slight_smile:

    Please grant support staff access so I can take a closer look and make this change myself. To grant support staff access go to WPMUDEV > Support > Support Access > Grant Access or see this manual.

    Take care and have a nice day :slight_smile:

    Kind Regards,
    Sajid J

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Kireeti,

    Hope you are doing good today :slight_smile:

    Oh, I am sorry, I just realised that the code I posted above did not formatted well. It replaced all single quotes with ". Please try the below code instead and then check.

    input[type='text'],
    input[type='email'],
    input[type='password'] {
      padding: 10px;
      border: solid 1px #dcdcdc;
      transition: box-shadow 0.3s, border 0.3s;
    }
    input[type='text']:focus,
    input[type='mail']:focus,
    input[type='password']:focus {
      border: solid 1px #707070;
      box-shadow: 0 0 5px 1px #969696;
    }

    Thanks for granting support staff access, but I could not login because of constant error message of access token expires. Please revoke access and then grant again if its still not working.

    Please avoid duplicate replies in same thread. It will not push you up in the queue but will push you down. Because our system feeds us thread from oldest to newest. So instead of posting multiple replies just write one consolidated reply and wait for the answer, we will try our best to get back to you as soon as possible.

    Take care and have a nice day :slight_smile:

    Kind Regards,
    Sajid J

  • Kireeti
    • Flash Drive

    Hello Sajid, How ever lately i realized that the code is not formatted and i removed the quotes and it is now working fine. Thanks :slight_smile: Also if you can please help in changing the text of entire page to lato, That would help.

    Thanks,
    Kireeti

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Kireeti,

    Hope you are doing good today :slight_smile:

    I am glad to know you have figured it out.

    For font issue you can change it site wide from Upfront Editor > Theme Settings > Typography > Theme fonts manager > Theme Text Fonts > Typeface as described in my reply above. I have also included a screenshot as well.

    Please bear in mind that the font change will be for sitewide.

    I could do this change for you but I am still getting token expire error while using support staff access.

    Take care and have a nice day :slight_smile:

    Kind Regards,
    Sajid J

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.