Style

All standard CSS / SVG styles are (will be) supported: https://www.w3schools.com/css/default.asp

Style settings are stored as Properties ("Props") in the overall GoKi framework, using the SetProp method.

ki.Props is a map[string]interface{} available per Node. GoKi can automatically Save / Load enums (const ints) using their string names in these maps (as long as the enum has been registered with kit.Enums.AddEnum* and has the go:generate stringer run on it), so you are encouraged to use these enum values directly instead of the strings, for greater runtime efficiency. Likewise, other basic types like Color and especially units.Value (see below)

SetProp

In Go code, you set a style using the ki.SetProp method, with the style name as the key. Per above, it is more efficient to use direct relevant types rather than strings, per examples:

• SetProp("border-width", units.NewPx(1)) instead of SetProp("border-width", "1px")
• SetProp("vertical-align", gi.AlignTop) instead of SetProp("vertical-align", "top")

CSS

There is also a CSS field on all nodes, which is a ki.Props field, containing properties that obey the standard CSS naming conventions and are inherited along the hierarchy. Create a property with a value of ki.Props to define a list of properties that apply to a given identifier:

• #name applies to elements with the given Name
• .class applies to elements with the given Class
• type applies to elements of the given type

See the examples/widgets example for usage.

These CSS properties are also parsed from relevant input files, e.g., SVG <script> tags

Units

The units package provides a the core ability to transform the various standard CSS units into underlying device-specific DPI "dots" -- strings like "4px" are translated into a units.Value of 4 and units.Px units:

// Value and units, and converted value into raw pixels (dots in DPI)
type Value struct {
	Val  float32
	Un   Unit
	Dots float32
}

The Style class has a units.Context that contains relevant context info for converting the units to dots, including the size of the containing object for the pct unit, font size for em ex ch etc.