rDrama
/
rDrama
9
10
Fork 8
Code Issues Pull Requests Packages Releases Wiki Activity

fix tilt award

pull/136/head
Aevann 2023-02-27 15:26:55 +02:00
parent c03d4fb0ba
commit 27b2adf989
3 changed files with 47 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
files/assets/css/awards.css
View File

@ -158,24 +158,53 @@
100% {transform: translateX(-15vw) rotate(180deg); top: 0; bottom: unset;}
}
@keyframes tilt {
0% {transform: rotate(0deg);}
25% {transform: rotate({{p.award_count("tilt", v)}}deg);}
75% {transform: rotate(-{{p.award_count("tilt", v)}}deg);}
100% {transform: rotate(0deg);}
}
@media (max-width: 720px) {
@keyframes tilt {
0% {transform: rotate(0deg);}
25% {transform: rotate({{p.award_count("tilt", v)/4}}deg);}
75% {transform: rotate(-{{p.award_count("tilt", v)/4}}deg);}
100% {transform: rotate(0deg);}
}
}
.tilt {
animation-name: tilt;
animation-duration: 60s !important;
animation-iteration-count: infinite !important;
animation-direction: alternate !important;
animation-timing-function: linear !important;
}
@keyframes tilt-1 {
0% {transform: rotate(0deg);}
25% {transform: rotate(1deg);}
75% {transform: rotate(-1deg);}
100% {transform: rotate(0deg);}
}
.tilt-1 {
animation-name: tilt-1;
}
@keyframes tilt-2 {
0% {transform: rotate(0deg);}
25% {transform: rotate(2deg);}
75% {transform: rotate(-2deg);}
100% {transform: rotate(0deg);}
}
.tilt-2 {
animation-name: tilt-2;
}
@keyframes tilt-3 {
0% {transform: rotate(0deg);}
25% {transform: rotate(3deg);}
75% {transform: rotate(-3deg);}
100% {transform: rotate(0deg);}
}
.tilt-3 {
animation-name: tilt-3;
}
@keyframes tilt-4 {
0% {transform: rotate(0deg);}
25% {transform: rotate(4deg);}
75% {transform: rotate(-4deg);}
100% {transform: rotate(0deg);}
}
.tilt-4 {
animation-name: tilt-4;
}

5
files/templates/comments.html
View File

@ -27,8 +27,7 @@
<span class="comment-collapse-desktop d-mob-none" style="border-left: 2px solid #{{c.author.name_color}}" data-nonce="{{g.nonce}}" data-onclick="collapse_comment('{{c.id}}')"></span>
<div class="comment-body">
<div id="comment-{{c.id}}-only" class="{% if c.award_count('tilt', v) %}tilt{% endif %} {% if c.award_count('glowie', v) %}glow{% endif %} comment-{{c.id}}-only">
<div id="comment-{{c.id}}-only" class="{% if c.award_count('tilt', v) %}tilt tilt-{{c.award_count('tilt', v)}}{% endif %} {% if c.award_count('glowie', v) %}glow{% endif %} comment-{{c.id}}-only">
<div class="user-info">
<span class="comment-collapse-icon" data-nonce="{{g.nonce}}" data-onclick="collapse_comment('{{c.id}}')"></span>
{% if standalone and c.over_18 %}<span class="badge badge-danger">+18</span> {% endif %}
@ -118,7 +117,7 @@
{% endif %}
<div class="comment-body">
<div id="{% if comment_info and comment_info.id == c.id %}context{%else%}comment-{{c.id}}-only{% endif %}" class="{% if c.unread %}unread{% endif %} {% if c.award_count('glowie', v) %}glow{% endif %} comment-{{c.id}}-only comment-anchor {% if comment_info and comment_info.id == c.id %}context{%endif%}{% if c.is_banned %} banned{% endif %}{% if c.deleted_utc %} deleted{% endif %}">
<div id="{% if comment_info and comment_info.id == c.id %}context{%else%}comment-{{c.id}}-only{% endif %}" class="{% if c.award_count('tilt', v) %}tilt tilt-{{c.award_count('tilt', v)}}{% endif %} {% if c.unread %}unread{% endif %} {% if c.award_count('glowie', v) %}glow{% endif %} comment-{{c.id}}-only comment-anchor {% if comment_info and comment_info.id == c.id %}context{%endif%}{% if c.is_banned %} banned{% endif %}{% if c.deleted_utc %} deleted{% endif %}">
<div class="user-info">
<span class="comment-collapse-icon" data-nonce="{{g.nonce}}" data-onclick="collapse_comment('{{c.id}}')"></span>

2
files/templates/submission.html
View File

@ -60,7 +60,7 @@
<div class="row mb-3">
<div id="post-root" class="col-12 {% if p.award_count('tilt', v) %}tilt{% endif %}">
<div id="post-root" class="col-12 {% if p.award_count('tilt', v) %}tilt tilt-{{p.award_count('tilt', v)}}{% endif %}">
<div class="card border-0 mt-3 {% if p.stickied %}stickied{% endif %} {% if voted==1 %}upvoted{% elif voted==-1 %} downvoted{% endif %}">
<div id="post-{{p.id}}" class="actual-post {% if p.ghost %}ghost-post{% endif %} {% if p.is_banned %}banned{% endif %} {% if p.deleted_utc %}deleted {% endif %} {% if p.award_count('tilt', v) %}p-3{% endif %} {% if p.award_count('glowie', v) %}glow{% endif %} d-flex flex-row-reverse flex-nowrap justify-content-end">