Skip to content

Commit

Permalink
Add cards fro projects and kudos
Browse files Browse the repository at this point in the history
  • Loading branch information
zoek1 committed Apr 23, 2020
1 parent fa152cc commit 712f575
Show file tree
Hide file tree
Showing 2 changed files with 81 additions and 28 deletions.
9 changes: 5 additions & 4 deletions app/assets/v2/css/town_square.css
Original file line number Diff line number Diff line change
Expand Up @@ -1077,7 +1077,7 @@ body.green.offer_view .announce {
background-color: var(--gc-green);
}

.bg-gc-blue {
.bg-light-blue {
background-color: #00A3FF;
}

Expand All @@ -1087,12 +1087,13 @@ body.green.offer_view .announce {

.card-ribbon {
margin-top: -14px;
margin-left: 10px;
right: -10px;
width: 110px;
margin-bottom: 10px;
position: absolute;
}

.logo-metacard {
max-height: 7rem;
max-width: 7rem;
max-height: 4rem;
max-width: 4rem;
}
100 changes: 76 additions & 24 deletions app/retail/templates/shared/activity.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,6 @@
{% endcomment %}
{% load humanize i18n static grants_extra %}
<div class="box bg-white d-block m-0 mb-3 activity {{ row.activity_type }} infinite-item px-sm-3 py-4" data-pk="{{row.pk}}">
{% if row.activity_type == 'new_bounty' %}
<div class="align-items-baseline d-flex font-weight-bold justify-content-between mb-2 mt-n3">
<b>New Bounty</b>
<i class="fad fa-sparkles" style="right: 0.2em; color: #3e00ff;"></i>
</div>
{% endif %}
<div class="activity_main row">
<div class="col-2 p-0">
<div class="activity-avatar">
Expand Down Expand Up @@ -363,25 +357,29 @@

</div>
</div>
<div class="d-none d-sm-inline col-sm-2 pl-0">
<div class="d-none d-sm-inline col-sm-2 pl-0 position-relative">
{% if row.activity_type == 'new_bounty' %}
<div>
<div class="bg-gc-blue card-ribbon px-2 text-center">
<i style="font-size: 14px" class="text-white fas fa-tools"></i>
<span style="width: 85px" class="text-white">New bounty</span>
<span class="text-white font-weight-bold font-smaller-2 text-capitalize">New bounty</span>
</div>
{% elif row.activity_type == 'new_kudos' %}
<div class="bg-light-blue card-ribbon px-2 text-center">
<img height="15" src="{% static 'v2/images/top-bar/kudos_symbol_dark.svg' %}" alt="">
<span class="text-white font-weight-bold font-smaller-2 text-capitalize">New kudos</span>
</div>
{% elif row.activity_type == 'new_hackathon_project' %}
<div class="bg-gc-blue card-ribbon px-2 text-center">
<i style="font-size: 14px" class="text-white fas fa-tools"></i>
<span class="text-white font-weight-bold font-smaller-2">New bounty</span>
<div class="bg-gc-green card-ribbon px-2 text-center">
<img height="15" src="{% static 'v2/images/Lightbulb.svg' %}" alt="">
<span class="text-white font-weight-bold font-smaller-2 text-capitalize">New Project</span>
</div>
{% elif row.activity_type == 'new_grant' %}
<div class="bg-gc-dark-blue card-ribbon px-2 text-center">
<img height="15" src="{% static 'v2/images/products/grants-logo.svg' %}" alt="">
<span class="text-white font-weight-bold font-smaller-2">New Grant</span>
<span class="text-white font-weight-bold font-smaller-2 text-capitalize">New Grant</span>
</div>
{% endif %}
<div class="activity_time font-smaller-5 text-right">
<div class="activity_time font-smaller-5 mt-4 text-right">
{% if not hide_date %}
{{ row.created_human_time }}
{% endif %}
Expand All @@ -404,24 +402,78 @@
</div>
</div>
{% if row.activity_type == 'new_bounty' %}
<div class="mt-1 mb-2">
<div class="row align-items-center bg-light content py-3">
<div class="col-12 col-md-2 text-center">
{% if row.bounty.funding_organisation %}
<img class="logo-metacard rounded-circle" src="{% url 'org_avatar' row.bounty.funding_organisation %}">
{% else %}
<img class="logo-metacard rounded-circle" src="{% url 'org_avatar' row.bounty.bounty_owner_github_username %}">
{% endif %}
</div>
<div class="col-12 col-md-7 d-flex flex-column">
<div class="bounty-detail">
<div class="title font-subheader font-weight-bold">
{{ row.bounty.title }}
</div>

<div class="bounty-summary p-0 col-12">
<div class="info font-caption">
{% if row.bounty.funding_organisation %}
{{ row.bounty.funding_organisation }}
{% else %}
{{ row.bounty.bounty_owner_github_username }}
{% endif %}
</div>
</div>
</div>
</div>
<div class="col-12 col-md-3 tags fixed font-caption justify-content-end text-right">
<div class="tag token">
<p>
{{ row.bounty.value_true }}
<span>{{ row.bounty.token_name }}</span>
</p>
</div>
{% if row.bounty.value_in_usdt_now %}
<div class="tag usd">
<p>
{{ row.bounty.value_in_usdt_now }}
<span>USD</span>
</p>
</div>
{% endif %}
</div>
</div>
{% elif row.activity_type == 'new_kudos' %}
{% elif row.activity_type == 'new_hackathon_project' %}
<div class="mt-1 mb-2">
<div class="row align-items-center bg-light content py-3">
<div class="col-12 col-md-3 text-center">
<img class="logo-metacard" src="{{ row.kudos.img_url }}">
</div>
<div class="col-12 col-md-9 text-left">
<p class="mt-2 mb-1 font-weight-bold" style="font-size: 1.2em;">{{ row.kudos.ui_name }}</p>
<p class="small">{{ row.kudos.description|truncatechars:200}}</p>
</div>
</div>
</div>
{% elif row.activity_type == 'new_hackathon_project' %}
<div class="mt-1 mb-2">
<div class="row align-items-center bg-light content py-3">
<div class="col-12 col-md-2 text-center">
{% if row.project.logo %}
<img class="logo-metacard" src="{{MEDIA_URL}}{{row.project.logo}}" alt="Hackathon logo" />
<img class="logo-metacard rounded-circle" src="{{MEDIA_URL}}{{row.project.logo}}" alt="Hackathon logo" />
{% else %}
<img class="logo-metacard" src="{{ row.project.bounty.avatar_url }}" alt="{{row.project.bounty.org_name}}" />
<img class="logo-metacard rounded-circle" src="{{ row.project.bounty.avatar_url }}" alt="{{row.project.bounty.org_name}}" />
{% endif %}
</div>
<div class="col-12 col-md-6 text-left">
<p class="mt-2 mb-1 font-weight-bold" style="font-size: 1.2em;">{{ row.project.name }}</p>
<p class="small">for {% if hackathon.logo_svg %}
<img class="" style="width: 15px; " src="{{ row.project.hackathon.logo_svg.url }}" alt="Hackathon logo"/>
{% elif hackathon.logo %}
<img style="width: 15px; " src="{{ row.project.hackathon.logo.url }}" alt="Hackathon logo"/>
{% endif %} <span class="font-weight-bold">{{ row.project.hackathon.name }}</span></p>
<p class="small">for {% if row.project.bounty.funding_organisation %}
<img class="rounded-circle" height="20" src="{% url 'org_avatar' row.project.bounty.funding_organisation %}"> {{ row.project.bounty.funding_organisation }}
{% else %}
<img class="rounded-circle" height="20" src="{% url 'org_avatar' row.project.bounty.bounty_owner_github_username %}"> {{ row.project.bounty.bounty_owner_github_username }}
{% endif %} on <span class="font-weight-bold">{{ row.project.hackathon.name }}</span></p>
</div>
<div class="col-12 col-md-3 text-left d-flex">
<i class="fas fa-wrench gc-text-blue mr-2 mt-4"></i> <p class="gc-text-blue text-capitalize font-smaller-1"> Looking for<br> team members</p>
Expand All @@ -431,8 +483,8 @@
{% elif row.activity_type == 'new_grant' %}
<div class="mt-1 mb-2">
<div class="row align-items-center bg-light content py-3">
<div class="col-12 col-md-3 text-center">
<img class="logo-metacard" src="{% if row.grant.logo and row.grant.logo.url %}{{ row.grant.logo.url }}{% else %}{% with grant_logo='v2/images/grants/logos/' id=row.grant.id|modulo:3 %}{% static grant_logo|addstr:id|add:'.png' %}{% endwith %}{% endif %}">
<div class="col-12 col-md-2 text-center">
<img class="logo-metacard rounded-circle" src="{% if row.grant.logo and row.grant.logo.url %}{{ row.grant.logo.url }}{% else %}{% with grant_logo='v2/images/grants/logos/' id=row.grant.id|modulo:3 %}{% static grant_logo|addstr:id|add:'.png' %}{% endwith %}{% endif %}">
</div>
<div class="col-12 col-md-9 text-left">
<p class="mt-2 mb-1 font-weight-bold" style="font-size: 1.2em;">{{ row.grant.title }}</p>
Expand Down

0 comments on commit 712f575

Please sign in to comment.