`<styleDefinition>`

A reusable style definition referenced by other components

<styleDefinition> is a General Operator component that allows the user to define custom styles for an individual document. Default styleNumbers, used in Graphical Components, are numbered $1$ to $6$ . Additional styleNumbers are defined with a <styleDefinition> component.

These new styles are assigned unique numbers that can be used locally in that document.

Attributes and Properties

Attributes for `<styleDefinition>`

Other (35)

backgroundColor

text. Background color (light mode).

backgroundColorDarkMode

text. Background color (dark mode).

backgroundColorWord

text. Human-readable name of the background color (light mode).

backgroundColorWordDarkMode

text. Human-readable name of the background color (dark mode).

fillColor

text. Fill color used inside closed shapes (light mode).

fillColorDarkMode

text. Fill color used inside closed shapes (dark mode).

fillColorWord

text. Human-readable name of the fill color (light mode).

fillColorWordDarkMode

text. Human-readable name of the fill color (dark mode).

fillOpacity

number. Opacity of fills, 0 to 1.

highContrastColor

text. High-contrast accent color (light mode).

highContrastColorDarkMode

text. High-contrast accent color (dark mode).

highContrastColorWord

text. Human-readable name of the high-contrast accent color (light mode).

highContrastColorWordDarkMode

text. Human-readable name of the high-contrast accent color (dark mode).

lineColor

text. Color used for line strokes (light mode).

lineColorDarkMode

text. Color used for line strokes (dark mode).

lineColorWord

text. Human-readable name of the line color (light mode).

lineColorWordDarkMode

text. Human-readable name of the line color (dark mode).

lineOpacity

number. Opacity of line strokes, 0 to 1.

lineStyle

keyword. Stroke style for lines.

Value	Description
`solid`	Continuous, unbroken stroke.
`dashed`	Stroke composed of evenly-spaced dashes.
`dotted`	Stroke composed of evenly-spaced dots.

lineStyleWord

text. Human-readable name of the line style.

lineWidth

number. Stroke width for lines, in pixels.

lineWidthWord

text. Human-readable name of the line width.

markerColor

text. Color used for markers/points (light mode).

markerColorDarkMode

text. Color used for markers/points (dark mode).

markerColorWord

text. Human-readable name of the marker color (light mode).

markerColorWordDarkMode

text. Human-readable name of the marker color (dark mode).

markerFilled

boolean. Whether the marker is rendered filled (true) or open (false). Has no effect when markerStyle is cross or plus, which have no interior.

markerOpacity

number. Opacity of markers/points, 0 to 1.

markerSize

number. Marker size in pixels.

markerStyle

keyword. Marker shape.

Value	Description
`circle`	Circular marker.
`square`	Square marker.
`triangle`	Triangular marker pointing up (alias for "triangleUp").
`triangleUp`	Triangular marker pointing up.
`triangleDown`	Triangular marker pointing down.
`triangleLeft`	Triangular marker pointing left.
`triangleRight`	Triangular marker pointing right.
`diamond`	Diamond-shaped marker.
`cross`	Cross-shaped marker (×).
`plus`	Plus-shaped marker (+).

markerStyleWord

text. Human-readable name of the marker style.

textColor

text. Text color (light mode).

textColorDarkMode

text. Text color (dark mode).

textColorWord

text. Human-readable name of the text color (light mode).

textColorWordDarkMode

text. Human-readable name of the text color (dark mode).

Common to all components (9)

copy

reference. Create an independent copy of another component by reference. Enter a references a $name.

disabled

boolean. Default value: false. Whether this component is disabled and cannot be interacted with.

extend

reference. Extend another component by reference, inheriting its children and attributes. Enter a reference as $name.

fixed

boolean. Default value: false. Whether this component's value is fixed and cannot be modified.

fixLocation

boolean. Default value: false. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

hide

boolean. Default value: false. Whether to hide this component from the rendered output.

isResponse

boolean. Default value: false. Whether this component is treated as a response for the purposes of assessment.

name

text. The name used to reference this component from elsewhere in the document.

styleNumber

integer. Default value: 1. Index identifying which style this definition applies to.

Properties for `<styleDefinition name="s">`

Other (4)

$s.disabled

boolean. Whether this component is disabled and cannot be interacted with.

$s.fixed

boolean. Whether this component's value is fixed and cannot be modified.

$s.fixLocation

boolean. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

$s.hidden

boolean. Whether this component is hidden from the rendered output.

Common to all components (3)

$s.doenetML

text. The DoenetML source code that produced this component.

$s.hide

boolean. Whether to hide this component from the rendered output.

$s.isResponse

boolean. Whether this component is treated as a response for the purposes of assessment.

Examples

Example: Defining a custom style

In this example, a custom style has been created and assigned a styleNumber of $10$ . The custom style is an adaptation of the default “red” styleNumber of $2$ , generating a thicker line and a round rather than a square point. The attributes ending in Word define the way doenet will render the style descriptions in text references when the styleDescription or styleDescriptionWithNoun properties are used.

stickyGroup subsection

<styleDefinition>