Remove Outline Color

  • Resolved nyceone1

    (@nyceone1)


    5 years, 4 months ago

    I am having some issues with the style of the form fields.

    I would like to remove or change the blue and red color of the outline around the text and text-area form fields. When I place my cursor in the form field (focused), the outline color turns blue and then red when done typing. I would like to change that to grey in both instances. How would I do that?

    I used the outline feature because I did not like the gray background in the form fields without an outline. I prefer to have no color or white. Is it possible to change the spacity of the background to 0? And is is possible to change the color of the line when focused and when done typing (again, red and blue). How would I do that?

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Author GusRuss89

    (@gusruss89)

    Hi @nyceone1

    The colours are there to indicate to the user the state of the field. It makes the form feel more interactive, and helps them complete it efficiently.

    The red colour indicates that the field has an error. Either it’s required and you left it blank, or you entered text in the wrong format (e.g. an invalid email address). I would advise against trying to override this.

    The blue colour is just your theme’s primary colour. The premium version of the plugin allows you to change this to any colour you like. In your case, maybe you’d like to change it to a darker grey. You can test this feature out by clicking “Customize” on the admin bar from the page with the form on it.

    You can force the non-outlined field backgrounds to be transparent using this CSS. Add it under Appearance > Customize > Material Design Forms > Custom CSS.

    #cf7md-form .mdc-text-field,
#cf7md-form .mdc-select {
    background-color: transparent !important;
}

    Let me know if you have any other questions ??

    Thanks,
    Angus

Viewing 1 replies (of 1 total)
  • The topic ‘Remove Outline Color’ is closed to new replies.