[TW5] Bug (?) with input box theme when using Firefox on OS X

[Hiru Yoru]

Hi,

With TW5, the theme shows differently in Safari than in Firefox. This is the case both with the TiddlyWiki.com website and with the empty TW5 downloads. I'm not sure if this is a bug, but it does seem like one because I would think the theme is supposed to show up the same across any browser (ideally, anyway). Because this can be 'fixed' by adding a Stylesheet and theming the input boxes manually, I know it can be done. I did do a search for this issue but it didn't come up when I searched, so I wanted to add this just in case it wasn't noticed. 

I've attached a screenshot of the different theme appearances in Safari vs. Firefox on OS X.

I hope this is helpful!

~Hiru

P.S. - To those who are curious, here's the theme alterations I used to correct this issue (at first, I had trouble making themes with TW5, so I wanted to include this for those who feel as lost as I did):

1. Create a new tiddler -- name it whatever you want.

2. Give it the tag "$:/tags/Stylesheet" (without the quotes) in the area right below the tiddler title.

3. Below the text area for the tiddler's content, change the type to "text/css"

4. Enter the CSS code below into the tiddler's content (these are example styles, you can change the border style, thickness, and color as you wish -- they don't need to be the same):

/* For all input boxes */

input {

   border: 1px solid #aaa;

}

/* For the search box, specifically */

.tc-search input {

   border: 1px solid #aaa;

}

5. Save the tiddler.

[Jed Carty]

I think that, like buttons and select widgets, the generic text input fields don't have a default style set by tiddlywiki so they just go for the browser default. Someone had briefly mentioned adding some css to make the defaults consistent across browsers but nothing has been done yet. At this point because of backwards compatibility reasons it may never be put into the core.

[Hiru Yoru]

Alright, thanks for the reply -- that's good to know.

[PMario]

On Friday, August 7, 2015 at 3:12:41 AM UTC+2, Jed Carty wrote:

I think that, like buttons and select widgets, the generic text input fields don't have a default style set by tiddlywiki so they just go for the browser default. Someone had briefly mentioned adding some css to make the defaults consistent across browsers but nothing has been done yet. At this point because of backwards compatibility reasons it may never be put into the core.

I'm not sure about this.
IMO its just, that nobody was annoyed enough, to test it with every possible browser, prove that it has no side effects on any browser.

Someone may prove that there is no backwards compatibility problem and create a pull request. ... but first have a look at the existing issues, if there is already a discussion.

-mario

[Jeremy Ruston]

Hi Hiru

The core uses normalize.css to reset the browser stylesheet to a good baseline:

https://necolas.github.io/normalize.css/

Otherwise, the core styles try to avoid global restyling of basic controls like input, textarea and buttons. A particular goal is to ensure that browsers render their platform-specific button styles.

In this particular case, it looks like the problem is that one of the styles that we apply is causing Firefox to flip to a custom rendering for the text box. I'd accept a pull request to fix it. The fix that you suggested wouldn't quite work because it doesn't use the palette correctly. See how colours are set in the base theme with the <<colour>> macro:

https://github.com/Jermolene/TiddlyWiki5/blob/master/themes/tiddlywiki/vanilla/base.tid#L126-L127

Best wishes

Jeremy.

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/b7856ec5-3aec-461d-8c8d-875db8ae5099%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--

Jeremy Ruston
mailto:jeremy...@gmail.com