update get-started

homepage/pelicanconf.py

@@ -75,6 +75,7 @@ PATREON_URL = 'https://www.patreon.com/offen'
 LINKEDIN_URL = 'https://www.linkedin.com/company/hioffen'
 TWITTER_URL = 'https://twitter.com/hioffen'
 RELEASE_DIRECT_URL = 'https://get.offen.dev'
+DOCKER_DIRECT_URL = '#'
 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/static/css/fix.css

@@ -38,10 +38,13 @@ COLORS NEW
 	 color: #39352A;
 }
 .cclr-brd-black-mid {
-	 color: #39352A;
+	 border-color: #39352A;
 }
 
 /* White */
+.cclr-bg-white-dark {
+	background-color: #f9f7f2;
+}
 .cclr-bg-white-fade {
 	background: linear-gradient(218.39deg, #FFFFFF 1.47%, rgba(255, 255, 255, 0) 98.24%), #F3F0E7;
 }

homepage/theme/templates/base.html

@@ -165,7 +165,10 @@
         </div>
       </div>
       {% else %}
-      <div class="w-100 cclr-mid-mint gray ph4 pb4">
+      <div class="w-100 cclr-mid-mint ph4 pb4">
+        <div id="bg-pattern">
+
+
         <div class="flex flex-row-l flex-column w-100-l mw6-m center-m pt4 pb6">
           <div class="w-25-l mt3 mr3 fnt-cclr-mid-black">
             <p class="ma0">
@@ -182,6 +185,10 @@
             {{ BUILD_DATE }}
           </div>
         </div>
+
+
+
+        </div>
       </div>
       {% endif %}
     </div>

homepage/theme/templates/getstarted.html

@@ -3,40 +3,50 @@
 {% set is_getstarted = 'true' %}
 
 {% block content %}
-<div class="w-100 mt5-ns cclr-dark-white">
+<div class="w-100 mt5-ns cclr-bg-white-dark">
-  <div class="mw7 center pt5 pb5 ph3 ph5-ns bg-white">
+  <div class="mw7 center pt5 pb5 ph4 bg-white">
-    <div class="w-100 center">
+    <div class="w-100 center tc">
-      <h2 class="f1-ns f2 normal tc ma0 mb4">
+      <h2 class="f1-ns f2 normal ma0 mb4">
-        Test Offen today
+        Get started
       </h2>
-      <p class="tc tl-ns ma0 mb2 gray">
+      <h3 class="f25 f2-ns normal ma0 mb5 mh6-ns">
-        Our alpha release is ready for testing. <em>Offen is free and always will be.</em>
+        Choose your favorite way to self host Offen.
-      </p>
+      </h3>
-      <p class="tc tl-ns ma0 mb4 gray">
+
-        Be aware that things can still contain issues and that the upgrade path may be broken with upcoming releases.
-      </p>
       <div class="flex flex-column items-center">
-        <p class="b tc lh-title tracked-min ma0 mt3 mb2">
+        <p class="lh-title ma0 mb2 gray">
           Single binary file <br>for Linux, Windows or MacOS
         </p>
-        <a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black mb3 white cclr-mid-black" href="{{ RELEASE_DIRECT_URL }}" rel="noopener">Download</a>
+        <a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid mb5 white cclr-bg-black-mid" href="{{ RELEASE_DIRECT_URL }}" rel="noopener">Download</a>
-        <p class="b tc lh-title tracked-min ma0 mt4 mb2">
+
-          Your own Offen instance
+        <p class="lh-title ma0 mb2 gray">
+          Your own instance in Docker <br>development environment
         </p>
-        <a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black mb4 white cclr-mid-black" href="{{ HEROKU_DIRECT_URL }}" rel="noopener" target="_blank">Deploy to Heroku</a>
+        <a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid mb5 white cclr-bg-black-mid" href="{{ DOCKER_DIRECT_URL }}" rel="noopener">Deploy with Docker</a>
+
+        <p class="lh-title ma0 mb2 gray">
+          Your own instance on Heroku
+        </p>
+        <a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid mb6 white cclr-bg-black-mid" href="{{ HEROKU_DIRECT_URL }}" rel="noopener">Deploy to Heroku</a>
       </div>
-      <hr class="mt5 mb4 b--black-05">
+
-      <h2 class="f25 normal tc ma0 mb4">
+
-        Kick things off
+      <p class="tc ma0 mb4 mh5-ns gray">
-      </h2>
+        Be aware that things can still contain issues and that the upgrade path may be broken with upcoming releases.
-      <p class="tc tl-ns ma0 mb4 gray">
-        Running a website and want to collect usage statistics? Like to contribute as a developer? Our Docs will help you kick off.
       </p>
+      <hr class="ma0 mb5 b--black-05">
+
+
+
+
+      <h3 class="f25 normal ma0 mb5">
+        Read the docs.
+      </h3>
       <div class="flex flex-column items-center">
-        <p class="b tc lh-title tracked-min ma0 mt3 mb2">
+        <p class="lh-title ma0 mb2 gray">
-          Details on how to <br>run, use and develop Offen
+          Details on how to<br> install and run Offen
         </p>
-        <a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black mb5 white cclr-mid-black" href="https://docs.offen.dev/" rel="noopener" target="_blank">Open Docs</a>
+        <a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid mb5 cclr-fnt-black-mid" href="https://docs.offen.dev/" rel="noopener" target="_blank">Open Docs</a>
       </div>
     </div>
   </div>