artboard-deluxe / cssProperties
cssProperties()
cssProperties(
options
?):ArtboardPluginDefinition
<{element
:HTMLElement
;precision
:number
;restoreProperties
:boolean
;setOffsetX
:boolean
;setOffsetY
:boolean
;setScale
:boolean
;unitless
:boolean
; }>
Sets the artboard state as CSS custom properties/variables on the given element or root element.
Parameters
options?
element
HTMLElement
The element on which the CSS properties should be set. Falls back to the root element.
precision
number
How precise the set values should be.
A value of 1 (default) means that only whole pixels are applied (e.g. 20px). A value of 0.5 means the values are rounded to the next 0.5 increment (e.g. 20.5px or 21px). A value of 10 would round to 20px, 30px, 0px, etc.
restoreProperties
boolean
Restore original CSS properties on destroy.
If true, the plugin will restore the CSS properties to their value before the plugin was initialised.
setOffsetX
boolean
Set's the --artboard-offset-x property.
setOffsetY
boolean
Set's the --artboard-offset-y property.
setScale
boolean
Set's the --artboard-scale property.
unitless
boolean
Adds unitless property values.
If true, instead of --artboard-offset-x: -582px
it will set --artboard-offset-x: -582
. Useful if you want to do CSS calculations with purely numeric values.
Returns
ArtboardPluginDefinition
<{ element
: HTMLElement
; precision
: number
; restoreProperties
: boolean
; setOffsetX
: boolean
; setOffsetY
: boolean
; setScale
: boolean
; unitless
: boolean
; }>