add tabs to award modal
parent
00c70a23fb
commit
7a8ec235e0
|
@ -5776,7 +5776,7 @@ img[src="/i/hand.webp"]+img[glow]:not([data-src]) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.awards-wrapper > div {
|
.awards-wrapper > div > div {
|
||||||
padding: 5px !important;
|
padding: 5px !important;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-transform: none!important;
|
text-transform: none!important;
|
||||||
|
@ -5786,15 +5786,15 @@ img[src="/i/hand.webp"]+img[glow]:not([data-src]) {
|
||||||
border-radius: 0.2rem;
|
border-radius: 0.2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.awards-wrapper > div > i {
|
.awards-wrapper > div > div > i {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.awards-wrapper > div.disabled {
|
.awards-wrapper > div > div.disabled {
|
||||||
opacity: 0.6;
|
opacity: 0.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.awards-wrapper > div:hover:not(.disabled), .awards-wrapper .picked {
|
.awards-wrapper > div > div:hover:not(.disabled), .awards-wrapper .picked {
|
||||||
background-color: var(--primary)!important;
|
background-color: var(--primary)!important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6902,7 +6902,7 @@ div.markdown {
|
||||||
.award-name, .award-owned {
|
.award-name, .award-owned {
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
}
|
}
|
||||||
.awards-wrapper > div {
|
.awards-wrapper > div > div {
|
||||||
width: 101px!important;
|
width: 101px!important;
|
||||||
}
|
}
|
||||||
.download-video {
|
.download-video {
|
||||||
|
@ -7183,3 +7183,10 @@ input[type=number] {
|
||||||
.unbreakable {
|
.unbreakable {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.award-tab {
|
||||||
|
font-size: 10px;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -180,3 +180,13 @@ for (const element of data_url) {
|
||||||
document.getElementById('giveaward').dataset.action = element.dataset.url
|
document.getElementById('giveaward').dataset.action = element.dataset.url
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const awardtabs = document.getElementsByClassName('award-tab');
|
||||||
|
const awardsections = document.getElementsByClassName('award-section');
|
||||||
|
|
||||||
|
function switchAwardTab() {
|
||||||
|
for (const element of awardtabs)
|
||||||
|
element.classList.toggle('active')
|
||||||
|
for (const element of awardsections)
|
||||||
|
element.classList.toggle('d-none')
|
||||||
|
}
|
||||||
|
|
|
@ -451,6 +451,16 @@ class User(Base):
|
||||||
|
|
||||||
return return_value
|
return return_value
|
||||||
|
|
||||||
|
@property
|
||||||
|
@lazy
|
||||||
|
def awards_content_effect(self):
|
||||||
|
return [x for x in self.user_awards if not x['deflectable'] and x['kind'] != 'benefactor']
|
||||||
|
|
||||||
|
@property
|
||||||
|
@lazy
|
||||||
|
def awards_author_effect(self):
|
||||||
|
return [x for x in self.user_awards if x not in self.awards_content_effect]
|
||||||
|
|
||||||
@property
|
@property
|
||||||
@lazy
|
@lazy
|
||||||
def referral_count(self):
|
def referral_count(self):
|
||||||
|
|
|
@ -9,16 +9,33 @@
|
||||||
<span><i class="far fa-times"></i></span>
|
<span><i class="far fa-times"></i></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div id="awardModalBody" class="modal-body mb-3">
|
<div id="awardModalBody" class="modal-body pt-2 mb-3">
|
||||||
|
<div class="row box-shadow-bottom bg-white pt-1 pb-4" style="justify-content: center;">
|
||||||
|
<button class="btn btn-primary btn-block m-0 shop-tab award-tab active" data-nonce="{{g.nonce}}" data-onclick="switchAwardTab()">
|
||||||
|
<span class="mr-auto ml-auto"><i class="fas fa-gift mr-2"></i>EFFECT ON CONTENT</span>
|
||||||
|
</button>
|
||||||
|
<button class="btn btn-primary btn-block m-0 shop-tab award-tab" data-nonce="{{g.nonce}}" data-onclick="switchAwardTab()">
|
||||||
|
<span class="mr-auto ml-auto"><i class="fas fa-gift mr-2"></i>EFFECT ON AUTHOR</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
<div class="awards-wrapper" style="text-align:center">
|
<div class="awards-wrapper" style="text-align:center">
|
||||||
{% for award in v.user_awards %}
|
{% macro iterate_awards(awards) %}
|
||||||
{% set price = (award.price*v.discount)|int %}
|
{% for award in awards %}
|
||||||
<div data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{price}} coins/marseybux - {{award.description}}" id="{{award.kind}}" data-nonce="{{g.nonce}}" data-onclick="pick('{{award.kind}}', {{price}}, {{v.coins}}, {{v.marseybux}})">
|
{% set price = (award.price*v.discount)|int %}
|
||||||
<i class="{{award.icon}} {{award.color}}"></i>
|
<div data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{price}} coins/marseybux - {{award.description}}" id="{{award.kind}}" data-nonce="{{g.nonce}}" data-onclick="pick('{{award.kind}}', {{price}}, {{v.coins}}, {{v.marseybux}})">
|
||||||
<div class="pt-1 award-name">{{award.title}}</div>
|
<i class="{{award.icon}} {{award.color}}"></i>
|
||||||
<div class="text-muted award-owned"><span id="{{award.kind}}-owned">{{award.owned}}</span> owned</div>
|
<div class="pt-1 award-name">{{award.title}}</div>
|
||||||
</div>
|
<div class="text-muted award-owned"><span id="{{award.kind}}-owned">{{award.owned}}</span> owned</div>
|
||||||
{% endfor %}
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
{% endmacro %}
|
||||||
|
|
||||||
|
<div class="award-section">
|
||||||
|
{{iterate_awards(v.awards_content_effect)}}
|
||||||
|
</div>
|
||||||
|
<div class="award-section d-none">
|
||||||
|
{{iterate_awards(v.awards_author_effect)}}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<label id="notelabel" for="note" class="pt-4">Note (optional):</label>
|
<label id="notelabel" for="note" class="pt-4">Note (optional):</label>
|
||||||
<input autocomplete="off" id="kind" hidden>
|
<input autocomplete="off" id="kind" hidden>
|
||||||
|
|
Loading…
Reference in New Issue