monks/vector_effect

The vector-effect CSS property suppresses specific transformation effects in SVG, thus permitting effects like a road on a map staying the same width no matter how the map is zoomed, or allowing a diagram key to retain its position and size regardless of other transforms. It can only be used with SVG elements that accept the {{SVGAttr(“vector-effect”)}} attribute. When used, the CSS value overrides any values of the element’s vector-effect attribute.

Values

fixed_position

</>

pub const fixed_position: #(String, String)

fixed-position value of vector-effect

inherit

</>

pub const inherit: #(String, String)

initial

</>

pub const initial: #(String, String)

non_rotation

</>

pub const non_rotation: #(String, String)

non-rotation value of vector-effect

non_scaling_size

</>

pub const non_scaling_size: #(String, String)

non-scaling-size value of vector-effect

non_scaling_stroke

</>

pub const non_scaling_stroke: #(String, String)

: The element’s drawn stroke width will be physically equal in size to its defined stroke width, even if the element has been scaled up or down in size due to transforms of either itself or its coordinate system. This is the case whether the element is scaled with transforms or by physical resizing of the entire image.> [!NOTE]> The spec defines three other values, non-scaling-size, non-rotation, and fixed-position, but these have no implementations and are considered at-risk.

none

</>

pub const none: #(String, String)

: No vector effects are applied to the element, meaning it will be fully affected by transforms as normal.

raw

</>

pub fn raw(value: String) -> #(String, String)

Enter a raw string value for vector-effect

revert

</>

pub const revert: #(String, String)

revert_layer

</>

pub const revert_layer: #(String, String)

unset

</>

pub const unset: #(String, String)

var

</>

pub fn var(variable: String) -> #(String, String)

Enter a variable name to be used for vector-effect. It will be wrapped in var() and have -- prepended.