(Fix) index.html: use .row and .content correctly

This commit is contained in:
0xfff 2016-09-26 14:35:25 +02:00
parent 586b9b9ef3
commit a502cf4d70

View file

@ -9,201 +9,207 @@ description: pages.home.description
<div class="page-home"> <div class="page-home">
<!-- <!--
WHAT IS DASH? WHAT IS DASH?
LINK TO VIDEO. LINK TO VIDEO.
--> -->
<section> <section>
<div class="content"> <div class="content">
<h2>{% t pages.home.video-heading %}</h2> <h2>{% t pages.home.video-heading %}</h2>
{% tmd pages.home.video-text %} {% tmd pages.home.video-text %}
<a href="https://www.youtube.com/watch?v=S0oNO3mbBE8" class="btn-blue" target="_blank" data-js-popup="video">{% t pages.home.video-btn %}</a> <a href="https://www.youtube.com/watch?v=S0oNO3mbBE8" class="btn-blue" target="_blank" data-js-popup="video">{% t pages.home.video-btn %}</a>
</div> </div>
</section> </section>
<!-- <!--
DASH FEATURES DASH FEATURES
PRIVATE | INSTANT | SECURE PRIVATE | INSTANT | SECURE
--> -->
<section> <section>
<div class="content"> <div class="content">
<div class="row features-collection"> <div class="row features-collection">
<div class="col-sm-4"> <div class="col-sm-4">
<img src="/assets/img/home/private.svg" height="100" alt="{% t pages.home.feature-private-heading %}"> <img src="/assets/img/home/private.svg" height="100" alt="{% t pages.home.feature-private-heading %}">
<h2>{% t pages.home.feature-private-heading %}</h2> <h2>{% t pages.home.feature-private-heading %}</h2>
{% tmd pages.home.feature-private-text %} {% tmd pages.home.feature-private-text %}
</div> </div>
<div class="col-sm-4"> <div class="col-sm-4">
<img src="/assets/img/home/instant.svg" height="100" alt="{% t pages.home.feature-instant-heading %}"> <img src="/assets/img/home/instant.svg" height="100" alt="{% t pages.home.feature-instant-heading %}">
<h2>{% t pages.home.feature-instant-heading %}</h2> <h2>{% t pages.home.feature-instant-heading %}</h2>
{% tmd pages.home.feature-instant-text %} {% tmd pages.home.feature-instant-text %}
</div> </div>
<div class="col-sm-4"> <div class="col-sm-4">
<img src="/assets/img/home/secure.svg" height="100" alt="{% t pages.home.feature-secure-heading %}"> <img src="/assets/img/home/secure.svg" height="100" alt="{% t pages.home.feature-secure-heading %}">
<h2>{% t pages.home.feature-secure-heading %}</h2> <h2>{% t pages.home.feature-secure-heading %}</h2>
{% tmd pages.home.feature-secure-text %} {% tmd pages.home.feature-secure-text %}
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<!-- <!--
MERCHANTS MERCHANTS
--> -->
<section> <section>
<div class="content"> <div class="content">
<div> <div>
<h2>{% t pages.home.merchants-heading %}</h2> <h2>{% t pages.home.merchants-heading %}</h2>
{% tmd pages.home.merchants-text %} {% tmd pages.home.merchants-text %}
</div> </div>
<div class="logo-collection"> <div class="logo-collection">
<div class="logo-collection__logo"> <div class="logo-collection__logo">
<img src="/assets/img/home/bolehvpn.png" class="logo-collection__image"> <img src="/assets/img/home/bolehvpn.png" class="logo-collection__image">
</div> </div>
<div class="logo-collection__logo"> <div class="logo-collection__logo">
<img src="/assets/img/home/node40.png" class="logo-collection__image"> <img src="/assets/img/home/node40.png" class="logo-collection__image">
</div> </div>
<div class="logo-collection__logo"> <div class="logo-collection__logo">
<img src="/assets/img/home/protonmail.png" class="logo-collection__image"> <img src="/assets/img/home/protonmail.png" class="logo-collection__image">
</div> </div>
<div class="logo-collection__logo"> <div class="logo-collection__logo">
<img src="/assets/img/home/qhoster.png" class="logo-collection__image"> <img src="/assets/img/home/qhoster.png" class="logo-collection__image">
</div> </div>
</div> </div>
<div> <div>
<a href="#" class="btn-blue">{% t pages.home.merchants-btn %}</a> <a href="#" class="btn-blue">{% t pages.home.merchants-btn %}</a>
<a href="#" class="btn-blue">{% t pages.home.merchants-join-btn %}</a> <a href="#" class="btn-blue">{% t pages.home.merchants-join-btn %}</a>
</div> </div>
</div> </div>
</section> </section>
<!-- <!--
NETWORK ARCHITECTURE NETWORK ARCHITECTURE
--> -->
<section> <section>
<div class="content"> <div class="content">
<div class="row"> <div class="row">
<div class="col-sm-6"> <div class="col-sm-6">
<h2>{% t pages.home.architecture-heading %}</h2> <h2>{% t pages.home.architecture-heading %}</h2>
{% tmd pages.home.architecture-text %} {% tmd pages.home.architecture-text %}
<a href="#" class="btn-blue">{% t pages.home.architecture-btn %}</a> <a href="#" class="btn-blue">{% t pages.home.architecture-btn %}</a>
</div> </div>
<div class="col-sm-6 home-architecture-graphic"> <div class="col-sm-6 home-architecture-graphic">
<img src="/assets/img/home/code.png" alt="{% t pages.home.architecture-heading %}"> <img src="/assets/img/home/code.png" alt="{% t pages.home.architecture-heading %}">
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<!-- <!--
SELF GOVERNING | SELF FUNDING SELF GOVERNING | SELF FUNDING
--> -->
<section> <section>
<div class="content row"> <div class="content">
<div class="col-sm-6 col-sm-push-6"> <div class="row">
<h2>{% t pages.home.governance-heading%}</h2> <div class="col-sm-6 col-sm-push-6">
<h2>{% t pages.home.governance-heading%}</h2>
{% tmd pages.home.governance-text %} {% tmd pages.home.governance-text %}
<a href="#" class="btn-blue">{% t pages.home.proposal-btn %}</a> <a href="#" class="btn-blue">{% t pages.home.proposal-btn %}</a>
<a href="#" class="btn-blue">{% t pages.home.proposal-submit-btn %}</a> <a href="#" class="btn-blue">{% t pages.home.proposal-submit-btn %}</a>
</div> </div>
<div class="col-sm-6 col-sm-pull-6 home-budgets-graphic"> <div class="col-sm-6 col-sm-pull-6 home-budgets-graphic">
<img src="/assets/img/home/budgets.png" alt="{% t pages.home.governance-heading%}"> <img src="/assets/img/home/budgets.png" alt="{% t pages.home.governance-heading%}">
</div> </div>
</div> </div>
</section> </div>
</section>
<!-- <!--
FASTEST GROWING NETWORK FASTEST GROWING NETWORK
--> -->
<section> <section>
<div class="content row"> <div class="content">
<div class="col-sm-6"> <div class="row">
<h2>{% t pages.home.network-growth-heading %}</h2> <div class="col-sm-6">
<h2>{% t pages.home.network-growth-heading %}</h2>
{% tmd pages.home.network-growth-text %} {% tmd pages.home.network-growth-text %}
<a href="#" class="btn-blue">{% t pages.home.network-growth-btn %}</a> <a href="#" class="btn-blue">{% t pages.home.network-growth-btn %}</a>
</div> </div>
<div class="col-sm-6 home-network-graphic"> <div class="col-sm-6 home-network-graphic">
<img src="/assets/img/home/graph.png" alt="{% t pages.home.network-growth-heading %}"> <img src="/assets/img/home/graph.png" alt="{% t pages.home.network-growth-heading %}">
</div> </div>
</div> </div>
</section> </div>
</section>
<!-- <!--
EVOLUTION EVOLUTION
--> -->
<section> <section>
<div class="content row"> <div class="content">
<div class="col-sm-6 col-sm-push-6"> <div class="row">
<h2>{% t pages.home.evolution-heading %}</h2> <div class="col-sm-6 col-sm-push-6">
<h2>{% t pages.home.evolution-heading %}</h2>
{% tmd pages.home.evolution-text %} {% tmd pages.home.evolution-text %}
<a href="#" class="btn-blue">{% t pages.home.evolution-btn %}</a> <a href="#" class="btn-blue">{% t pages.home.evolution-btn %}</a>
</div> </div>
<div class="col-sm-6 col-sm-pull-6 home-evolution-graphic"> <div class="col-sm-6 col-sm-pull-6 home-evolution-graphic">
<img src="/assets/img/home/stock-photo-63187555-she-ll-source-whatever-her-customers-are-looking-for.jpg" alt="Merchant using a laptop"> <img src="/assets/img/home/stock-photo-63187555-she-ll-source-whatever-her-customers-are-looking-for.jpg" alt="Merchant using a laptop">
</div> </div>
</div> </div>
</section> </div>
</section>
<!-- <!--
LATEST NEWS LATEST NEWS
--> -->
<section class="home-latest-news"> <section class="home-latest-news">
<div class="content"> <div class="content">
<h2>{% t pages.home.news-heading %}</h2> <h2>{% t pages.home.news-heading %}</h2>
<div class="row"> <div class="row">
{% for post in site.posts limit:4 %} {% for post in site.posts limit:4 %}
<div class="col-sm-6 col-md-3"> <div class="col-sm-6 col-md-3">
<div class="news-post"> <div class="news-post">
<div class="news-image"> <div class="news-image">
{% if post.image %} {% if post.image %}
<img src="{{ post.image }}"> <img src="{{ post.image }}">
{% endif %} {% endif %}
</div> </div>
<div class="news-body"> <div class="news-body">
<h3 class="news-title">{{ post.title }}</h3> <h3 class="news-title">{{ post.title }}</h3>
<div class="date">{{ post.date | date: "%b %d, %Y" }}</div> <div class="date">{{ post.date | date: "%b %d, %Y" }}</div>
<p>{{ post.excerpt | strip_html | truncate: 250 }}</p> <p>{{ post.excerpt | strip_html | truncate: 250 }}</p>
<a class="read-more" href="{{ basenav }}{{ post.url }}">Read More...</a> <a class="read-more" href="{{ basenav }}{{ post.url }}">Read More...</a>
</div> </div>
</div> </div>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
<div> <div>
<a href="#" class="btn-blue">{% t pages.home.news-btn %}</a> <a href="#" class="btn-blue">{% t pages.home.news-btn %}</a>
</div> </div>
</div> </div>
</section> </section>
<!-- <!--
GET STARTED GET STARTED
--> -->
<section class="home-get-started-cta"> <section class="home-get-started-cta">
<div class="content"> <div class="content">
<h2>{% t pages.home.get-started-heading %}</h2> <h2>{% t pages.home.get-started-heading %}</h2>
{% tmd pages.home.get-started-text %} {% tmd pages.home.get-started-text %}
<a href="#" class="btn-white-solid">{% t pages.home.get-started-btn %}</a> <a href="#" class="btn-white-solid">{% t pages.home.get-started-btn %}</a>
<img src="/assets/img/home/macbook.png" alt=""> <img src="/assets/img/home/macbook.png" alt="">
</div> </div>
</section> </section>
</div> </div>