Change speed of Progress Bar

Hey.

You can change it using custom CSS variables. https://ghostkit.io/docs/css-variables/

See here used variable for transition https://github.com/nk-o/ghostkit/blob/master/src/gutenberg/blocks/progress/styles/variables.scss#L31

Try to overwrite it. Example with 2 seconds transition duration:

.ghostkit-progress {
    --gkt-progress__transition-duration: 2s;
}

Regards, nK.

Hey nK, thanks!

Unfortunately, I can’t make it work, and my fault I guess.

The CSS you have sent doesn’t trigger anything (tried in GK Custom CSS block section, general GK CSS & JavaScript tab and in the main CSS sheet).

Tried also to declare it as global variable in GK CSS & JavaScript tab like this:

:root {
–gkt-progress__transition-duration: 2s;
}

…and then to call it from the main CSS with this:

.ghostkit-progress {
transition-duration: var(–2s);
}

Surely I am doing something wrong.
Can you point me in the right direction?

Thanks again!

Hey.

Ah, shame on me… You can’t change it with CSS. I’ll let you know how to change it when it will be possible in the next plugin update.

Regards, nK.

Hey.

In the latest version you can change counters duration using jQuery event. Example:

jQuery( document ).on( 'prepareCounters.ghostkit', function( event, classObject, itemData ) {
    if ( 'ghostkit' !== event.namespace ) {
        return;
    }

    itemData.duration = 2000;
} );

Regards, nK.

Thanks nK, good news!
Just gave it a go, works great.
Thanks for this nice plugin once again,
cheers,
vlidi