Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor landing page for grants #2944

Merged
merged 2 commits into from
Nov 26, 2018
Merged

Refactor landing page for grants #2944

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
85b5029
Refactor landing poage for grants
SaptakS Nov 26, 2018
7afdd3d
css + grid fixes
thelostone-mc Nov 26, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 28 additions & 3 deletions app/assets/v2/css/grants/grant.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,16 @@
font-weight: 500;
}

#search_form button {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}

#search_grants {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}

.token_symbol {
font-weight: 600;
}
Expand Down Expand Up @@ -95,10 +105,19 @@
color: #BBBDBF;
}

.grants-search {
.grants-search,
.grants-container {
background-color: #F2F6F9;
}

.grant-item {
background-color: #fff;
}

.grants-hero.white a {
color: white;
}

/* Tabs */
.ui-widget.ui-widget-content.ui-tabs {
background: transparent !important;
Expand Down Expand Up @@ -157,13 +176,19 @@
}

@media (max-width: 767.98px) {

.search {
margin-left: 1rem;
margin-left: 0rem;
margin-right: 0rem;
}

.order_by {
margin-top: 1rem;
padding: 0;
}
}

@media (max-width: 575.98px) {
.search {
margin-left: 1rem;
}
}
69 changes: 38 additions & 31 deletions app/grants/templates/grants/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,48 +28,53 @@
<div class="container-fluid header dash">
{% include 'shared/top_nav.html' with class='d-md-flex' %}
{% include 'grants/nav.html' %}
</div>

<div class="container pt-5">
<div class="grants-hero">
<div class="row">
<div class="col-12 col-md-6 order-md-last mb-5 mb-md-0">
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/Hx1iJ_K3D8k?rel=0&showinfo=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
<div class="container py-5">
<div class="grants-hero white">
<div class="row">
<div class="col-12 col-md-6 order-md-last mb-5 mb-md-0">
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/Hx1iJ_K3D8k?rel=0&showinfo=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
</div>
<div class="m-auto col-12 col-md-6 offset-lg-1 col-lg-5">
<h1 class="font-title-xl">{% trans 'Provide sustainable funding for Open Source with Gitcoin Grants' %}</h1>
<p class="mt-4 pt-1 mb-5 font-subheader">
{% blocktrans %}
Gitcoin Grants, powered by the <a target="_blank" rel="noopener noreferrer" href="http://1337alliance.com/">EIP 1337 standard</a>
, are a fast, easy, & secure way to provide recurring token contributions to your favorite OSS maintainers. <br/><br/>
Show your appreciation for maintainers in your dependancy tree with a Gitcoin Grant today.
{% endblocktrans %}
</p>
<a class="btn btn-gc-blue" href="{% url 'grants:new' %}">
{% trans 'Create a Grant' %}
</a>
</div>
</div>
<div class="m-auto col-12 col-md-6 offset-lg-1 col-lg-5">
<h1 class="font-title-xl">{% trans 'Gitcoin Grants' %}</h1>
<p class="mt-4 pt-1 mb-5 font-subheader">
{% blocktrans %}
Want to provide sustainable funding for Open Source? Creating a Gitcoin Grant is a great way to do it! Gitcoin Grants, powered by the
<a target="_blank" rel="noopener noreferrer" href="http://1337alliance.com/">EIP 1337 standard</a>
, are a fast, easy, & secure way to provide recurring token contributions to your favorite OSS maintainers. Show your appreciation for maintainers in your dependancy tree with a Gitcoin Grant today.
{% endblocktrans %}
</p>
<a class="button button--primary" href="{% url 'grants:new' %}">
{% trans 'Create a Grant' %}
</a>
</div>
</div>
</div>
</div>

<div class="container-fluid py-5 my-5 grants-search">
<div class="container-fluid py-5 grants-search">
<div class="container">
<form method="POST" id="search_form">
{% csrf_token %}
<div class="row">
<div class="search col-9 col-md-5 offset-md-1 col-lg-6 form__flex-group">
<div class="search px-0 col-7 col-sm-9 col-md-5 offset-md-2 col-lg-6 form__flex-group">
<input type="search" class="form__input" id="search_grants" name="search_grants" placeholder="Search Grants">
</div>
<div class="col-2 col-lg-1 px-0">
<button class="button button--primary">
<span class="d-sm-inline">{% trans 'Search' %}</span>
<i class="d-sm-none fas fa-search"></i>
<div class="col-3 col-lg-1 px-0">
<button class="btn btn-gc-blue">
<span class="d-sm-inline">{% trans "Search" %}</span>
<i class="ml-2 fas fa-search"></i>
</button>
</div>
<div class="col-12 col-md-4 col-lg-3 pt-1 font-caption order_by d-md-inline">
</div>
<div class="row mt-5">
<div class="col-12 col-md-6 pt-1 text-center text-sm-left pl-sm-0">
{{ grants_count }} {% trans "Grants available on" %} <b>mainnet</b>.
</div>
<div class="col-12 col-md-6 pt-1 font-caption order_by d-md-inline text-center text-sm-right">
<div class="heading">{% trans "SORT" %}</div>
<select name="sort_option" id="sort_option">
<option value="-created_on">{% trans "Created: Recent" %}</option>
Expand All @@ -84,14 +89,16 @@ <h1 class="font-title-xl">{% trans 'Gitcoin Grants' %}</h1>
</div>

{% if grants %}
<div class="container grants-container">
<div class="container-fluid grants-container">
<div class="container">
{% for grant in grants %}
{% if forloop.counter0|divisibleby:3 %} <div class="row"> {% endif %}
<div class="col-12 col-md-6 col-lg-4 mb-4">
{% include 'grants/card.html' %}
</div>
<div class="col-12 col-md-6 col-lg-4 mb-4">
{% include 'grants/card.html' %}
</div>
{% if forloop.counter|divisibleby:3 or forloop.last %} </div> {% endif %}
{% endfor %}
</div>
</div>
{% endif %}

Expand Down
1 change: 1 addition & 0 deletions app/grants/views.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,7 @@ def grants(request):
'active': 'grants_landing',
'title': _('Grants Explorer'),
'grants': grants,
'grants_count': _grants.count(),
'keywords': get_keywords(),
}
return TemplateResponse(request, 'grants/index.html', params)
Expand Down