Skip to content

Commit

Permalink
Merge pull request #7981 from gitcoinco/abdul/fix/make-active-clrs-co…
Browse files Browse the repository at this point in the history
…llapsible

Make active CLR rounds togglable
  • Loading branch information
octavioamu authored Dec 9, 2020
2 parents b413bde + bb21c03 commit 55e45f8
Show file tree
Hide file tree
Showing 2 changed files with 55 additions and 41 deletions.
5 changes: 5 additions & 0 deletions app/assets/v2/js/grants/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -162,6 +162,7 @@ if (document.getElementById('grants-showcase')) {
page: 1,
collectionsPage: 1,
limit: 6,
show_active_clrs: window.localStorage.getItem('show_active_clrs') != 'false',
sort: sort,
network: document.network,
keyword: document.keyword,
Expand Down Expand Up @@ -191,6 +192,10 @@ if (document.getElementById('grants-showcase')) {
numGrants
},
methods: {
toggleActiveCLRs(){
this.show_active_clrs = !this.show_active_clrs
window.localStorage.setItem('show_active_clrs', this.show_active_clrs)
},
setView: function(mode, event) {
event.preventDefault();
localStorage.setItem('grants_view', mode);
Expand Down
91 changes: 50 additions & 41 deletions app/grants/templates/grants/shared/active_clr_round.html
Original file line number Diff line number Diff line change
@@ -1,48 +1,57 @@
{% load humanize %}
{% load humanize i18n %}
<div class="container-fluid grants-container">
<div class="container">
<div class="row">
{% for active_round in active_rounds %}
<div class="col-12 col-lg-6">
<a
href="/grants/clr{% if active_round.customer_name %}/{{ active_round.customer_name }}{% endif %}{% if active_round.round_num %}/{{ active_round.round_num }}{% endif %}{% if active_round.sub_round_slug %}/{{ active_round.sub_round_slug }}{% endif %}"
class="d-block text-decoration-none position-relative my-3 text-white"
>
<div class="position-absolute w-100 h-100"
style="top: 0; right: 0; z-index: 5;
{% if active_round.logo %}
background: url('{{ active_round.logo.url }}') no-repeat center;
{% endif %}
background-color: #0044e088;"
<div class="subheading font-weight-bold d-flex justify-content-between" @click="toggleActiveCLRs">
<span>{% trans "Active CLR Rounds" as filts %}{{ filts|upper }}</span>
<span class=" fa fa-fw fa-chevron-down" v-if="!show_active_clrs"></span>
<span class=" fa fa-fw fa-chevron-up" v-if="show_active_clrs"></span>
</div>
<b-collapse :visible="show_active_clrs" id="active_clrs_collapse" >

<div class="row">
{% for active_round in active_rounds %}
<div class="col-12 col-lg-6">
<a
href="/grants/clr{% if active_round.customer_name %}/{{ active_round.customer_name }}{% endif %}{% if active_round.round_num %}/{{ active_round.round_num }}{% endif %}{% if active_round.sub_round_slug %}/{{ active_round.sub_round_slug }}{% endif %}"
class="d-block text-decoration-none position-relative my-3 text-white"
>
</div>
<div class="d-flex px-4 py-3 justify-content-between position-relative" style="z-index: 10">
<div class="d-flex">
<div class="bg-white mr-3 overflow-hidden" style="width: 56px; height: 56px; border-radius: 100px;">
<img class="img-responsive" style="width: 100%; height: 100%;"
src="/dynamic/avatar/{{ active_round.owner.handle | default:'gitcoinco'}}" />
<div class="position-absolute w-100 h-100"
style="top: 0; right: 0; z-index: 5;
{% if active_round.logo %}
background: url('{{ active_round.logo.url }}') no-repeat center;
{% endif %}
background-color: #0044e088;"
>
</div>
<div class="d-flex px-4 py-3 justify-content-between position-relative" style="z-index: 10">
<div class="d-flex">
<div class="bg-white mr-3 overflow-hidden" style="width: 56px; height: 56px; border-radius: 100px;">
<img class="img-responsive" style="width: 100%; height: 100%;"
src="/dynamic/avatar/{{ active_round.owner.handle | default:'gitcoinco'}}" />
</div>
<h5 class="font-weight-bold my-auto">
{% if active_round.display_text %}
{{ active_round.display_text|upper }}
{% elif active_round.customer_name %}
{{ active_round.customer_name|upper }} - {{ active_round.round_num }}
{% elif active_round.sub_round_slug %}
{{ active_round.sub_round_slug|upper }} - {{ active_round.round_num }}
{% else %}
{{ active_round.round_num }}
{% endif %}
<br />
<small class="font-body font-weight-semibold">
{{active_round.start_date | date:'m/Y'}} - {{active_round.end_date | date:'m/Y'}}
</small>
</h5>
</div>
<h5 class="font-weight-bold my-auto">
{% if active_round.display_text %}
{{ active_round.display_text|upper }}
{% elif active_round.customer_name %}
{{ active_round.customer_name|upper }} - {{ active_round.round_num }}
{% elif active_round.sub_round_slug %}
{{ active_round.sub_round_slug|upper }} - {{ active_round.round_num }}
{% else %}
{{ active_round.round_num }}
{% endif %}
<br />
<small class="font-body font-weight-semibold">
{{active_round.start_date | date:'m/Y'}} - {{active_round.end_date | date:'m/Y'}}
</small>
</h5>
<p class="my-auto font-weight-semibold">${{ active_round.total_pot|floatformat:"0"|intcomma }}</p>
</div>
<p class="my-auto font-weight-semibold">${{ active_round.total_pot|floatformat:"0"|intcomma }}</p>
</div>
</a>
</div>
{% endfor %}
</div>
</a>
</div>
{% endfor %}
</div>
</b-collapse>

</div>
</div>

0 comments on commit 55e45f8

Please sign in to comment.