MidnightClub

On 8/22/2020 at 3:40 PM, SergioC said:

UPDATE UPDATE!!

The Squarespace app still allows you to change the default theme.

Site Styles > Colours > Site Theme

Amazing.

Here's a solution from @SergioC using the squarespace app.

How is it not possible to change the section theme color on the cart page?

Seems crazy.

On the website I'm working on, section theme is set to accent dark and I can't find a place to change it.

Great guide! very useful info.. thanks for sharing @gabrielle.lods!

Yeah! 

Glad I could help @johnay!

Take care

Fab
 

alright!

so on your homepage, i saw the blocks with horizontal clip anim. Speed is at 800ms, which I guess is default.

So if you add that to your css it should do the trick:

.image-block-outer-wrapper.combination-animation-horizontal-clip .image-block-wrapper{
transition: -webkit-clip-path 3600ms cubic-bezier(.4,0,.2,1),clip-path 3600ms cubic-bezier(.4,0,.2,1);
}

.image-block-outer-wrapper.combination-animation-vertical-clip .image-block-wrapper{
transition: -webkit-clip-path 3600ms cubic-bezier(.4,0,.2,1),clip-path 3600ms cubic-bezier(.4,0,.2,1);
}

I set it to 3600ms so that the difference is obvious, for both horizontal and vertical clip animation. So you just have to change that value to change the speed.

Let me know if it work.

Cheers,
Fab

Sorry now that i re read myself, it might have been confusing.. if it's in private we can't see it. and i tought it was the setting you had as it says I don't have permissions.

So setting has to be password protected

Hey @johnay

I can't access your site, tells me I don't have permissions.

Check the site availability in settings, must be on private and not password protected.

If I can have a look I'm sure we can find the right css for you.

Fab

alright try this and just change the "800ms" to the speed you want for vertical clip on an image block with text (works with overlap and collage for me) :

.image-block-outer-wrapper.combination-animation-vertical-clip .sqs-dynamic-text-container {
    transition: -webkit-clip-path 800ms cubic-bezier(.4,0,.2,1),clip-path 800ms cubic-bezier(.4,0,.2,1);
    will-change: -webkit-clip-path,clip-path;

I guess for horizontal clip you just have to change to .combination-animation-horizontal-clip

Cheers,

Fab

Hey @johnay

I'm using collide and have found css to slow it down.
Basic speed is 800ms so just by changing that you can alter the speed (I'm trying 1600ms and it works great)

/*COLLIDE IMAGE POSITION RIGHT*/
.image-block-outer-wrapper.combination-animation-collide.image-position-right .image-inset{

  transition: opacity 1600ms cubic-bezier(.4,0,.2,1),transform 1600ms cubic-bezier(.4,0,.2,1);
    will-change: opacity,transform;
}
.image-block-outer-wrapper.combination-animation-collide.image-position-right .sqs-dynamic-text-container {
    transition: opacity 1600ms cubic-bezier(.4,0,.2,1),transform 1600ms cubic-bezier(.4,0,.2,1);
    will-change: opacity,transform;
}

/*COLLIDE IMAGE POSITION LEFT*/
.image-block-outer-wrapper.combination-animation-collide.image-position-left .image-inset{

  transition: opacity 1600ms cubic-bezier(.4,0,.2,1),transform 1600ms cubic-bezier(.4,0,.2,1);
    will-change: opacity,transform;
}
.image-block-outer-wrapper.combination-animation-collide.image-position-left .sqs-dynamic-text-container {
    transition: opacity 1600ms cubic-bezier(.4,0,.2,1),transform 1600ms cubic-bezier(.4,0,.2,1);
    will-change: opacity,transform;
}

I'm looking now for the same for the "reveal" animation..

Hope this helps.

Fab

I'm looking for the same thing.. If I find a solution I'll post it back.
Animations are way too fast on the image blocks...