An author's reference for Bisquixe, a tool for adding audiovisual content to Inform projects (up: final (?) comments on Cloak of Darkness)

Creating custom classes for inline styling

So far, this reference has only discussed CSS styling at the window level, and those features are enough to customize appearance on a per-game basis. They are applied as rules during activities and action processing. Specifying properties in this way is a powerful tool, and many more examples of this power are provided later in this reference.

It is possible to apply styling at a more granular level. In fact, an author can apply styling per passage, sentence, word, and even character! This is accomplished via Inform’s built-in capacity for text substitution.

To do so, we must first define custom classes. Their names must be words without spaces, but the details are up to the author. A class for printing a large font might be called “large”.

to say large text:
	set-any-class "large";

This is accomplished via a simple to say definition.

The stated name of this substitution is “large text.” We can invoke it in any printed text. For instance:

instead of jumping:
	say "[large text]This is large text.[roman type]";

This text will not be modified, though, because we have not yet applied any properties to our new class.

A new class defined by set-any-class "large" is specified as .Style_large. This new class is case-sensitive, just as all others are.

Since it will be used as a text substitution, it will not be applied until it is invoked as something said. However, it must be added to the project as a css-set-fast phrase before it can be substituted. These are best established at the start of play.

css-set-fast phrases invoking these new classes have no other effect. They only serve to prepare a game for subsequent text substitutions.

when play begins:
	follow the large text rule;

this is the large text rule:
	css-set-fast ".Style_large; font-size; 30px";

This is all that is required for our text to display as desired.

	say "[large text]This is large text.[roman type]";

Note the use of the [roman type] substitution at the end of the text. From there on, any printed text will appear as styled within the .BufferWindow class, returning to the configured defaults for its game.

2 Likes