decioferreira / elm-zen-css / CSS.Properties.Animation.FillMode

The animation-fill-mode CSS property sets how a CSS animation applies styles to its target before and after its execution.

Ref.: https://developer.mozilla.org/en-US/docs/Web/CSS/animation-fill-mode

Single animation

none : CSS.Internal.Property

The animation will not apply any styles to the target when it's not executing. The element will instead be displayed using any other CSS rules applied to it. This is the default value.

forwards : CSS.Internal.Property

The target will retain the computed values set by the last keyframe encountered during execution.

backwards : CSS.Internal.Property

The animation will apply the values defined in the first relevant keyframe as soon as it is applied to the target, and retain this during the animation-delay period.

both : CSS.Internal.Property

The animation will follow the rules for both forwards and backwards, thus extending the animation properties in both directions.

Multiple animations

multiple : List.Nonempty.Nonempty FillMode -> CSS.Internal.Property

Global values

inherit : CSS.Internal.Property

The inherit CSS keyword causes the element to take the computed value of the property from its parent element.

Ref.: https://developer.mozilla.org/en-US/docs/Web/CSS/inherit

initial : CSS.Internal.Property

The initial CSS keyword applies the initial (or default) value of a property to an element.

Ref.: https://developer.mozilla.org/en-US/docs/Web/CSS/initial

revert : CSS.Internal.Property

The revert CSS keyword reverts the cascaded value of the property from its current value to the value the property would have had if no changes had been made by the current style origin to the current element.

Ref.: https://developer.mozilla.org/en-US/docs/Web/CSS/revert

revertLayer : CSS.Internal.Property

The revert-layer CSS keyword rolls back the value of a property in a cascade layer to the value of the property in a CSS rule matching the element in a previous cascade layer.

Ref.: https://developer.mozilla.org/en-US/docs/Web/CSS/revert-layer

unset : CSS.Internal.Property

The unset CSS keyword resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value if not.

Ref.: https://developer.mozilla.org/en-US/docs/Web/CSS/unset

Types


type FillMode
    = None
    | Forwards
    | Backwards
    | Both

fillModeToString : FillMode -> String