mirror of
https://github.com/offen/website.git
synced 2024-11-23 01:20:29 +01:00
Merge pull request #110 from offen/development
Update get started und bottom cta
This commit is contained in:
GitHub
commit
b5fc536228
@ -5,6 +5,7 @@ slug: laying-foundation-for-fair-web-analytics
|
||||
sitemap_priority: 0.6
|
||||
image_url: /theme/images/offen-blog-0010-milestone1.jpg
|
||||
author: Hendrik Niefeld
|
||||
bottom_cta: blog
|
||||
|
||||
# Episode One — Laying the foundation for fair web analytics
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ slug: untold-roads-versioning-early-stage-software
|
||||
sitemap_priority: 0.7
|
||||
image_url: /theme/images/offen-blog-0020-untoldRoads.jpg
|
||||
author: Frederik Ring
|
||||
bottom_cta: blog
|
||||
|
||||
# Untold roads to v1.0
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ slug: collecting-data-securely
|
||||
sitemap_priority: 0.6
|
||||
image_url: /theme/images/offen-blog-0030-milestone-2.jpg
|
||||
author: Hendrik Niefeld
|
||||
bottom_cta: blog
|
||||
|
||||
# Episode Two — Collecting data securely
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ slug: test-offen-today
|
||||
sitemap_priority: 0.7
|
||||
image_url: /theme/images/offen-blog-0040-test-offen-today.jpg
|
||||
author: Hendrik Niefeld
|
||||
bottom_cta: blog
|
||||
|
||||
# Test Offen today
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ slug: displaying-data
|
||||
sitemap_priority: 0.6
|
||||
image_url: /theme/images/offen-blog-0050-milestone-3.jpg
|
||||
author: Frederik Ring
|
||||
bottom_cta: blog
|
||||
|
||||
# Episode Three — Displaying data
|
||||
|
||||
|
||||
@ -6,6 +6,7 @@ sitemap_priority: 0.6
|
||||
image_url: /theme/images/offen-blog-0060-milestone-4.jpg
|
||||
image_caption: <a class="link b dim moon-gray" target="_blank" href="https://www.flickr.com/photos/wocintechchat/25926651781/in/album-72157664006621903/">Photo</a> by WOCinTechChat / <a class="link b dim moon-gray" href="https://creativecommons.org/licenses/by/3.0/" target="_blank">CC BY 3.0</a>
|
||||
author: Frederik Ring
|
||||
bottom_cta: blog
|
||||
|
||||
# Episode Four — Managing data
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ slug: hosting-offen-on-budget
|
||||
sitemap_priority: 0.7
|
||||
image_url: /theme/images/offen-blog-0070-budget.jpg
|
||||
author: Frederik Ring
|
||||
bottom_cta: blog
|
||||
|
||||
# Hosting Offen on a budget
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ slug: privacy-friendly-and-fair-web
|
||||
sitemap_priority: 0.7
|
||||
image_url: /theme/images/offen-blog-0080-beta.jpg
|
||||
author: Hendrik Niefeld
|
||||
bottom_cta: blog
|
||||
|
||||
# Let's build a web that is privacy friendly and fair
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ slug: resilience-documentation
|
||||
sitemap_priority: 0.6
|
||||
image_url: /theme/images/offen-blog-0090-milestone-5.jpg
|
||||
author: Frederik Ring
|
||||
bottom_cta: blog
|
||||
|
||||
# Episode Five — Resilience and documentation
|
||||
|
||||
|
||||
@ -3,6 +3,7 @@ description: This link isn’t working.
|
||||
save_as: 404.html
|
||||
no_stats: true
|
||||
exclude_from_sitemap: true
|
||||
bottom_cta: budget
|
||||
|
||||
|
||||
{:class="image-text-600-338"}
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
title: About | Offen
|
||||
description: Who we are, who supports us and how you can can get in touch.
|
||||
slug: about
|
||||
bottom_cta: fair
|
||||
|
||||
## About
|
||||
|
||||
|
||||
### Status Quo
|
||||
|
||||
Offen is created by [Frederik Ring][frederik-ring]{: target="_blank"} and [Hendrik Niefeld][hendrik-niefeld]{: target="_blank"} and is currently being conceptually designed and in active development, both as a product as well as as a software.
|
||||
|
||||
@ -2,6 +2,7 @@ title: Deep dive | Offen
|
||||
description: What do users know about their data? How can they access it? Do operators benefit from a careful handling of user data? Does Offen work in accordance with GDPR?
|
||||
slug: deep-dive
|
||||
sitemap_priority: 0.7
|
||||
bottom_cta: budget
|
||||
|
||||
## Deep dive
|
||||
|
||||
|
||||
@ -2,6 +2,7 @@ title: Legal Notice | Offen
|
||||
description: Information in accordance with Section 5 TMG
|
||||
slug: legal-notice
|
||||
exclude_from_sitemap: true
|
||||
bottom_cta: fair
|
||||
|
||||
## Legal Notice
|
||||
|
||||
|
||||
@ -95,6 +95,7 @@ MASTODON_URL = 'https://fosstodon.org/@offen'
|
||||
RELEASE_DIRECT_URL = 'https://get.offen.dev'
|
||||
DOCKER_DIRECT_URL = 'https://hub.docker.com/r/offen/offen'
|
||||
HEROKU_DIRECT_URL = 'https://heroku.com/deploy?template=https://github.com/offen/heroku/tree/master'
|
||||
UBERSPACE_DIRECT_URL = 'https://lab.uberspace.de/guide_offen.html'
|
||||
OFFEN_AUDITORIUM_URL = 'https://offen.offen.dev/auditorium/'
|
||||
DOCS_GETSTARTED_URL = 'https://docs.offen.dev/running-offen/'
|
||||
DOCS_TRYDEMO_URL = 'https://docs.offen.dev/running-offen/test-drive/'
|
||||
|
||||
@ -54,8 +54,14 @@ COLORS
|
||||
.cclr-bg-white-fade-metrics {
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%), #F3F0E7;
|
||||
}
|
||||
|
||||
|
||||
.cclr-bg-white-responsive {
|
||||
background-color: #f9f7f2;
|
||||
}
|
||||
@media only screen and (min-width: 60rem) {
|
||||
.cclr-bg-white-responsive {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
}
|
||||
/* ---------------------------------------------------
|
||||
LAYOUT
|
||||
----------------------------------------------------*/
|
||||
@ -281,6 +287,19 @@ body {
|
||||
.f25 {
|
||||
font-size: 1.9rem;
|
||||
}
|
||||
.f26 {
|
||||
font-size: 1.9rem;
|
||||
}
|
||||
@media only screen and (min-width: 30em) {
|
||||
.f26 {
|
||||
font-size: 2.25rem;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 60em) {
|
||||
.f26 {
|
||||
font-size: 1.9rem;
|
||||
}
|
||||
}
|
||||
span {
|
||||
display: table;
|
||||
}
|
||||
@ -362,7 +381,7 @@ pre {
|
||||
code {
|
||||
border-radius: 3px;
|
||||
font-size: 85%;
|
||||
padding: 0.2em 0.4em;
|
||||
padding: 0.2em 0;
|
||||
color: #39352A;
|
||||
background-color: #EEEEEE;
|
||||
}
|
||||
@ -399,6 +418,12 @@ IMAGES
|
||||
height: 190px;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 60em) {
|
||||
.larger-image {
|
||||
margin-left: 0rem;
|
||||
margin-right: 0rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* ---------------------------------------------------
|
||||
@ -535,7 +560,7 @@ nav ul li {
|
||||
nav ul li a,
|
||||
nav ul li a:visited {
|
||||
display: block;
|
||||
padding: 0 1.4rem;
|
||||
padding: 0 1.2rem;
|
||||
line-height: 4rem;
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
|
||||
@ -5,15 +5,18 @@
|
||||
{% set href = 'blog/' %}
|
||||
{% set no_stats = False %}
|
||||
{% set template = 'archives' %}
|
||||
{% set cta_1 = True %}
|
||||
{% set bottom_cta = 'index' %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mw8 center cclr-bg-white-responsive pr5-l">
|
||||
<div class="flex flex-wrap mt0 mt5-l">
|
||||
{% for article in articles %}
|
||||
<div class="w-100 w-50-l">
|
||||
{% if loop.index != 1 %}
|
||||
<hr class="mb5 b--none">
|
||||
<hr class="mb5 b--none db dn-l">
|
||||
{% endif %}
|
||||
<article class="w-100 mt5-ns gray">
|
||||
<div class="mw7 center pt5 pb5 ph3 ph5-ns bg-white">
|
||||
<article class="w-100 mt5-m mt0-l gray">
|
||||
<div class="mw8 center pv5 ph3 ph5-m pr0-l pl5-l bg-white">
|
||||
<figure class="larger-image mb4">
|
||||
<a href="{{ article.slug }}">
|
||||
<img alt="{{ article.title }}" src="{{ article.image_url }}"/>
|
||||
@ -22,7 +25,7 @@
|
||||
<h6 class="f5 lh-solid normal ma0 light-silver">
|
||||
{{ article.date | strftime('%d %b %Y') }}{% if article.modified %}(article.updated {{ article.modified | strftime('%d %b %Y') }}){% endif %}, {{ article.author }}
|
||||
</h6>
|
||||
<h1 class="f2 normal lh-title mt3 ma0 mb3 light-silver">
|
||||
<h1 class="f26 normal lh-title mt3 ma0 mb3 light-silver">
|
||||
<a href="{{ article.slug }}" class="link b dim gray">{{ article.title }}</a>
|
||||
</h1>
|
||||
<p class="">
|
||||
@ -30,5 +33,8 @@
|
||||
</p>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
{% set image_url = article.image_url %}
|
||||
{% set no_stats = article.no_stats %}
|
||||
{% set template = article.template %}
|
||||
{% set cta_1 = True %}
|
||||
{% set bottom_cta = article.bottom_cta %}
|
||||
|
||||
{% block content %}
|
||||
<main class="w-100 mt5-ns gray">
|
||||
|
||||
@ -102,45 +102,86 @@
|
||||
{% else %}
|
||||
{% block outro %}
|
||||
<div class="w-100 cclr-bg-yellow-mid">
|
||||
<div class="pt3 pb4 ph3 bg-pattern">
|
||||
<div class="pt3 pb4 bg-pattern">
|
||||
<div class="mw8 center">
|
||||
<div class="flex flex-wrap justify-center tc pt3">
|
||||
|
||||
{% if cta_1 %}
|
||||
<div class="wx24 ph4-ns pt4 pb5 cclr-bg-yellow-mid">
|
||||
<h2 class="f25 normal lh-solid ma0 mb3">
|
||||
Participate
|
||||
{% if bottom_cta == 'index' %}
|
||||
<div class="flex flex-wrap justify-center tc ph3 pv5">
|
||||
<div class="ph4-ns cclr-bg-yellow-mid">
|
||||
<h2 class="f26 ma0 mb3 lh-title">
|
||||
<a class="b link dim cclr-fnt-black-mid" href="/">How do fair web analytics work?</a>
|
||||
</h2>
|
||||
<p class="ma0 mb3">
|
||||
Audit our open source code and feel free to make a contribution.
|
||||
</p>
|
||||
<a class="b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid cclr-fnt-black-mid" href="{{ GITHUB_REPO }}" rel="noopener" target="_blank">Get involved</a>
|
||||
<a class="b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid cclr-fnt-black-mid" href="/" rel="noopener">Open summary</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if cta_2 %}
|
||||
<div class="wx24 ph4-ns pt4 pb5 cclr-bg-yellow-mid">
|
||||
<h2 class="f25 normal lh-solid ma0 mb3">
|
||||
In the making
|
||||
{% if bottom_cta == 'blog' %}
|
||||
<div class="flex flex-wrap justify-center tc ph3 pv5">
|
||||
<div class="ph4-ns cclr-bg-yellow-mid">
|
||||
<h2 class="f26 ma0 mb3 lh-title">
|
||||
<a class="b link dim cclr-fnt-black-mid" href="/blog/">Continue reading?</a>
|
||||
</h2>
|
||||
<p class="ma0 mb3">
|
||||
Discover what is already up and running and where we want to go.
|
||||
</p>
|
||||
<a class="b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid cclr-fnt-black-mid" href="/blog/">Open blog</a>
|
||||
<a class="b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid cclr-fnt-black-mid" href="/blog/" rel="noopener">See all blog posts</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="wx24 ph4-ns pt4 pb5 cclr-bg-yellow-mid">
|
||||
<h2 class="f25 normal lh-solid ma0 mb3">
|
||||
Ethical internet
|
||||
{% if bottom_cta == 'fair' %}
|
||||
<div class="ph3 ph0-m pv5">
|
||||
<h2 class="f26 normal tc lh-title ma0 mb4 cclr-bg-yellow-mid">
|
||||
Also on our blog
|
||||
</h2>
|
||||
<p class="ma0 mb3">
|
||||
Help to ensure that Offen is independent and can be sustained.
|
||||
<div class="mw7 center flex flex-wrap ph5-ns">
|
||||
<div class="w-100 w-50-l">
|
||||
<figure class="ma0 pr3-l mb3 mb0-l">
|
||||
<a href="/blog/privacy-friendly-and-fair-web">
|
||||
<img alt="Let's build a web that is privacy friendly and fair" src="/theme/images/offen-blog-0080-beta.jpg">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="w-100 w-50-l cclr-bg-yellow-mid">
|
||||
<div class="pl3-l">
|
||||
<h3 class="f3 normal lh-title ma0 mb2">
|
||||
<a href="/blog/privacy-friendly-and-fair-web" class="link b dim cclr-fnt-black-mid">Let's build a web that is privacy friendly and fair</a>
|
||||
</h3>
|
||||
<p class="ma0">
|
||||
What does the term 'privacy friendly' actually stand for? Mostly it's just about technical issues that don't tackle the underlying problem. <a href="/blog/privacy-friendly-and-fair-web" class="link b dim cclr-fnt-black-mid">Read more</a>
|
||||
</p>
|
||||
<a class="b link dim ph4 pv2 dib b--solid bw2 cclr-brd-black-mid cclr-fnt-black-mid" href="{{ PATREON_URL }}" rel="noopener" target="_blank">Support us</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if bottom_cta == 'budget' %}
|
||||
<div class="ph3 ph0-m pv5">
|
||||
<h2 class="f26 normal tc lh-title ma0 mb4 cclr-bg-yellow-mid">
|
||||
Also on our blog
|
||||
</h2>
|
||||
<div class="mw7 center flex flex-wrap ph5-ns">
|
||||
<div class="w-100 w-50-l">
|
||||
<figure class="ma0 pr3-l mb3 mb0-l">
|
||||
<a href="/blog/hosting-offen-on-budget">
|
||||
<img alt="Hosting Offen on a budget" src="/theme/images/offen-blog-0070-budget.jpg">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="w-100 w-50-l cclr-bg-yellow-mid">
|
||||
<div class="pl3-l">
|
||||
<h3 class="f3 normal lh-title ma0 mb2">
|
||||
<a href="/blog/hosting-offen-on-budget" class="link b dim cclr-fnt-black-mid">Hosting Offen on a budget</a>
|
||||
</h3>
|
||||
<p class="ma0">
|
||||
Here are some real world options for hosting Offen on a budget. Let's compare how they relate in terms of ease of deployment, performance and pricing. <a href="/blog/hosting-offen-on-budget" class="link b dim cclr-fnt-black-mid">Read more</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -19,7 +19,9 @@
|
||||
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 cclr-brd-black-mid mb5 white cclr-bg-black-mid" href="{{ RELEASE_DIRECT_URL }}" rel="noopener">Download</a>
|
||||
|
||||
</div>
|
||||
<hr class="ma0 mb5 b--black-05">
|
||||
<div class="flex flex-column items-center">
|
||||
<p class="lh-title ma0 mb2 gray">
|
||||
Offen as a lightweight<br> Docker image
|
||||
</p>
|
||||
@ -28,7 +30,12 @@
|
||||
<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 }}" target="_blank" rel="noopener">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="{{ HEROKU_DIRECT_URL }}" target="_blank" rel="noopener">Deploy to Heroku</a>
|
||||
|
||||
<p class="lh-title ma0 mb2 gray">
|
||||
Your own instance on Uberspace
|
||||
</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="{{ UBERSPACE_DIRECT_URL }}" target="_blank" rel="noopener">Deploy to Uberspace</a>
|
||||
</div>
|
||||
|
||||
<hr class="ma0 mb5 b--black-05">
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
{% set image_url = page.image_url %}
|
||||
{% set no_stats = page.no_stats %}
|
||||
{% set template = page.template %}
|
||||
{% set cta_2 = True %}
|
||||
{% set bottom_cta = page.bottom_cta %}
|
||||
|
||||
{% block content %}
|
||||
<main class="w-100 mt5-ns gray">
|
||||
|
||||
@ -39,13 +39,20 @@
|
||||
<hr class="ma0 mb5 b--black-05">
|
||||
|
||||
<h3 class="f25 normal tc ma0 mb5">
|
||||
Read the docs
|
||||
Learn more
|
||||
</h3>
|
||||
<div class="flex flex-column items-center">
|
||||
<p class="lh-title tc ma0 mb2 gray">
|
||||
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 cclr-brd-black-mid mb5 cclr-fnt-black-mid" href="{{ DOCS_TRYDEMO_URL }}" rel="noopener" target="_blank">Open Docs</a>
|
||||
<a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 mb5 cclr-brd-black-mid cclr-fnt-black-mid" href="{{ DOCS_TRYDEMO_URL }}" rel="noopener" target="_blank">Open Docs</a>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-column items-center">
|
||||
<p class="lh-title tc ma0 mb2 gray">
|
||||
All you need<br> to use Offen in production
|
||||
</p>
|
||||
<a class="w-100 w5-ns tc b link dim ph4 pv2 dib b--solid bw2 mb5 cclr-brd-black-mid white cclr-bg-black-mid" href="/get-started/" rel="noopener">Get started</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user