91 lines
1.7 KiB
HTML
91 lines
1.7 KiB
HTML
<!-- For use in Submission (threads) page only -->
|
|
<!-- Include in /templates/submission/submission.html -->
|
|
<!-- Requires `p` object -->
|
|
|
|
<img class="train1" src="/assets/CHRISTMAS/santasleigh.gif">
|
|
|
|
{% if p.award_count("train") > 1 %}
|
|
<img class="train2" src="/assets/CHRISTMAS/santasleigh.gif">
|
|
{% endif %}
|
|
|
|
{% if p.award_count("train") > 2 %}
|
|
<img class="train3" src="/assets/CHRISTMAS/santasleigh.gif">
|
|
{% endif %}
|
|
|
|
{% if p.award_count("train") > 3 %}
|
|
<img class="train4" src="/assets/CHRISTMAS/santasleigh.gif">
|
|
{% endif %}
|
|
|
|
<style>
|
|
@keyframes train {
|
|
0% {
|
|
right: 0%;
|
|
}
|
|
100% {
|
|
right: 100%;
|
|
}
|
|
}
|
|
|
|
@keyframes trainrev {
|
|
0% {
|
|
right: 100%;
|
|
}
|
|
100% {
|
|
right: 0%;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.train1 {
|
|
position: fixed;
|
|
z-index: 10;
|
|
width: 150px;
|
|
animation: train 3s linear infinite !important;
|
|
top: 35%
|
|
}
|
|
.train2 {
|
|
display: none !important;
|
|
}
|
|
.train3 {
|
|
display: none !important;
|
|
}
|
|
.train4 {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
.train1 {
|
|
position: absolute;
|
|
z-index: 10;
|
|
width: 150px;
|
|
animation: trainrev 5s linear infinite !important;
|
|
transform: scaleX(-1);
|
|
-webkit-transform: scaleX(-1);
|
|
top: 35%
|
|
}
|
|
.train2 {
|
|
position: absolute;
|
|
z-index: 10;
|
|
width: 150px;
|
|
animation: train 5s linear infinite !important;
|
|
top: 10%
|
|
}
|
|
.train3 {
|
|
position: absolute;
|
|
z-index: 10;
|
|
width: 150px;
|
|
animation: train 5s linear infinite !important;
|
|
top: 60%
|
|
}
|
|
.train4 {
|
|
position: absolute;
|
|
z-index: 10;
|
|
width: 150px;
|
|
animation: trainrev 5s linear infinite !important;
|
|
transform: scaleX(-1);
|
|
-webkit-transform: scaleX(-1);
|
|
top: 85%
|
|
}
|
|
}
|
|
</style> |