Hi Matthew and Eric,
It might be tempting to add your own classes to core tiddlers – but in most cases, if you know enough about CSS, it is not necessary and I would advise against it.
Here’s a solution I used some time ago (before I made
Simple Search) to tune my search fields:
textarea, input[type="text"], input[type="search"], input[type=""], input:not([type]) { padding-left: 0.2em; padding-bottom: 0.175em; -webkit-appearance: none; -moz-appearance: none; }
.tc-sidebar-lists .tc-search { margin-top: 40px; margin-bottom: 20px; position: relative; z-index: 10; }
.tc-search input[type="search"] { border: 2px inset black; box-sizing: border-box; margin: 0; }
.tc-search input[type="search"]:focus { border: 2px inset red; box-sizing: border-box; margin: 0; }
Note the two last lines, they demonstrate how to address the search field in the sidebar AND in the advanced search at the same time.
The very last line shows how to change the border color when the field has the focus.
The first line in the code adds some spacing between borders and content of most fields in TW and probably makes sure mobile browsers do not apply their own styles. I don’t know if this is still necessary.
The second line adds some whitespace above and below the search field in the sidebar, just a matter of taste I guess.
Have fun,
Thomas