Fix an animation bug on mobile devices on the landing page
This commit is contained in:
parent
a9a44036a9
commit
64b5b28d47
1
Text.py
1
Text.py
|
@ -37,7 +37,6 @@ Uncle_texts = [
|
||||||
"Chasing tail.\nFly ladies.\nDo not follow.",
|
"Chasing tail.\nFly ladies.\nDo not follow.",
|
||||||
"I feel like\nI've done this\nbefore…",
|
"I feel like\nI've done this\nbefore…",
|
||||||
"Magic Cape can\npass through\nthe barrier!",
|
"Magic Cape can\npass through\nthe barrier!",
|
||||||
"If this is a\nKanzeon seed,\nI'm quitting.",
|
|
||||||
"I am not your\nreal uncle.",
|
"I am not your\nreal uncle.",
|
||||||
"You're going\nto have a very\nbad time.",
|
"You're going\nto have a very\nbad time.",
|
||||||
"Today you\nwill have\nbad luck.",
|
"Today you\nwill have\nbad luck.",
|
||||||
|
|
|
@ -40,8 +40,8 @@ const adjustHeaderWidth = () => {
|
||||||
};
|
};
|
||||||
|
|
||||||
window.addEventListener('load', () => {
|
window.addEventListener('load', () => {
|
||||||
adjustFooterHeight();
|
|
||||||
adjustHeaderWidth();
|
|
||||||
window.addEventListener('resize', adjustFooterHeight);
|
window.addEventListener('resize', adjustFooterHeight);
|
||||||
window.addEventListener('resize', adjustHeaderWidth);
|
window.addEventListener('resize', adjustHeaderWidth);
|
||||||
|
adjustFooterHeight();
|
||||||
|
adjustHeaderWidth();
|
||||||
});
|
});
|
||||||
|
|
|
@ -271,52 +271,8 @@ html{
|
||||||
}
|
}
|
||||||
|
|
||||||
@media all and (max-width: 1520px){
|
@media all and (max-width: 1520px){
|
||||||
#landing-clouds #cloud1{
|
#landing-clouds #cloud1, #landing-clouds #cloud2, #landing-clouds #cloud3{
|
||||||
animation-name: c1-glide-out;
|
display: none;
|
||||||
animation-duration: 1s;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
animation-iteration-count: 1;
|
|
||||||
left: -400px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#landing-clouds #cloud2{
|
|
||||||
animation-name: c2-glide-out;
|
|
||||||
animation-duration: 1s;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
animation-iteration-count: 1;
|
|
||||||
right: -300px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#landing-clouds #cloud3{
|
|
||||||
animation-name: c3-glide-out;
|
|
||||||
animation-duration: 1s;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
animation-iteration-count: 1;
|
|
||||||
right: -200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes c1-glide-out{
|
|
||||||
from{ left: 10px; }
|
|
||||||
to{
|
|
||||||
left: -400px;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes c2-glide-out{
|
|
||||||
from{ right: 82px; }
|
|
||||||
to{
|
|
||||||
right: -300px;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes c3-glide-out{
|
|
||||||
from{ right: 24px; }
|
|
||||||
to{
|
|
||||||
right: -200px;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#landing-links{
|
#landing-links{
|
||||||
|
|
|
@ -33,7 +33,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div id="landing" class="grass-island">
|
<div id="landing" class="grass-island">
|
||||||
<div id="landing-body">
|
<div id="landing-body">
|
||||||
<p id="first-line">Welcome to the Multiworld Randomizer!</p>
|
<p id="first-line">Welcome to the Archipelago Multiworld Randomizer!</p>
|
||||||
<p>This is a <span data-tooltip="Allegedly.">randomizer</span> for The Legend of Zelda: A
|
<p>This is a <span data-tooltip="Allegedly.">randomizer</span> for The Legend of Zelda: A
|
||||||
Link to the Past.</p>
|
Link to the Past.</p>
|
||||||
<p>It is also a multi-world, meaning Link's items may have been placed into other players' games.
|
<p>It is also a multi-world, meaning Link's items may have been placed into other players' games.
|
||||||
|
|
Loading…
Reference in New Issue