Font sizing in FT


#1

Continuing the discussion from Can’t change font in FoldingText:

Is there a way to change the font size as well? The Atom command (View->Increase Font Size) doesn’t apply to FoldingText documents. Further, when I add font-size: 20px; to the CSS code above, it only styles regular text, not headings; and the disclosure triangles and bullets seem to get off center as well.


#2

You can see the exact style rules that FoldingText for Atom is using here:

And really most of what you are interested in is probably here:

FoldingText for Atom uses LESS to define styles. That allows you to use variables and some other neat features. For example if you search through FoldingText’s styles you’ll see @ft-font-size used in a few different places.

LESS is designed so that it’s easy to override variables… unfortunately Atom’s user style sheet doesn’t currently get mixed into LESS files… the result being that you can just define a new value for @ft-font-size in your user style sheet :frowning: Someday hopefully.

In the meantime your options are:

  1. When just messing around you could did into FoldingText’s package on your machine and change @ft-font-size. Then reload Atom to see the results.

  2. Or look through those files to see everywhere that @ft-font-size is used and manually override each of those places with your own value. So in the case of fine size I think that would be:

@customSize: 20px;

ft-outline-editor {
  font-size: @customSize;
}

.ft-handle {
  font-size: @customSize;
}

.ft-badges {
  font-size: @customSize;
}

#3

As of FoldingText 0.3.0 all outline sizes use em units. This means it’s much simpler to scale up/down the outline view, you only need to change the outlines default font size like this:

ft-outline-editor {
  font-size: 14px;
}