Stylesheets for using TW on a 4K-Display (and larger)

I am using TW in my lessons at a school and I am trying to enhance its capabilities as a classroomscreen
Now we finally got new state-of-the-art classroom-displays with a tremendous resolution and touch… which is a challenge for the normal TW-style-sheet because the normal font-size is to small there.
Pinch-Zoom is no real alternative because it makes it wobbly to to work with TW.

It is necessary to have a way to adapt all font-sizes at the same time - either with a dedicated stylesheet or with a slider or both.

Are there any well working examples for that scenario?


Give this a try:

Provides a range slider and CSS to set the font-size between 50% and 200%.

Note: In order for the Zoom stylesheet to display its range slider control, you will also need to copy $:/config/ViewTemplateBodyFilters/body-template. This adds a ViewTemplate cascade definition that permits the Zoom stylesheet to use a body-template custom field to override the TWCore rendering for stylesheets (which only shows “plain text” by default) so that it can display the wikitext range slider control.


Updated TiddlyTools/Stylesheet/Zoom:

  • set font-size for .tc-tiddler-body and .tc-tiddler-edit-frame
  • fixed range slider loss-of-focus bug
1 Like

You could try the settings in the ControlPanel → Appearence → Theme Tweeks tab | and experiment with the “Font size” and “Line height” settings. … There are 4 settings you can adjust.

Let us know if that works.


Updated TiddlyTools/Stylesheet/Zoom:

  • added $keyboard widget “escape”=reset to 100%

Thank you @EricShulman, @pmario ,
especially Eric’s stylesheet adds an indispensible feature, yet I am missing two things.

  • Eric’s slider would have to keep its size. At the moment it also adapts to the new font-size which makes it hard to enter the exact value.
  • On the other hand, it would be good to have settings for different devices that work well from the start. (I guess having these new boards, I won’t carry my notebook every day, and parallely the students will use their cellphones to read the wikis there. It would be good I there was no necessity to change the font-size as first action).

So there should be a @media screen and (min-width: 1800px)stylesheet that works right when I start that can be overriden with a slider.

And I guess this is so important, that this should be in the core.