Using Style Settings

Any style consists of style settings describing all the visual details used for exporting a document. Typically, style settings consists of simple values - like assigning a setting font-weight the value bold

inline-strong {
  font-weight: bold;
}

Types

Every style setting has a type that defines the valid values you may use for it. The type of each settings is documented in the Settings Reference. Currently, the following types exists:

Type name Examples Description
boolean YES, NO, true, false A boolean value indicating that a setting is true or false. Allowed values are case-insenstive variants of: YES, NO and TRUE, FALSE. Whereas there is no difference between YES and true, or NO and false.
number -3.141 A decimal number. Negative or positive values are possible. The decimal point is optional.
length 5pt, 10cm, 30%, 4em An absolute or relative length value. Absolute values can be specified in pt, mm, cm, in. Relative values are typically relative to the current font size. They can be specified in em, en, ex, %.
string "Arial" A string value. Must be set into quotes. May contain also whitespaces. Used for any user-defined string values (e.g. font names or placeholder strings).
symbol bold, italic A symbolic setting. Possible values depend on the concrete style setting.
color #ff0000, rgb(255,0,0) An RGB color value. Can be either specified as 8-digit hex (#ff0000) or as sequence of three decimal numbers between 0 and 255 (rgb(255,0,42).
array [5pt, 3pt, 2pt] An array of values. Typically the elements of an array must have a certain type, too (e.g. an array of length values or symbols).

Expressions

Ulysses Style Sheets allow you to use more complex expressions, employing arithmetic operators (+, -, *, /) and even variables containing present values. In the following example a variable $base-size is defined that is used as base value for styling heading1 and heading2.

$base-size = 12pt

heading-1 {
     font-size: $base-size * 2
}

heading-2 {
	font-size: $base-size * 0.5
}

Variables

Variable names begin with a dollar sign “$“ and consists of any alphanumeric characters and dashes. They are declared by assignment statements using the form $variable-name = VALUE. Whereas variable values may contain arbitrary expressions and variables themselves. For example, you may create a variable $heading-size that is calculated from the value of $base-size:

$base-size = 12pt
$heading-size = $base-size * 2

Operators

In general, any expression may contain arithmetic operators (+, -, *, /) that combine values and variables. To group expressions it is possible to use round brackets:

$some-variable = 4 * (5 / (2 + 3))

However, not every type supports any kind of operator. The following table shows you all possible combinations:

Left Operand Type Right Operand Type Allowed operation
Number Number +, -, *, /
Length Number *, /
Number Length *
Color Number *, /
Number Color *
Length Length +, -
Color Color +, -