Hi folks,
First some info, why things are, as they are ...
Styling a TiddlyWiki can be "quite tricky". IMO this has several reasons:
a) TiddlyWiki style origins date back prior to 2004
b) TiddlyWiki lets the end user change styles with the StyleSheet tiddler.
c) TiddlyWiki has "shadow tiddlers"
d) TiddlyWiki lets plugin authors activate plugin specific stylesheets.
add a) TiddlyWiki age [1]
CSS styling "best practices" has changed quite a lot in the last decade ;)
TW styling has grown over time and probably adopted some "bad habit".
add b: User specific styling
As TWc was created IMO there were not many sites that did offer the enduser
a possibility to modify the UI styles. I think there haven't been many
theme selectors in a "pre jQuery UI age" at all :)
So the easiest way to let the user change default settings is, to offer the
possibility to overwrite existing styles. Since with TW styles are tiddlers
it is:
-> Edit the StyleSheet tiddler!
add c: Shadow Tiddlers
If the user messes up eg: the styling, the easiest way to get the default
back is to delete/rename the tiddler, so the "shadow tiddler" aka "default
setting" can take over again. IMO the "shadow tiddler" mechanism is a nice
way to have a "security net". It introduces some complexity, but if you are
used to it, you don't want to miss it.
add d) plugin specific styling
There are some well defined functions, that let plugin authors include
StyleSheets, but not every author knows or uses them.
The high level version:
- config.shadowTiddlers["StyleSheetXXXYYY"] = ...
in combination with
- store.addNotification("StyleSheetXXXYYY", refreshStyles) see: example [4]
The first command creates a "shadow" stylesheet tiddler, that a user can
overwrite if s/he wants to change something.
The second command tells the TW core to use it and take care of refresh
handling, if the user changes the style sheet tiddler. So changes don't
need a page reload.
The low level version: "setStyleSheet()" - imo should not be used because
the end user needs to modify the plugin to change something. If the plugin
author uses this mechanism imo it isn't user friendly. Or the author just
don't know the "high level" mechanism.
-----------------------
About the style sheet activation mechanism.
IMO the core refresh mechanism is defined in the Refresh.js file. [5]
function refreshAll()
{
refreshPageTemplate();
refreshDisplay();
refreshStyles("StyleSheetLayout");
refreshStyles("StyleSheetColors");
refreshStyles(config.refresherData.styleSheet);
refreshStyles("StyleSheetPrint");
}
The config.refresherData.styleSheet variable defaults to "StyleSheet" :)
... So you know why you should use StyleSheet tiddler to add user changes
\o/
If you use themes this may be a different value. eg: MyThemeTiddler
##StyleSheet
MyThemeTiddler ... should contain
....
! StyleSheet
.theme_Specific_Styles_that_are_removed_with_the_theme {}
[[StyleSheet]]
So if the theme author is nice, they will include [[StyleSeet]] as there
last command. So the theme also activates the user StyleSheet tiddler.
The end user doesn't need to know about theme handling. S/he only needs to
know, that s/he can adjust styles with the StyleSheet tiddler. If the theme
author didn't design the theme that way, the last command may be missing. :/
-> You should tell the author about it ... no feedback ... no improvement!
-------------
About plugin styles:
IMO plugins allways should come with there own eg: StyleSheetMyPlugin it
they introduce new DOM elements.
because:
- The plugin creates a shadow tiddler, that can be overwritten by the user
- So the user has the final decision!
- If the user doesn't care there are nice defaults.
- If the plugin is removed, there will be no shadow
- User defined StyleSeet's will be kept until the user deletes them
- The user has the finial decision!
IMO users should allways change StyleSheetMyPlugin tiddler, if there is one
- The author took the time to create it and hopefully there is some
documentation about it
- If you mess it up, just delete it, to get the defaults back.
Plugins should _never ever_ overwrite user defined stuff and most plugins I
know .. don't.
IMO plugins should not use "setStyleSeet()" because it makes things
complicated.
-> If you find plugins that work that way, you should tell the author, that
you want to change the StyleSheet tiddler. S/he may add it. If you don't
tell them .... nothing will change.
I hope this clarifys some questions
have fun!
mario
PS: It is very, very, very, very ... unlikely that TWc will change it's
style sheet handling because of compatibility reasons. There are hundreds
of plugins that rely on the existing mechanism.
PPS: If you interested in the core theme handling you can start at:
Story.js [6]. Only recomended for geeks ;)
[1] http://tiddlywiki.com/archive/
[2] https://github.com/TiddlyWiki/tiddlywiki/blob/master/js/main.js#L44
[3] setStyleSheet /js/Dom.js
[4] http://neui-tagsearch.tiddlyspace.com/#NeuiEmTagSearchAddOn
[5] https://github.com/TiddlyWiki/tiddlywiki/blob/master/js/Refresh.js#L177
[6] https://github.com/TiddlyWiki/tiddlywiki/blob/master/js/Story.js#L649
--
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 [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/groups/opt_out.
