website/homepage/theme/templates/getstarted.html

{% extends "page.html" %}

{% set is_getstarted = 'true' %}

{% block content %}
<div class="w-100 mt5-ns cclr-mid-mint">
  <div class="pv5 ph4">
    <div class="mw8 center flex flex-column flex-row-ns">
      <div class="w-100 w-60-ns">
        <h2 class="f25 normal ma0 mb3">
          <em>Our alpha release</em>
        </h2>
        <p class="ma0 mb3">
          Offen is in active development. Do something brave and test our very first alpha release today. It’s free and always will be.
        </p>
      </div>
      <div class="w-100 w-40-ns ml4-m ml6-l">
        <p class="tc lh-title tracked-min ma0 mt3-ns mb2 white">
          Single binary file for <br>Linux, Windows or MacOS
        </p>
        <a class="w-100 tc b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black mb2 fnt-cclr-mid-black" href="#" rel="noopener">Download</a>
        <div class="tc">
          <a class="w-100 tracked-min b link dim mb3 fnt-cclr-mint-bright" href="#" rel="noopener">Open GitHub release page</a>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="w-100 cclr-mid-yellow">
  <div class="pv5 ph4">
    <div class="mw8 center flex flex-column flex-row-ns mb3">
      <div class="w-100 w-60-ns">
        <h2 class="f25 normal ma0 mb3">
          <em class="em-extra">
            Get started now
          </em>
        </h2>
        <p class="ma0 mb3">
          Running a website and need to collect usage statistics? Want to contribute as a developer? Our guides will help you kick off.
        </p>
      </div>
      <div class="w-100 w-40-ns ml4-m ml6-l">
        <p class="tc lh-title tracked-min ma0 mt3-ns mb2 white">
          Details on how to run, use <br>and develop Offen
        </p>
        <a class="w-100 tc b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black mb3 fnt-cclr-mid-black" href="#" rel="noopener">Open guides</a>
      </div>
    </div>
  </div>
</div>
{% endblock %}