Changing Button Animation In Magnin Template - Question | JoomShaper

Changing Button Animation In Magnin Template

M

Milan

Template 1 week ago

Hello,

Please advise how to set the button animation in reverse in the Magnin template? The default button will be blue and will turn transparent when hovered over.

Best regards, Milan

0
5 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 1 week ago #217124

Hi

Thanks for contacting us. Could you please check your site? I cant access on that.

-Regards.

0
M
Milan
Accepted Answer
1 week ago #217129

Hello,

I'm sorry, the temporary address is no longer functional, I'm sending a new url.

Best regards, Milan

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 1 week ago #217260

Hi

You can use this CSS in your custom.css file

body .sppb-btn.sppb-btn-default:after, body .sppb-btn.sppb-btn-primary:after, body .sppb-btn.btn-primary:after, body .btn.sppb-btn-default:after, body .btn.sppb-btn-primary:after, body .btn.btn-primary:after{
background: #627be6 !important;
}
body .sppb-btn.sppb-btn-default:hover, body .sppb-btn.sppb-btn-default:focus, body .sppb-btn.sppb-btn-default:active, body .sppb-btn.sppb-btn-primary:hover, body .sppb-btn.sppb-btn-primary:focus, body .sppb-btn.sppb-btn-primary:active, body .sppb-btn.btn-primary:hover, body .sppb-btn.btn-primary:focus, body .sppb-btn.btn-primary:active, body .btn.sppb-btn-default:hover, body .btn.sppb-btn-default:focus, body .btn.sppb-btn-default:active, body .btn.sppb-btn-primary:hover, body .btn.sppb-btn-primary:focus, body .btn.sppb-btn-primary:active, body .btn.btn-primary:hover, body .btn.btn-primary:focus, body .btn.btn-primary:active{
border-color: #627be6 !important;
}
0
M
Milan
Accepted Answer
1 week ago #217279

Hello,

I inserted the code into https://teslacentrum.cz/templates/magnin/css/custom.css the correct color should be #E8461D

The button behaves the same - I need to reverse the behavior.

  1. / When the button is not active, it will have the color #E8461D 2./ When I hover over the button with the cursor, an animation is performed and the button will be transparent with a white border.

Best regards, Milan

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 1 week ago #217354

Hi

You can now use this CSS

body .sppb-btn.sppb-btn-default:after, body .sppb-btn.sppb-btn-primary:after, body .sppb-btn.btn-primary:after, body .btn.sppb-btn-default:after, body .btn.sppb-btn-primary:after, body .btn.btn-primary:after{
background: transparent !important;
color: #fff !important;;
border-color: #fff !important;
}
body .sppb-btn.sppb-btn-default:hover, body .sppb-btn.sppb-btn-default:focus, body .sppb-btn.sppb-btn-default:active, body .sppb-btn.sppb-btn-primary:hover, body .sppb-btn.sppb-btn-primary:focus, body .sppb-btn.sppb-btn-primary:active, body .sppb-btn.btn-primary:hover, body .sppb-btn.btn-primary:focus, body .sppb-btn.btn-primary:active, body .btn.sppb-btn-default:hover, body .btn.sppb-btn-default:focus, body .btn.sppb-btn-default:active, body .btn.sppb-btn-primary:hover, body .btn.sppb-btn-primary:focus, body .btn.sppb-btn-primary:active, body .btn.btn-primary:hover, body .btn.btn-primary:focus, body .btn.btn-primary:active{
background: #627be6 !important;
border-color: #627be6 !important;
}
0