Since the update to Ubuntu 18.04 I use the dark theme 'Adwaita-dark' and have several input fields in Firefox there are not usable. The background and the color of the font is dark, similar colors. It would not be set a alternate theme, like the light theme of Adwaita that mentioned in this q/a. I search for an solution that leave the dark theme about all applications.
How is it possible to fix theme to use the input fields, see the strings to input the right content?
The screenshot below in Google Drive should illustrate the problem on the title field on left side, right from the 'doc' icon.
I fix them for me with a custom stylesheet for Firefox. Leave a custom style with the name userContent.css
in the directory ~/.mozilla/firefox/<custom-key>.default/chrome/
. You should also add the directory chrome
, important with lowercase. Use the css code below to fix them for different input fields. The result is like the image below.
If you have trouble to find your folder for leave this stylesheet read this answer.
Copy the follow source to the custom stylesheet file userContent.css
.
input {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
textarea {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
select {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
input[type="radio"],
input[type="checkbox"] {
border: 2px inset white !important;
background-color: white !important;
color: ThreeDFace !important;
-moz-appearance: none !important;
}
*|*::-moz-radio {
background-color: white;
-moz-appearance: none !important;
}
button,
input[type="reset"],
input[type="button"],
input[type="submit"] {
border: 2px outset white;
background-color: #eee;
color: black;
-moz-appearance: none !important;
}
body {
background-color: white;
color: black;
display: block;
margin: 8px;
-moz-appearance: none !important;
}
If you face any problem on radio button or checkbox, after adding this CSS file, just remove -moz-appearance: none !important
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments