+### `style[<name>;<prop1>;<prop2>;...]`
+
+* Set the style for the named element `name`.
+* Note: this **must** be before the element is defined.
+* See [Styling Formspecs].
+
+
+### `style_type[<type>;<prop1>;<prop2>;...]`
+
+* Sets the style for all elements of type `type` which appear after this element.
+* See [Styling Formspecs].
+
+Migrating to Real Coordinates
+-----------------------------
+
+In the old system, positions included padding and spacing. Padding is a gap between
+the formspec window edges and content, and spacing is the gaps between items. For
+example, two `1x1` elements at `0,0` and `1,1` would have a spacing of `5/4` between them,
+and a padding of `3/8` from the formspec edge. It may be easiest to recreate old layouts
+in the new coordinate system from scratch.
+
+To recreate an old layout with padding, you'll need to pass the positions and sizes
+through the following formula to re-introduce padding:
+
+```
+pos = (oldpos + 1)*spacing + padding
+where
+ padding = 3/8
+ spacing = 5/4
+```
+
+You'll need to change the `size[]` tag like this:
+
+```
+size = (oldsize-1)*spacing + padding*2 + 1
+```
+
+A few elements had random offsets in the old system. Here is a table which shows these
+offsets when migrating:
+
+| Element | Position | Size | Notes
+|---------|------------|---------|-------
+| box | +0.3, +0.1 | 0, -0.4 |
+| button | | | Buttons now support height, so set h = 2 * 15/13 * 0.35, and reposition if h ~= 15/13 * 0.35 before
+| list | | | Spacing is now 0.25 for both directions, meaning lists will be taller in height
+| label | 0, +0.3 | | The first line of text is now positioned centered exactly at the position specified
+
+Styling Formspecs
+-----------------
+
+Formspec elements can be themed using the style elements:
+
+ style[<name>;<prop1>;<prop2>;...]
+ style_type[<type>;<prop1>;<prop2>;...]
+
+Where a prop is:
+
+ property_name=property_value
+
+For example:
+
+ style_type[button;bgcolor=#006699]
+ style[world_delete;bgcolor=red;textcolor=yellow]
+ button[4,3.95;2.6,1;world_delete;Delete]
+
+Setting a property to nothing will reset it to the default value. For example:
+
+ style_type[button;bgimg=button.png;bgimg_pressed=button_pressed.png;border=false]
+ style[btn_exit;bgimg=;bgimg_pressed=;border=;bgcolor=red]
+
+
+### Supported Element Types
+
+Some types may inherit styles from parent types.
+
+* button
+* button_exit, inherits from button
+* checkbox
+* scrollbar
+* table
+* textlist
+* dropdown
+* field
+* pwdfield, inherits from field
+* textarea
+* label
+* vertlabel, inherits from field
+* image_button
+* item_image_button
+* tabheader
+
+
+### Valid Properties
+
+* animated_image
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+* box
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+ * Default to false in formspec_version version 3 or higher
+* button, button_exit, image_button, item_image_button
+ * alpha - boolean, whether to draw alpha in bgimg. Default true.
+ * bgcolor - color, sets button tint.
+ * bgcolor_hovered - color when hovered. Defaults to a lighter bgcolor when not provided.
+ * bgcolor_pressed - color when pressed. Defaults to a darker bgcolor when not provided.
+ * bgimg - standard background image. Defaults to none.
+ * bgimg_hovered - background image when hovered. Defaults to bgimg when not provided.
+ * bgimg_middle - Makes the bgimg textures render in 9-sliced mode and defines the middle rect.
+ See background9[] documentation for more details
+ * bgimg_pressed - background image when pressed. Defaults to bgimg when not provided.
+ * border - boolean, draw border. Set to false to hide the bevelled button pane. Default true.
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+ * textcolor - color, default white.
+* checkbox
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+* scrollbar
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+* table, textlist
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+* dropdown
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+* field, pwdfield, textarea
+ * border - set to false to hide the textbox background and border. Default true.
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+ * textcolor - color. Default white.
+* image
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+ * Default to false in formspec_version version 3 or higher
+* item_image
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds. Default to false.
+* label, vertlabel
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+* image_button (additional properties)
+ * fgimg - standard image. Defaults to none.
+ * fgimg_hovered - image when hovered. Defaults to fgimg when not provided.
+ * fgimg_pressed - image when pressed. Defaults to fgimg when not provided.
+ * NOTE: The parameters of any given image_button will take precedence over fgimg/fgimg_pressed
+* tabheader
+ * noclip - boolean, set to true to allow the element to exceed formspec bounds.
+ * textcolor - color. Default white.
+
+Markup language
+---------------
+
+Markup language used in `hypertext[]` elements uses tag that look like HTML tags. Some
+tags can enclose text, they open with `<tagname>` and close with `</tagname>`.
+Tags can have attributes, in that case, attributes are in the opening tag in
+form of a key/value separated with equal signs. Attribute values should not be quoted.
+
+These are the technically basic tags but see below for usual tags. Base tags are:
+
+`<style color=... font=... size=...>...</style>`
+
+Changes the style of the text.
+
+* `color`: Text color. Given color is a `colorspec`.
+* `size`: Text size.
+* `font`: Text font (`mono` or `normal`).
+
+`<global background=... margin=... valign=... color=... hovercolor=... size=... font=... halign=... >`
+
+Sets global style.
+
+Global only styles:
+* `background`: Text background, a `colorspec` or `none`.
+* `margin`: Page margins in pixel.
+* `valign`: Text vertical alignment (`top`, `middle`, `bottom`).
+
+Inheriting styles (affects child elements):
+* `color`: Default text color. Given color is a `colorspec`.
+* `hovercolor`: Color of <action> tags when mouse is over.
+* `size`: Default text size.
+* `font`: Default text font (`mono` or `normal`).
+* `halign`: Default text horizontal alignment (`left`, `right`, `center`, `justify`).
+
+This tag needs to be placed only once as it changes the global settings of the
+text. Anyway, if several tags are placed, each changed will be made in the order
+tags appear.
+
+`<tag name=... color=... hovercolor=... font=... size=...>`
+
+Defines or redefines tag style. This can be used to define new tags.
+* `name`: Name of the tag to define or change.
+* `color`: Text color. Given color is a `colorspec`.
+* `hovercolor`: Text color when element hovered (only for `action` tags). Given color is a `colorspec`.
+* `size`: Text size.
+* `font`: Text font (`mono` or `normal`).
+
+Following tags are the usual tags for text layout. They are defined by default.
+Other tags can be added using `<tag ...>` tag.
+
+`<normal>...</normal>`: Normal size text
+
+`<big>...</big>`: Big text
+
+`<bigger>...</bigger>`: Bigger text
+
+`<center>...</center>`: Centered text
+
+`<left>...</left>`: Left-aligned text
+
+`<right>...</right>`: Right-aligned text
+
+`<justify>...</justify>`: Justified text
+
+`<mono>...</mono>`: Monospaced font
+
+`<b>...</b>`, `<i>...</i>`, `<u>...</u>`: Bold, italic, underline styles.
+
+`<action name=...>...</action>`
+
+Make that text a clickable text triggering an action.
projects / minetest.git / blobdiff