diff --git a/files/assets/events/bday/css/btn-confetti.css b/files/assets/css/click_confetti.css
similarity index 52%
rename from files/assets/events/bday/css/btn-confetti.css
rename to files/assets/css/click_confetti.css
index 3eaa74754..4215d9ca6 100644
--- a/files/assets/events/bday/css/btn-confetti.css
+++ b/files/assets/css/click_confetti.css
@@ -5,17 +5,15 @@
}
}
-button {
- position: relative;
+.click-confetti {
+ position: fixed;
+ animation: bang 700ms ease-out forwards;
}
-.btn-confetti {
- position: absolute;
- display: block;
- left: 50%;
- top: 0;
+
+.click-confetti > i {
+ position: fixed;
width: 3px;
height: 8px;
- background: red;
animation: bang 700ms ease-out forwards;
- opacity: 0
+ opacity: 0;
}
diff --git a/files/assets/events/bday/js/btn-confetti.js b/files/assets/events/bday/js/btn-confetti.js
deleted file mode 100644
index f484de866..000000000
--- a/files/assets/events/bday/js/btn-confetti.js
+++ /dev/null
@@ -1,22 +0,0 @@
-for (const btn of document.getElementsByTagName('button')) {
- btn.addEventListener('click', function() {
- function random(max){
- return Math.random() * (max - 0) + 0;
- }
-
- const c = document.createElement('i');
- for (let i = 0; i < 100; i++) {
- const styles = 'transform: translate3d(' + (random(500) - 250) + 'px, ' + (random(200) - 150) + 'px, 0) rotate(' + random(360) + 'deg);\
- background: hsla('+random(360)+',100%,50%,1)'
-
- const e = document.createElement("i");
- e.style.cssText = styles.toString();
- e.classList.add('btn-confetti')
- c.appendChild(e);
- }
- btn.appendChild(c);
- setTimeout(function() {
- btn.removeChild(c)
- }, 700)
- })
-}
diff --git a/files/assets/js/click_confetti.js b/files/assets/js/click_confetti.js
new file mode 100644
index 000000000..2f7aef599
--- /dev/null
+++ b/files/assets/js/click_confetti.js
@@ -0,0 +1,20 @@
+document.addEventListener('click', function(e) {
+ function random(max){
+ return Math.random() * (max - 0) + 0;
+ }
+
+ const c = document.createElement('div');
+ c.classList.add('click-confetti')
+ c.style.top = e.clientY + 'px';
+ c.style.left = e.clientX + 'px';
+ for (let i = 0; i < 100; i++) {
+ const e = document.createElement("i");
+ e.style.transform = 'translate3d(' + (random(500) - 250) + 'px, ' + (random(200) - 150) + 'px, 0) rotate(' + random(360) + 'deg)'
+ e.style.background = `hsla(${random(360)},100%,50%,1)`
+ c.appendChild(e);
+ }
+ document.body.appendChild(c);
+ setTimeout(function() {
+ document.body.removeChild(c)
+ }, 700)
+})
diff --git a/files/templates/root.html b/files/templates/root.html
index 96b80a251..fc154f834 100644
--- a/files/templates/root.html
+++ b/files/templates/root.html
@@ -43,9 +43,9 @@
{% endif %}
- {% if IS_BDAY() and not (v and v.poor) %}
-
-
+ {% if (IS_BDAY() or p and p.award_count("confetti", v)) and not (v and v.poor) %}
+
+
{% endif %}