mirror of
https://github.com/juspay/hyperswitch.git
synced 2025-11-02 21:07:58 +08:00
fix: fix the loader orientation on mobile (#521)
This commit is contained in:
@ -566,19 +566,35 @@ pub fn build_redirection_form(form: &RedirectForm) -> maud::Markup {
|
|||||||
html {
|
html {
|
||||||
meta name="viewport" content="width=device-width, initial-scale=1";
|
meta name="viewport" content="width=device-width, initial-scale=1";
|
||||||
head {
|
head {
|
||||||
style { "#loading { -webkit-animation: rotation 2s infinite linear; } @-webkit-keyframes rotation{ from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); } }" }
|
style {
|
||||||
|
r##"
|
||||||
|
|
||||||
|
"##
|
||||||
|
}
|
||||||
|
(PreEscaped(r##"
|
||||||
|
<style>
|
||||||
|
#loader1 {
|
||||||
|
width: 500px,
|
||||||
|
}
|
||||||
|
@media max-width: 600px {
|
||||||
|
#loader1 {
|
||||||
|
width: 200px
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
"##))
|
||||||
}
|
}
|
||||||
|
|
||||||
body style="background-color: #ffffff; padding: 20px; font-family: Arial, Helvetica, Sans-Serif;" {
|
body style="background-color: #ffffff; padding: 20px; font-family: Arial, Helvetica, Sans-Serif;" {
|
||||||
|
|
||||||
div id="Loader1" class="lottie" style="width: 500px; height: 150px; display: block; position: relative; margin-left: auto; margin-right: auto;" { "" }
|
div id="loader1" class="lottie" style="height: 150px; display: block; position: relative; margin-left: auto; margin-right: auto;" { "" }
|
||||||
|
|
||||||
(PreEscaped(r#"<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.7.4/lottie.min.js"></script>"#))
|
(PreEscaped(r#"<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.7.4/lottie.min.js"></script>"#))
|
||||||
|
|
||||||
(PreEscaped(r#"
|
(PreEscaped(r#"
|
||||||
<script>
|
<script>
|
||||||
var anime = bodymovin.loadAnimation({
|
var anime = bodymovin.loadAnimation({
|
||||||
container: document.getElementById('Loader1'),
|
container: document.getElementById('loader1'),
|
||||||
renderer: 'svg',
|
renderer: 'svg',
|
||||||
loop: true,
|
loop: true,
|
||||||
autoplay: true,
|
autoplay: true,
|
||||||
|
|||||||
Reference in New Issue
Block a user