2
0
mirror of https://github.com/offen/website.git synced 2024-11-22 09:00:28 +01:00

Merge pull request #109 from offen/update-august-5

Update august 5
This commit is contained in:
Hendrik Niefeld 2020-08-06 20:41:36 +02:00 committed by GitHub
commit 693ff8734c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
21 changed files with 165 additions and 66 deletions

View File

@ -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

View File

@ -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

View File

@ -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

View File

@ -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

View File

@ -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

View File

@ -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

View File

@ -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

View File

@ -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

View File

@ -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

View File

@ -3,6 +3,7 @@ description: This link isnt working.
save_as: 404.html
no_stats: true
exclude_from_sitemap: true
bottom_cta: budget
![Page not Found](/theme/images/offen-404.png){:class="image-text-600-338"}

View File

@ -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.

View File

@ -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

View File

@ -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

View File

@ -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/'

View File

@ -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;

View File

@ -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 %}

View File

@ -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">

View File

@ -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>

View File

@ -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">

View File

@ -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">

View File

@ -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>