offen/website
2
0
Fork 0
mirror of https://github.com/offen/website.git synced 2024-11-22 09:00:28 +01:00
Code Issues Projects Releases Wiki Activity

Merge pull request #50 from offen/index-update

Browse Source 
Index update
This commit is contained in:
Frederik Ring 2020-02-25 19:53:09 +01:00 committed by GitHub
commit 9c772d9810
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 83 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
homepage/content/pages/index.md
View File

@ -1,5 +1,5 @@
title: Transparent web analytics for everyone | Offen
description: Offen is a free and open source analytics software for websites and web applications. Users can access their data while the operators treat it with respect.
description: Offen is a fair alternative to common web analytic tools. Respect your users while gaining insight into their behavior. Self hosted, open source and free.
save_as: index.html
template: index
sitemap_priority: 1.0

2
homepage/pelicanconf.py
View File

@ -70,9 +70,7 @@ GPG_KEY_FILE = '74B041E23DB29D552644CEB1B18C633D6967FE3F.asc'
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://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)

36
homepage/theme/static/css/fix.css
View File

@ -66,17 +66,21 @@ LAYOUT
}
}
/* Custom Tachyons class */
.w55-container,
.w55 {
width: 18.5rem;
width: 20rem;
}
.w56 {
width: 20rem;
height: 480px;
}
/* Custom media query - extra small */
@media only screen and (max-width: 30em) {
.w55 {
@media only screen and (max-width: 40em) {
.w55-container {
width: 100%;
}
}
/* ---------------------------------------------------
TYPO AND LAYOUT ELEMENTS
----------------------------------------------------*/
@ -105,10 +109,14 @@ em {
background: linear-gradient(transparent 66%, #fde28c 66%);
font-style: normal;
}
.em-extra {
.em-mint {
background: linear-gradient(transparent 66%, #BBD9D3 66%);
font-style: normal;
}
.em-mint-bright {
background: linear-gradient(transparent 66%, #CEEBE5 66%);
font-style: normal;
}
hr {
margin-left: -1rem;
margin-right: -1rem;
@ -335,11 +343,11 @@ GRAPHICS
background: url(/theme/images/gfx-intro.svg);
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 200px 130px;
background-position: 200px 80px;
}
@media only screen and (min-width: 30.1em) and (max-width: 60em) {
#bg-intro {
background-position: calc(20% + 120px) 130px;
background-position: calc(20% + 120px) 80px;
}
}
@media only screen and (max-width: 30em) {
@ -347,6 +355,20 @@ GRAPHICS
background-position: 10px 60px;
}
}
/* --------------------------------------------- */
#bg-feature-1 {
background: url(/theme/images/gfx-feature-1.png) center;
background-repeat: no-repeat;
}
#bg-feature-2 {
background: url(/theme/images/gfx-feature-2.png) center;
background-repeat: no-repeat;
}
#bg-feature-3 {
background: url(/theme/images/gfx-feature-3.png) center;
background-repeat: no-repeat;
}
/* --------------------------------------------- */
#bg-feature {
background: url(/theme/images/gfx-pattern-mint-bright.svg) center;
}

BIN
homepage/theme/static/images/gfx-feature-1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 114 KiB

BIN
homepage/theme/static/images/gfx-feature-2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 146 KiB

BIN
homepage/theme/static/images/gfx-feature-3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 122 KiB

1
homepage/theme/static/images/gfx-pattern-mint-mid.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 21 KiB

6
homepage/theme/templates/base.html
View File

@ -86,7 +86,7 @@
<div class="pt3 pb6 ph3" id="bg-cta-bottom">
<div class="mw8 center">
<div class="flex flex-wrap justify-center">
<div class="w55 mh3 pt5 tc">
<div class="w55 ph3 pt5 tc">
<h2 class="f25 normal lh-solid ma0 mb3">
Participate
</h2>
@ -96,7 +96,7 @@
<a class="b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black fnt-cclr-mid-black" href="{{GITHUB_ORG}}" rel="noopener" target="_blank">Get involved</a>
</div>
{% if is_article != 'true' %}
<div class="w55 mh3 pt5 tc">
<div class="w55 ph3 pt5 tc">
<h2 class="f25 normal lh-solid ma0 mb3">
In the making
</h2>
@ -106,7 +106,7 @@
<a class="b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black fnt-cclr-mid-black" href="/blog/">Project status</a>
</div>
{% endif %}
<div class="w55 mh3 pt5 tc">
<div class="w55 ph3 pt5 tc">
<h2 class="f25 normal lh-solid ma0 mb3">
Ethical internet
</h2>

12
homepage/theme/templates/getstarted.html
View File

@ -18,17 +18,11 @@
<p class="b tc lh-title tracked-min ma0 mt3 mb2">
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>
<a class="w-100 tc b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black mb3 fnt-cclr-mid-black" href="{{ RELEASE_DIRECT_URL }}" rel="noopener">Download</a>
<p class="b tc lh-title tracked-min ma0 mt4 mb2">
Your own instance on Heroku
Your own Offen instance
</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>
<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 to Heroku</a>
</div>
</div>
</div>

90
homepage/theme/templates/index.html
View File

@ -3,7 +3,7 @@
{% block content %}
<div class="w-100 mt5-ns cclr-mid-yellow">
<div class="mw8 center" id="bg-intro">
<div class="flex justify-center pt6-ns pt5 ph4">
<div class="flex justify-center pt5 ph4">
<div class="dn db-ns w-20 tr pr3 pb3">
<img src="/theme/images/offen-icon-white.svg" alt="Offen logo" width="58" height="63">
</div>
@ -20,9 +20,9 @@
Transparent <span>web analytics</span>
</h1>
<p class="ma0 mb4">
Offen is an open source analytics software for websites <span>and web applications. It allows respectful handling of data </span> <span>for operators and users.</span>
Offen is a fair alternative to common web analytic tools. <span>Pay respect to your users while gaining insight into their behavior. </span>Self hosted, open source and free.
</p>
<div class="pb6">
<div class="pb5 mb2">
<a class="b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black fnt-cclr-mid-black" href="/get-started/" rel="noopener">Start now</a>
</div>
</div>
@ -30,40 +30,49 @@
</div>
</div>
<div class="w-100 cclr-mid-mint">
<div class="pt3 pb6 ph3" id="bg-feature">
<div class="mw8 center">
<div class="flex flex-wrap justify-around">
<div class="w55 mh3 mt5 tc cclr-mid-mint">
<h2 class="f25 normal lh-solid ma0 mb3">
<em>Free & Open</em>
</h2>
<p class="ma0">
Anyone can audit our open source code to verify it works as intended. Offen will always be available for free.
</p>
<div class="w-100" id="bg-feature">
<div class="center">
<div class="flex flex-wrap justify-center w-100">
<div class="flex justify-center w55-container" id="bg-feature-1">
<div class="w56 tc pa3">
<h2 class="f25 normal lh-solid mt5 mb3">
<em class="em-mint-bright">
Free & Open
</em>
</h2>
<p class="ma0 mb5">
Our open source code can be fully audited by the community. It will always be available for free. Seriously.
</p>
</div>
</div>
<div class="flex justify-center w55-container" id="bg-feature-3">
<div class="w56 tc pa3">
<h2 class="f25 normal lh-solid mt6 mb3">
<em class="em-mint-bright">
Self hosted
</em>
</h2>
<p class="ma0">
Comply with GDPR guidelines. Don't share data with third parties. Your users have full access to their data.
</p>
</div>
</div>
<div class="flex justify-center w55-container" id="bg-feature-2">
<div class=" w56 tc pa3">
<h2 class="f25 normal lh-solid mt7 mb3">
<em class="em-mint-bright">
Fair & Secure
</em>
</h2>
<p class="ma0">
Pay respect to your website visitors. Gain valuable insights at the same time. All data is encrypted end-to-end.
</p>
</div>
</div>
</div>
<div class="w55 mh3 mt5 tc cclr-mid-mint">
<h2 class="f25 normal lh-solid ma0 mb3">
<em>Fair & Secure</em>
</h2>
<p class="ma0">
Pay respect to your website visitors and gain insights as a user at the same time. All data is encrypted end-to-end.
</p>
</div>
<div class="w55 mh3 mt5 tc cclr-mid-mint">
<h2 class="f25 normal lh-solid ma0 mb3">
<em>Easy to use</em>
</h2>
<p class="ma0">
Simply paste our code into the source of your website. Users can visit the auditorium to access their data.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="w-100 cclr-mid-black white">
<div class="pt3 pb6 ph4" id="bg-cta-top">
<div class="flex justify-end mw6 center pt5">
@ -93,7 +102,6 @@
</div>
{% endblock %}
{% block outro %}
<div class="w-100" id="bg-feature">
<div class="pv5 ph4">
@ -110,17 +118,11 @@
<p class="b tc lh-title tracked-min ma0 mt3 mb2">
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>
<a class="w-100 tc b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black mb3 fnt-cclr-mid-black" href="{{ RELEASE_DIRECT_URL }}" rel="noopener">Download</a>
<p class="b tc lh-title tracked-min ma0 mt4 mb2">
Your own instance on Heroku
Your own Offen instance
</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>
<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 to Heroku</a>
</div>
</div>
</div>
@ -130,7 +132,7 @@
<div class="mw8 center flex flex-column flex-row-ns mb3 mb5 cclr-mid-yellow">
<div class="w-100 w-60-ns">
<h2 class="f25 normal tc tl-ns ma0 mb3">
<em class="em-extra">
<em class="em-mint">
Get started now
</em>
</h2>