• Resolved Chuck Balogh

    (@chuckbalogh)


    On my contact form, it is almost impossible to see the dialog box outline. What parameter controls the thickness and size of these boxes? How can I make them darker.

    Thanks

Viewing 11 replies - 1 through 11 (of 11 total)
  • Hello @chuckbalogh,

    Please try to use the following CSS code.

    You can add CSS code in DashboardAppearanceCustomizeAdditional CSS (WordPress 4.7 and up). Also you can add CSS code directly to style.css file of your child theme.

    input[type="text"],
    input[type="email"],
    input[type="url"],
    input[type="password"],
    input[type="search"],
    input[type="tel"],
    textarea {
        border-color: #666 !important;
    }

    Kind Regards, Roman.

    Thread Starter Chuck Balogh

    (@chuckbalogh)

    Thanks Roman. I added this on the Additional CSS page — see below

    /*
    input[type=”text”],
    input[type=”email”],
    input[type=”url”],
    input[type=”password”],
    input[type=”search”],
    input[type=”tel”],
    textarea {
    border-color: #666 !important;
    }
    */

    and it didn’t change the borders. I am not using Child themes so that was not an option.
    I am curious as to why those particular input field types are used/needed. My contact page has name, email, phone and message fields. Also, how does the code know that the above code applies to my contact page?
    Thank you.

    Hello @chuckbalogh,

    1. You shouldn’t wrap the code into /* */ because it will be considered comment and won’t work.

    2. That selector is used in stylesheet to color those borders, so I used it to override that CSS rule.

    You can learn more about CSS here:
    https://www.w3schools.com/css/

    Kind Regards, Roman.

    Thread Starter Chuck Balogh

    (@chuckbalogh)

    At times you must just smile and shake your head. My adding the code as a comment had to be one of those times I’d guess.

    THANK YOU. It looks great now.

    Thanks for pointing me to the CSS 3schools link. I will read it. I would really like to know why the code you provided is the way it is. I think what I understood you to say is that you just simply reused code that you knew worked. I then suspect that there is more there than I realy needed. Is this at least on track?

    If the theme gets updated will I have to worry about this changing?

    Hello @chuckbalogh,

    I reused that selector because most likely it will eliminate issues when you add other form that will have different set of input fields.

    If you added that CSS code into Additional CSS section or child theme stylesheet, then you shouldn’t worry ??

    Please remember about importance of regular full site backups (files and database):
    https://codex.www.ads-software.com/WordPress_Backups

    Also you might want to check this tutorial:
    https://www.wpbeginner.com/wp-tutorials/how-to-create-staging-environment-for-a-wordpress-site/

    Kind Regards, Roman.

    Thread Starter Chuck Balogh

    (@chuckbalogh)

    OK, thank you. I will read the tutorials.
    I have switched to a different Theme (Karuna) and I had the same “hard to see” border issue so I copied the Additional CSS over to the new theme but it is not working completely. Only the Message box border is different (darker). The name and email borders are unchanged. I inspected the Contact form element and confirmed that the Input types are “text” and “email”. Any idea? This CSS “fix” should work on any theme correct?

    Thank you

    Hello @chuckbalogh,

    Please contact Karuna support regarding this.

    Kind Regards, Roman.

    That CSS is for Astrid theme, it will work in other theme only by accident ??

    Feel free to create a new topic if you get back to Astrid ??

    Thread Starter Chuck Balogh

    (@chuckbalogh)

    Ahhh, OK. Learning so much about this subject and how to navigate forums from you. Thank you.

    Best regards,

    You are welcome @chuckbalogh! And have a nice day ??

    Kind Regards, Roman.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Dialog Box Outline Too Light’ is closed to new replies.