When widget and theme do not get along

When widget Input text color same as background

Not all theme works well with 3rd parties plugin widget. Text and background color might be the same and difficult to read.

Invisible text and cursor

Text input and cursor has same color as background

Finished input

Default text blended into bacground

Below CSS code will help to address the visibility issue.

footer .widget-item #s:focus,
#footer.dark-style .widget-item input[type=email]:focus,
#footer.dark-style .widget-item input[type=text]:focus,
#footer.dark-style .widget-item textarea:focus {
color: #0c0c0c;
}

input[type=text], textarea, input[type=email], input[type=password], input[type=tel], input[type=url], input[type=date], input[type=search], select {
background-color: rgba(226, 226, 226, 0.99);
}

After CSS applied

Cursor and all text are shown

Result

All text are visible

Add this to your site “Custom CSS” box in theme options.

%d bloggers like this: