Changing The Font With Macros

Deadshot

I know about the font macro, but that only has limited fonts it can use. I was wondering if I could import the font in the stylesheet, then integrate it with a macro, like this:

(font: 'Dancing Script, cursive;')

Is this right, or is what I'm asking impossible. I know I can just change the font in the stylesheets, but I want two different fonts in the same passage. If this is not possible, could you please give me a list of all the fonts you can do with the font macro, and I'll see if I like them.

I use Harlowe.

greyelf

Deadshot wrote: »

..but that only has limited fonts it can use.

The macro can use any font that your web-browser knows about, which is generally a limited sub-set of the fonts your operating system knows about. The macro is a very thin wrapper around the CSS font-family property.
eg.

The following macro call:

(font: 'Arial')[This text should appear in Arial font.]

is converted into the following HTM:

<tw-expression type="macro" name="font"></tw-expression>
<tw-hook style="font-family: Arial;">This text should appear in Arial font.</tw-hook>

... note the style="font-family: Arial;" part, this is standard CSS.

There are a number of ways you can extend the list of fonts a web-browser knows about, one of them is to use an import at-rule to reference a font stored at a site like google fonts, these rules would be added to to the start of your story's Story Stylesheet area.

The following adds information about the 'Yatra One' font to the web-browser:

@import 'https://fonts.googleapis.com/css?family=Yatra+One';

... and you could then use that font in a passage like so:

(font: 'Yatra One')[This text should appear in Yatra One font.]

Deadshot

greyelf wrote: »

Deadshot wrote: »

..but that only has limited fonts it can use.

The macro can use any font that your web-browser knows about, which is generally a limited sub-set of the fonts your operating system knows about. The macro is a very thin wrapper around the CSS font-family property.
eg.

The following macro call:

(font: 'Arial')[This text should appear in Arial font.]

is converted into the following HTM:

<tw-expression type="macro" name="font"></tw-expression>
<tw-hook style="font-family: Arial;">This text should appear in Arial font.</tw-hook>

... note the style="font-family: Arial;" part, this is standard CSS.

There are a number of ways you can extend the list of fonts a web-browser knows about, one of them is to use an import at-rule to reference a font stored at a site like google fonts, these rules would be added to to the start of your story's Story Stylesheet area.

The following adds information about the 'Yatra One' font to the web-browser:

@import 'https://fonts.googleapis.com/css?family=Yatra+One';

... and you could then use that font in a passage like so:

(font: 'Yatra One')[This text should appear in Yatra One font.]

Thanks! Again, I think I said this somewhere else, you should really write a twine book!

Deadshot

greyelf wrote: »

Deadshot wrote: »

..but that only has limited fonts it can use.

The macro can use any font that your web-browser knows about, which is generally a limited sub-set of the fonts your operating system knows about. The macro is a very thin wrapper around the CSS font-family property.
eg.

The following macro call:

(font: 'Arial')[This text should appear in Arial font.]

is converted into the following HTM:

<tw-expression type="macro" name="font"></tw-expression>
<tw-hook style="font-family: Arial;">This text should appear in Arial font.</tw-hook>

... note the style="font-family: Arial;" part, this is standard CSS.

There are a number of ways you can extend the list of fonts a web-browser knows about, one of them is to use an import at-rule to reference a font stored at a site like google fonts, these rules would be added to to the start of your story's Story Stylesheet area.

The following adds information about the 'Yatra One' font to the web-browser:

@import 'https://fonts.googleapis.com/css?family=Yatra+One';

... and you could then use that font in a passage like so:

(font: 'Yatra One')[This text should appear in Yatra One font.]

For some reason I can't accept this answer. It doesn't give me the option...