add heroku button

homepage/content/articles/0030-milestone-2.md

@@ -19,7 +19,7 @@ We finished milestone 2. Here is what we' ve been doing for the last 8 weeks.
 A first approach to one of our major features is implemented. Websites that embed the Offen script now display a user consent banner. In case of user's deny, no other requests than loading the script are made from then on.  
 [Learn more](https://analytics.offen.dev/){: target="_blank" data-button="yellow"} 
 
-### Accidental leaks dont expose data
+### Accidental leaks don't expose data
 We encrypt all event data before it leaves the browser. [Two types](https://github.com/offen/offen/pull/270){: target="_blank"}  of crypto implementations are used for this. This allows us to handle user data from both https and http-only sites securely.
 
 ### What exactly happens on your website?

homepage/pelicanconf.py

@@ -71,6 +71,8 @@ PATREON_URL = 'https://www.patreon.com/offen'
 LINKEDIN_URL = 'https://www.linkedin.com/company/hioffen'
 TWITTER_URL = 'https://twitter.com/hioffen'
 RELEASE_URL = 'https://github.com/offen/offen/releases/latest/'
-RELEASE_DIRECT_URL = 'https://github.com/offen/offen/releases/download/v0.1.0-alpha.2/offen-v0.1.0-alpha.2.tar.gz'
+RELEASE_DIRECT_URL = 'https://get.offen.dev'
+HEROKU_URL = 'https://github.com/offen/heroku'
+HEROKU_DIRECT_URL = 'https://heroku.com/deploy?template=https://github.com/offen/heroku/tree/master'
 
 OFFEN_ACCOUNT_ID = os.environ.get('OFFEN_ACCOUNT_ID', None)

homepage/theme/templates/getstarted.html

@@ -15,13 +15,20 @@
         </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">
+        <p class="b tc lh-title tracked-min ma0 mt3 mb2">
-          Single binary file for <br>Linux, Windows or MacOS
+          Single binary file <br>for 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="{{ RELEASE_DIRECT_URL }}" rel="noopener">Download</a>
         <div class="tc">
           <a class="w-100 tracked-min b link dim mb3 fnt-cclr-mint-bright" href="{{ RELEASE_URL }}" rel="noopener" target="_blank">Open GitHub release page</a>
         </div>
+        <p class="b tc lh-title tracked-min ma0 mt4 mb2">
+          Your own instance on Heroku
+        </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="{{ HEROKU_DIRECT_URL }}" rel="noopener" target="_blank">Deploy</a>
+        <div class="tc">
+          <a class="w-100 tracked-min b link dim mb3 fnt-cclr-mint-bright" href="{{ HEROKU_URL }}" rel="noopener" target="_blank">Open GitHub configuration repository</a>
+        </div>
       </div>
     </div>
   </div>
@@ -36,12 +43,12 @@
           </em>
         </h2>
         <p class="ma0 mb3 tc tl-ns">
-          Running a website and need to collect usage statistics? Want to contribute as a developer? Our guides will help you kick off.
+          Running a website and need to collect usage statistics? Want to contribute as a developer? Our guides 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">
+        <p class="b tc lh-title tracked-min ma0 mt3 mb2">
-          Details on how to run, use <br>and develop Offen
+          Details on how to <br>run, use 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="https://docs.offen.dev/" rel="noopener" target="_blank">Open guides</a>
       </div>

homepage/theme/templates/index.html

@@ -107,13 +107,20 @@
         </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">
+        <p class="b tc lh-title tracked-min ma0 mt3 mb2">
-          Single binary file for <br>Linux, Windows or MacOS
+          Single binary file <br>for 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="{{ RELEASE_DIRECT_URL }}" rel="noopener">Download</a>
         <div class="tc">
           <a class="w-100 tracked-min b link dim mb3 fnt-cclr-mint-bright" href="{{ RELEASE_URL }}" rel="noopener" target="_blank">Open GitHub release page</a>
         </div>
+        <p class="b tc lh-title tracked-min ma0 mt4 mb2">
+          Your own instance on Heroku
+        </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="{{ HEROKU_DIRECT_URL }}" rel="noopener" target="_blank">Deploy</a>
+        <div class="tc">
+          <a class="w-100 tracked-min b link dim mb3 fnt-cclr-mint-bright" href="{{ HEROKU_URL }}" rel="noopener" target="_blank">Open GitHub configuration repository</a>
+        </div>
       </div>
     </div>
   </div>
@@ -128,12 +135,12 @@
           </em>
         </h2>
         <p class="ma0 mb3 tc tl-ns">
-          Running a website and need to collect usage statistics? Want to contribute as a developer? Our guides will help you kick off.
+          Running a website and need to collect usage statistics? Want to contribute as a developer? Our guides 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">
+        <p class="b tc lh-title tracked-min ma0 mt3 mb2">
-          Details on how to run, use <br>and develop Offen
+          Details on how to <br>run, use 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="https://docs.offen.dev/" rel="noopener" target="_blank">Open guides</a>
       </div>