Merge pull request #72 from safing/develop

Launch Website 2020
This commit is contained in:
Luke Seers 2020-05-20 18:08:02 +02:00 committed by GitHub
commit c143c70cd8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
230 changed files with 2414 additions and 91782 deletions

View file

@ -14,6 +14,6 @@ docker-compose up
## Supporters
[![Browserstack](/assets/img/external-logos/browserstack.svg)](http://www.browserstack.com/)
[![Browserstack](/assets/img/external/logos/browserstack.svg)](http://www.browserstack.com/)
Browserstack enables us to test our designs on a multitude of devices. This helps us designing our homepage in a truly responsive way.

View file

@ -1,58 +1,90 @@
# For technical reasons, this file is *NOT* reloaded automatically when you use
# 'jekyll serve'. If you change this file, please restart the server process.
# Plugins are rather limited in Github Pages, though a lot of useful ones are supported, check out:
# https://help.github.com/en/github/working-with-github-pages/about-github-pages-and-jekyll#plugins
plugins:
- jekyll-minifier
- jekyll-paginate
- jekyll-redirect-from
# Site settings
####################
###### routes ######
####################
url: https://safing.io
base_url: "/" # the subpath of your site, e.g. /blog
### assets
assets_url: /assets/
img_url: /assets/img/
vendor_url: /vendor/
### pages
about_url: /about/
blog_url: /blog/
community_hub_url: /community-hub/
contact_url: /contact/
esa_bic_url: /esa-bic/
help_url: /support/
newsletter_url: /newsletter/
ownership_url: /ownership/
podcast_url: /podcast/
portmaster_url: /portmaster/
privacy_url: /privacy/
spn_url: /spn/
team_url: /team/
terms_url: /terms/
video_url: /video/
whitepaper_url: /files/whitepaper/Gate17.pdf
### external
account_server_url: https://account.safing.io/
assets_server_url: https://assets.safing.io/
company_agreement_url: https://www.firmenmonitor.at/Secure/CompanyDetail.aspx?CID=761761
download_linux_url: https://updates.safing.io/latest/linux_amd64/packages/portmaster-installer.deb
download_windows_url: https://updates.safing.io/latest/windows_amd64/packages/portmaster-installer.exe
github_url: https://github.com/Safing
github_linux_wiki_url: https://github.com/safing/portmaster/wiki/Linux
github_windows_wiki_url: https://github.com/safing/portmaster/wiki/Windows
invidious_channel_url: https://invidio.us/channel/UC_6TW053IlS4M22g7CxnukA
kickstarter_url: https://www.kickstarter.com/projects/safingio/spn
reddit_url: https://reddit.com/r/safing
twitter_url: https://twitter.com/SafingIO
youtube_channel_url: https://www.youtube.com/channel/UC_6TW053IlS4M22g7CxnukA
### donations
donations:
bitcoin:
url: https://www.blockchain.com/btc/address/1AosdDyzd8PVUFTUEXoaJHTyPVHuKQxdmq?filter=2
paypal:
url: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=2QHNM78H9YC9L&source=url
###########################
###### site settings ######
###########################
title: Safing
encoding: "utf-8"
lang: "en"
email: hello@safing.io
emailobfuscated: "=b!isfg>#nbjmup;ifmmpAtbgjoh/jp#?ifmmpAtbgjoh/jp=0b?"
description: > # this means to ignore newlines until "base_url:"
Safing is a software that protects your privacy online. It's so easy, anyone can use it.
base_url: "/" # the subpath of your site, e.g. /blog
assets_url: "/assets/"
img_url: "/assets/img/"
video_url: "/assets/video/"
icons_url: "/assets/icons/"
vendor_url: "/vendor/"
url: "https://safing.io" # the base hostname & protocol for your site
cover: "img/cover.jpg"
logo: "img/logo_name_70h_reduced.png"
twitter_username: SafingIO
github_username: Safing
markdown: kramdown
highlightjs_theme: "monokai_sublime"
excerpt_separator: "<!--break-->"
inter_post_navigation: false
our_values_url: "/our-values/"
jobs_url: "/jobs/"
podcast_url: "/podcast/"
blog_url: "/blog/"
technology_url: "/technology/"
community_hub_url: "/community-hub/"
contact_url: "/contact/"
terms_url: "/terms/"
privacy_url: "/privacy/"
whitepaper_url: "/files/whitepaper/"
company_agreement_url: https://www.firmenmonitor.at/Secure/CompanyDetail.aspx?CID=761761
kickstarter_url: "https://www.kickstarter.com/projects/safingio/spn" # add the kickstarter url when ready
email: hello@safing.io
emailobfuscated: "=b!isfg>#nbjmup;ifmmpAtbgjoh/jp#?ifmmpAtbgjoh/jp=0b?"
download_windows_url: "https://updates.safing.io/latest/windows_amd64/packages/portmaster-installer.exe"
download_linux_url: "https://updates.safing.io/latest/linux_amd64/packages/portmaster-installer.deb"
github_windows_wiki: "https://github.com/safing/portmaster/wiki/Windows"
github_linux_wiki: "https://github.com/safing/portmaster/wiki/Linux"
###################################
###### media/content options ######
###################################
collections:
podcasts:
output: true
videos:
output: true
defaults:
- scope:
@ -69,39 +101,17 @@ defaults:
layout: "podcast"
permalink: /podcast/:year/:month/:day/:title/
type: "podcast"
- scope:
path: ""
type: "videos"
values:
layout: "video"
permalink: /video/:year/:month/:day/:title/
type: "video"
github_url: https://github.com/Safing
reddit_url: https://reddit.com/r/safing
twitter_url: https://twitter.com/SafingIO
newsletter_url: "/newsletter/"
communities:
- reddit:
name: Reddit
icon: reddit
username: r/safing
url: https://reddit.com/r/safing
desc: Join our Reddit
- github:
name: GitHub
icon: github
username: Safing
url: https://github.com/Safing
desc: Fork us on GitHub
- twitter:
name: Twitter
icon: twitter
username: SafingIO
url: https://twitter.com/SafingIO
desc: Follow me on Twitter
donations:
bitcoin:
url: https://www.blockchain.com/btc/address/1AosdDyzd8PVUFTUEXoaJHTyPVHuKQxdmq?filter=2
paypal:
url: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=2QHNM78H9YC9L&source=url
### Podcast
##############################
###### Podcast settings ######
##############################
podcast_itunes_url: https://podcasts.apple.com/podcast/id1480027286
podcast_feed_url: /podcast.xml

View file

@ -1,73 +0,0 @@
communities:
- text: >
### r/safing
Let's talk - Join our community. Get to know us and our products!
#
image:
icon: huge reddit icon
alt: safing community
url: 'https://old.reddit.com/r/safing'
disabled:
- text: >
### Podcast
Join our venture - have a look behind the scenes and understand our decision processes!
#
image:
icon: huge alternate microphone icon
alt: podcast
url: /podcast/
internal: true
- text: >
### Blog
Now you can also read about what is and has been going on at Safing!
#
image:
icon: huge alternate feather icon
alt: blog
url: /blog/
internal: true
- text: >
### Github
Dont like our personalities? Check out our code. Where we try to be our best selves.
#
image:
icon: huge github icon
alt: github
url: https://github.com/Safing
- text: >
### Email Newsletter
Bothered by visiting safing.io every day? Subscribe to stay informed!
#
image:
icon: huge envelope open outline icon
alt: newsletter
url: '/newsletter/'
internal: true
- text: >
### Twitter
Want to be part of our Twitter Force? Follow us @SafingIO
#
image:
icon: huge twitter icon
alt: twitter
class: twitter
url: https://twitter.com/SafingIO
# - text: >
# ### Twitch
#
# One of our lead developers gives you a look inside his coding shell. Disclaimer: currently very irregular
# #
# image:
# icon: huge twitch icon
# alt: twitch
# class: twitch
# url: https://twitch.tv/davegson

70
_data/team.yml Normal file
View file

@ -0,0 +1,70 @@
members:
- name: Raphael
title: CEO
joined: December 2017
handles:
- icon: twitter
external_url: https://twitter.com/Raphty101
- icon: linkedin
external_url: https://www.linkedin.com/in/raphael-fiedler-808a7441
- icon: reddit
external_url: https://reddit.com/u/Raphty101
description: >
Raphael noticed that online - everywhere he went - he was treated like a 1st class citizen. He soon realized: when he received benefits he did not earn, someone else had to pay to cover the costs. His responsibility is developing and managing our business. He also takes care of networking, company culture and accounting.
- name: Daniel
title: CTO
joined: January 2017
handles:
- icon: twitter
external_url: https://twitter.com/dehaavi/
- icon: github
external_url: https://github.com/dhaavi/
- icon: reddit
external_url: https://reddit.com/u/dhaavi/
description: >
Daniel studied IT-Security. At his first job, his skills led him to become the system architect of the first Austrian cyber attack simulation platform. Ever since the Snowden revelations he invested most of his free time to conceptualize privacy solutions. He is the brain behind the Safing Privacy Network and its lead developer.
- name: David
title: Dev & Community Manager
joined: January 2017
handles:
- icon: twitter
external_url: https://twitter.com/davegson/
- icon: github
external_url: https://github.com/davegson/
- icon: reddit
external_url: https://reddit.com/u/davegson/
description: >
Previously, David worked on large scale gaming applications with millions of users. Seeing first hand how the industry gathers and processes intimate user data, he became more and more aware of the importance of privacy. His responsibilities at Safing are development, community management as well as writing and podcasting.
- name: Martin
title: Company Advisor
joined: July 2019
description: >
Martin's track record in international management and sales is invaluable to our team. As our consultant and coach he comes by one day a week to help us think through and reflect over past steps, empowering us to make better decisions in all key areas.
- name: Alex
title: Developer
joined: September 2019
description: >
Alex is involved in building the backends of the major web platforms of Safing, including the SPN user platform and payment system. As the first employee he also helped shaping the company.
- name: Luke
title: Designer
joined: October 2019
handles:
- icon: twitter
external_url: https://twitter.com/LukeSeers/
- icon: github
external_url: https://github.com/lukeseers
description: >
Luke's uncompromising passion for privacy led us to hire him directly from within the community. With his pragmatism and determination towards easy design he already made a big impact.
- name: Tabitha
title: Backoffice
joined: January 2020
description: >
Tabitha is supporting us to tackle all emerging bottle-necks in the office. May it be accounting, reporting, writing or editing podcasts - she is always eagerly helping out.
- name: Patrick
title: Senior Dev & Server Admin
joined: March 2020
handles:
- icon: github
external_url: https://github.com/ppacher
description: >
With his wide experience, ranging from IT-security and pen-testing to driver development to server management, Patrick rapidly became an invaluable part of the team. With his passion for Go-lang he is primarily advancing the SPN.

View file

@ -7,4 +7,4 @@ This gives us the opportunity to kick-start Safing, batteries (hardware and serv
We are looking forward to next year and the great time we will have implementing Safing.
![Netidee Logo](/assets/img/external-logos/netidee.png){: .blog-image }
![Netidee Logo](/assets/img/external/logos/netidee.png){: .blog-image }

110
_includes/footer.html Normal file
View file

@ -0,0 +1,110 @@
<footer class="bg-black p-8 bg-local bg-no-repeat bg-cover bg-bottom" id="footer">
<div class="p-12 mx-auto self-center max-w-3xl text-center lg:text-left" id="newsletter">
<span class="text-white text-xl font-bold">Stay Connected</span>
<form action="https://t80607841.emailsys1a.net/184/1387/c70759e794/subscribe/form.html" method="post">
<div class="block lg:flex items-center py-5">
<input style="background-color: #302e37;" type="email" name="email" class="appearance-none rounded-full w-full max-w-md px-6 py-2 text-white" required placeholder="Monthly Newsletter">
<div class="pt-5 lg:pt-0 lg:pl-5 ">
<input type="submit" value="Subscribe" style="background-color: #6188ff;" class="transform hover:scale-95 inline-flex items-center px-10 py-3 border border-transparent text-xs leading-5 font-extrabold rounded-full text-white hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 active:bg-indigo-700 transition duration-150 ease-in-out uppercase" />
</div>
</div>
<div class="max-w-md flex">
<input type="checkbox" id="consent_text" name="consent_text" value="yes" required />
<div class="ml-3">
<label class="consent opacity-55 text-white" for='consent_text'>
I agree that Safing &amp;
<a class="text-blue-500 hover:text-blue-200 transition ease-in-out duration-150" title="GDPR compliant, located in Germany" href="https://rapidmail.de" target="_blank">
rapidmail.de
</a>
may proccess and use the email for newsletter purposes.
</label>
</div>
</div>
</form>
</div>
<div class="text-center lg:text-left container mx-auto px-8">
<div class="w-full flex flex-col md:flex-row py-6 ">
<div class="flex-1">
<p class="text-white text-xl md:mb-6">Company</p>
<ul class="list-reset mb-6">
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.about_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">About Us</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.team_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Team</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.ownership_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Ownership</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.help_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Get Help</a>
</li>
</ul>
</div>
<div class="flex-1">
<p class="text-white text-xl md:mb-6">Technology</p>
<ul class="list-reset mb-6">
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.portmaster_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Portmaster</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.spn_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">SPN</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.whitepaper_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Whitepaper</a>
</li>
</ul>
</div>
<div class="flex-1">
<p class="text-white text-xl md:mb-6">Follow Us</p>
<ul class="list-reset mb-6">
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.video_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Video Updates</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.podcast_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Podcast</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.blog_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Blog</a>
</li>
</ul>
</div>
<div class="flex-1">
<p class="text-white text-xl md:mb-6">Social</p>
<ul class="list-reset mb-6">
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.reddit_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Reddit</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.github_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Github</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.kickstarter_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Kickstarter</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.twitter_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Twitter</a>
</li>
</ul>
</div>
<div class="flex-1">
<p class="text-white text-xl md:mb-6">Legal</p>
<ul class="list-reset mb-6">
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.contact_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Contact & Notice</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.terms_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Terms of Service</a>
</li>
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
<a href="{{ site.privacy_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Privacy Policy</a>
</li>
</ul>
</div>
</div>
</div>
<div class="text-xs">
<p class="text-center leading-6 text-white opacity-55">
&copy; 2020 Safing ICS Technologies GmbH
</p>
</div>
</footer>

View file

@ -1,10 +1,22 @@
<!-- meta -->
<meta charset={{ site.encoding }}>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<meta name="description" content="{{ site.description }}">
<meta name="author" content="{{ site.author }}">
<title>{% if page.type == "podcast" %}The Safing Podcast {{ page.title }}{% elsif page.type == "post" %}Safing Blog: {{ page.title }}{% elsif page.title == "Safing" %}{{ page.title }}{% else %}Safing {{ page.title }}{% endif %}</title>
<title>
{% if page.type == "podcast" %}
{% assign title_length = page.title | size %}
{{ page.title | slice: 7, title_length }} - The Safing Podcast #{{ page.title | slice: 2, 2 }}
{% elsif page.type == "video" %}
{% assign title_length = page.title | size %}
{{ page.title | slice: 7, title_length }} - Safing Update #{{ page.title | slice: 2, 2 }}
{% elsif page.type == "post" %}
{{ page.title }} - Safing Blog
{% else %}
{{ page.title }}
{% endif %}
</title>
<!-- Favicon and other icons (made with http://www.favicon-generator.org/) -->
<link rel="apple-touch-icon" sizes="57x57" href="{{ site.assets_url }}icons/apple-icon-57x57.png">
@ -21,12 +33,11 @@
<link rel="icon" type="image/png" sizes="96x96" href="{{ site.assets_url }}icons/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="{{ site.assets_url }}icons/favicon-16x16.png">
<link rel="manifest" href="{{ site.assets_url }}icons/manifest.json">
<meta name="msapplication-TileColor" content="#f7f7f7">
<meta name="msapplication-TileImage" content="{{ site.assets_url }}icons/ms-icon-144x144.png">
<meta name="theme-color" content="#f7f7f7">
<link rel="stylesheet" href="{{ site.vendor_url }}css/fonts-roboto.css" type="text/css">
<link rel="stylesheet" href="{{ site.vendor_url }}css/tailwind.min.css" type="text/css">
<link rel="stylesheet" href="{{ site.assets_url }}css/main.css" type="text/css">
<script src="{{ site.vendor_url }}js/jquery-3.3.1.slim.min.js"></script>
<script src="{{ site.vendor_url }}semantic/semantic.min.js"></script>

30
_includes/header.html Normal file
View file

@ -0,0 +1,30 @@
<header class="mb-64 lg:mb-0 lg:pb-0 h-screen bg-local bg-no-repeat bg-cover bg-center" style="background-image: url({{ site.img_url }}header.png">
<img class="-z-0 pt-16 absolute hidden md:block" style="z-index: -1;" src="" alt="">
<div class="flex items-center h-full">
<div class="container mx-auto sm:px-8 sm:px-0">
<div class="container mx-auto px-8 sm:px-0 flex">
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-0 lg:flex">
<div class="inline-block text-center lg:text-left lg:mr-12 lg:mt-20">
<h2 class="py-10 text-5xl tracking-tight font-extrabold text-gray-900 sm:text-5xl leading-none md:text-6xl md:mx-auto">
<span style="color: #6188ff;">Fight surveillance</span> because you <span style="color: #6188ff;">love&nbsp;Freedom</span>.
</h2>
<p style="max-width: 440px;" class="text-md opacity-55 max-w-4xl mx-auto lg:mx-0">
Without privacy there is no freedom of press, no freedom of speech,
not even freedom of thought. Take back your freedom.
</p>
<div class="py-10 lg:py-10 lg:flex text-center">
<a href="#tools">
<button type="button" class="bg-black mb-5 md:mb-0 transform hover:scale-95 inline-flex items-center px-5 px-10 py-3 border border-transparent text-xs leading-5 font-extrabold rounded-full text-white focus:outline-none focus:border-indigo-700 active:bg-indigo-700 transition duration-150 ease-in-out uppercase">
discover our tools
</button>
</a>
</div>
</div>
<div class="lg:pb-0 lg:ml-0">
<img style="margin-top: 3.5rem;" class="md:pr-1 absolute mx-auto left-0 right-0 text-center lg:relative max-w-sm sm:max-w-sm lg:max-w-md transform lg:scale-150 lg:ml-16" src="{{ site.img_url }}freedom.gif" alt="">
</div>
</div>
</div>
</div>
</div>
</header>

78
_includes/nav.html Normal file
View file

@ -0,0 +1,78 @@
<nav class="flex flex-wrap items-center bg-black px-10 py-6 fixed w-full z-50 lg:absolute">
<div class="flex-1 flex justify-between items-center">
<a href="{{ site.base_url }}" class="flex items-center hover:opacity-55 transition duration-150 ease-in-out opacity-100">
<svg class="spin h-6 w-auto mr-4" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 128 128">
<g data-name="Main" fill-rule="evenodd">
<path fill="#fff" d="M176.11 36.73l-5-8.61a41.53 41.53 0 00-14.73 57.22l8.55-5.12a31.58 31.58 0 0111.19-43.49z" transform="translate(-127.99 .01)" style="isolation:isolate" fill="url(#a)" opacity=".8" />
<path fill="#fff" d="M222.36 72.63a31.55 31.55 0 01-45 19.35l-4.62 8.84a41.54 41.54 0 0059.17-25.46z" transform="translate(-127.99 .01)" style="isolation:isolate" fill="url(#b)" opacity=".8" />
<path fill="#fff" d="M197 83a19.66 19.66 0 01-19.25-32.57l-4.5-4.27A25.87 25.87 0 00198.59 89z" transform="translate(-127.99 .01)" style="isolation:isolate" opacity=".6" fill="url(#c)" />
<path fill="#fff" d="M192 112.64A48.64 48.64 0 11240.64 64 48.64 48.64 0 01192 112.64zM256 64a64 64 0 10-64 64 64 64 0 0064-64z" transform="translate(-127.99 .1)" fill="url(#d)" />
</g>
</svg>
<span class="text-white">Safing<span class="opacity-55 ">.io</span></span>
</a>
</div>
<label for="menu-toggle" class="pointer-cursor lg:hidden block">
<svg class="h-6 w-6 fill-current text-white" stroke="currentColor" fill="none" viewBox="0 0 24 24">
<path :class="{'hidden': open, 'inline-flex': !open }" class="inline-flex" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
<path :class="{'hidden': !open, 'inline-flex': open }" class="hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</label>
<input class="hidden" type="checkbox" id="menu-toggle" />
<div class="hidden w-full text-center lg:flex lg:items-center lg:w-auto" id="menu">
<nav>
<ul class="lg:flex items-center justify-between text-base text-gray-700 pt-4 lg:pt-0 text-center ">
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
<a href="{{ site.portmaster_url }}" class="ml-0 lg:ml-4 px-3 py-2 font-semibold leading-5 hover:opacity-55 transition duration-150 ease-in-out opacity-100">
Portmaster
</a>
</li>
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
<a href="{{ site.spn_url }}" class=" ml-0 lg:ml-4 px-3 py-2 font-semibold leading-5 hover:opacity-55 transition duration-150 ease-in-out opacity-100">
SPN
</a>
</li>
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
<a href="{{ site.spn_url }}#pricing" class="ml-0 lg:ml-4 px-3 py-2 font-semibold leading-5 hover:opacity-55 transition duration-150 ease-in-out opacity-100">
Pricing
</a>
</li>
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
<a href="{{ site.about_url }}" class=" ml-0 lg:ml-4 px-3 py-2 font-semibold leading-5 hover:opacity-55 transition duration-150 ease-in-out opacity-100">
About
</a>
</li>
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
<a href="{{ site.help_url }}" class=" ml-0 lg:ml-4 px-3 py-2 font-semibold leading-5 hover:opacity-55 transition duration-150 ease-in-out opacity-100">
Get Help
</a>
</li>
<li>
<div class="block p-5 lg:flex lg:p-0 items-center">
<span class="hidden sm:block ml-3 mr-2 rounded-md">
<a href="{{ site.account_server_url }}account/sign_in">
<button type="button" class="hidden lg:block px-4 py-2 border border-black text-lg lg:text-xs leading-5 font-semibold rounded-md text-white opacity-55 bg-black hover:opacity-100 focus:outline-none focus:shadow-outline-blue transition duration-150 ease-in-out">
Sign In
</button>
</a>
</span>
<span class="sl-3 rounded-md ml-auto mr-auto">
<a href="{{ site.account_server_url }}account/sign_up">
<button type="button" style="background-color: #6188ff;" class="w-full transform hover:scale-105 lg:inline-flex px-10 py-2 border border-transparent text-lg lg:text-xs leading-5 font-extrabold rounded-full text-white hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 active:bg-indigo-700 transition duration-150 ease-in-out uppercase">
Sign Up
</button>
</a>
</span>
<span class="ml-3 rounded-md">
<a href="{{ site.account_server_url }}account/sign_in">
<button type="button" class="mr-auto ml-auto block lg:hidden px-4 py-2 border border-black text-lg lg:text-xs leading-5 font-semibold rounded-md text-white opacity-55 bg-black hover:opacity-100 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 active:text-gray-800 active:bg-gray-50 active:text-gray-800 transition duration-150 ease-in-out">
Sign In
</button>
</a>
</span>
</div>
</li>
</ul>
</nav>
</div>
</nav>

View file

@ -1,9 +0,0 @@
<content>
<div class="about-short">
<h1>You be the judge</h1>
<p>
Review and inspect everything we do and say: every page, every podcast, every line of code, every strategic decision.<br/>
If you do like what we do, please consider helping us by <a href="{{ site.reddit_url }}">contributing to the Safing community</a>.
</p>
</div>
</content>

View file

@ -1,23 +0,0 @@
<content>
<div class="cast">
<div class="c-l">
{% assign sorted_podcasts = site.podcasts | reverse %}
{% for episode in sorted_podcasts limit: 4 %}
<a href="{{ episode.url }}">
<img src="{{ site.img_url }}podcast.png" alt="">
<div>
{% assign title_length = episode.title | size %}
<span>{{ episode.title | slice: 7, title_length }}</span>
<p>{{ episode.title | slice: 0, 4 }} - {{ episode.date | date: "%-d. %b %Y" }}</p>
</div>
</a>
{% endfor %}
</div>
<div class="c-r">
<h1>Stay up to date</h1>
<p>
Listen to our podcast where we give insight into our company. Ranging from the current development progress to our latest challenges to our thought process behind making important decisions.
</p>
</div>
</div>
</content>

View file

@ -1,31 +0,0 @@
<content>
<div class="features">
<div>
<img src="{{ site.icons_url }}lock.svg" alt="">
<div>
<span>Privacy first</span>
<p>
We believe privacy is the foundation to a free & open society. We can only grow if we have a safe place to nourish our best selves.
</p>
</div>
</div>
<div>
<img src="{{ site.icons_url }}community.svg" alt="">
<div>
<span>Community</span>
<p>
Do we walk our talk? You be the judge! If you like what you see, consider <a href="{{ site.reddit_url }}">helping us</a> by contributing in our community.
</p>
</div>
</div>
<div>
<img src="{{ site.icons_url }}shield.svg" alt="">
<div>
<span>Open Source</span>
<p>
Transparency is a key value for us, therefore we release our code open source. If you're a techie, we challenge you to <a href="{{ site.github_url }}">have a look</a> ;)
</p>
</div>
</div>
</div>
</content>

View file

@ -1,56 +0,0 @@
{% unless page.exclude_kickstarter_plug == true %}
<content class="kickstarter-plug">
<a href="{{ site.kickstarter_url }}">
<div>
<h3>Raised 11.755€ on Kickstarter - Thank You!</h3>
<p>Have a look at all the details and watch video updates from the team 🎬</p>
</div>
</a>
</content>
{% endunless %}
<footer class="f-bg">
<div class="list">
<ul>
<span>Company</span>
<li><a href="{{ site.our_values_url }}">Team</a></li>
<li><a href="{{ site.our_values_url }}#ownership">Ownership</a></li>
<li><a href="{{ site.jobs_url }}">Jobs</a></li>
<li class="vhidden">.</li>
</ul>
<ul>
<span>Podcast</span>
<li><a href="{{ site.podcast_url }}">Overview</a></li>
<li><a href="{{ site.podcast_itunes_url }}">iTunes</a></li>
<li><a href="{{ site.podcast_feed_url }}">RSS</a></li>
<li class="vhidden">.</li>
</ul>
<ul>
<span>Resources</span>
<li><a href="{{ site.technology_url }}">Technology</a></li>
<li><a href="{{ site.whitepaper_url }}Gate17.pdf">Whitepaper</a></li>
<li><a href="{{ site.blog_url }}">Blog</a></li>
<li class="vhidden">.</li>
</ul>
<ul>
<span>Social</span>
<li><a href="{{ site.reddit_url }}">Reddit</a></li>
<li><a href="{{ site.newsletter_url }}">Newsletter</a></li>
<li><a href="{{ site.github_url }}">Github</a></li>
<li><a href="{{ site.twitter_url }}">Twitter</a></li>
</ul>
<ul>
<span>Legal</span>
<li><a href="{{ site.terms_url }}">Terms</a></li>
<li><a href="{{ site.privacy_url }}">Privacy</a></li>
<li><a href="{{ site.contact_url }}">Contact & Legal</a></li>
<li class="vhidden">.</li>
</ul>
</div>
<div class="legal">
<ul>
<li>Safing © {{ site.time | date: '%Y' }}</li>
</ul>
</div>
</footer>

View file

@ -1,26 +0,0 @@
<header class="h-bg">
<div class="h-l">
<div class="h-l-v">
<a href="{{ site.kickstarter_url }}"><img src="{{ site.img_url }}video-kickstarter.png" alt=""></a>
<!--<video playsinline="" preload="auto" src="{{ site.video_url }}interim.mp4" controls></video>-->
</div>
<span style="opacity: 0.5;">Supported by</span>
<ul>
<li><a href="{{ site.our_values_url }}#influences"><img src="{{ site.img_url }}external-logos/esa.png" alt=""></a></li>
<li><a href="{{ site.our_values_url }}#influences"><img src="{{ site.img_url }}external-logos/netidee_small.png" alt=""></a></li>
<li><a href="{{ site.our_values_url }}#influences"><img src="{{ site.img_url }}external-logos/excellence.png" alt=""></a></li>
<li><a href="{{ site.our_values_url }}#influences"><img src="{{ site.img_url }}external-logos/ffg.png" alt=""></a></li>
</ul>
</div>
<div class="h-r">
<span>Take back control</span>
<h1>Privacy Network</h1>
<p>
Stay private while surfing the Web. Stop ISPs, Wi-Fi Operators and VPNs from collecting all your personal [meta] data. Secure your whole computer, not only your web-browser.
</p>
<div>
<a href="{{ site.kickstarter_url }}"><button><img src="{{ site.icons_url }}kickstarter.svg" alt=""><span>kickstarter</span></button></a>
<span>or <a href="{{ site.newsletter_url }}">subscribe to our newsletter</a></span>
</div>
</div>
</header>

View file

@ -1,16 +0,0 @@
<content>
<div class="map">
<div class="m-l">
<img src="{{ site.img_url }}map.gif" alt="">
</div>
<div class="m-r">
<h1>Outpacing Big Corp</h1>
<p>
With the Safing Privacy Network, all your outgoing connections are onion encrypted locally. They are then routed through our multi-hop network (blue) to prevent all current middlemen from logging and exploiting your private activities.
</p>
<p>
Each route is calculated individually to minimize exposure to the untrusted web (non-blue). Also, DNS over TLS is enforced for your whole computer. <a href="{{ site.technology_url }}">Find out more...</a>
</p>
</div>
</div>
</content>

View file

@ -1,6 +0,0 @@
<content class="o-bg">
<div class="mission">
<h1>Enabling you to reclaim your privacy</h1>
<p>We're building tools to help everyone withstand today's mass surveillance</p>
</div>
</content>

View file

@ -1,13 +0,0 @@
<nav>
<a href="{{ site.base_url }}">
<div>
<img src="{{ site.img_url }}logo_v3_light.png" alt="">
<p>Safing<span>.io</span></p>
</div>
</a>
<ul>
<li><a href="{{ site.our_values_url }}">About</a></li>
<li><a href="{{ site.jobs_url }}">Jobs</a></li>
<li><a href="{{ site.community_hub_url }}">Community</a></li>
</ul>
</nav>

View file

@ -1,45 +0,0 @@
<content>
<div class="overview">
<div class="o-l">
<h1>Transparency enforces Accountability</h1>
<p>
Being transparent means you and others can examine us; it gives insight whether we really walk our talk. It's the reason we believe in open source. But we don't want to stop there:
</p>
</div>
<div class="o-r">
<div class="left">
<div>
<img src="{{ site.icons_url }}lock.svg" alt="">
<div>
<span>Team</span>
<p>
We're human, just like you.
<br/>
<a href="{{ site.our_values_url }}#ownership">Meet the team</a> behind this venture!
</p>
</div>
</div>
<div>
<img src="{{ site.icons_url }}shield.svg" alt="">
<div>
<span>Ownership</span>
<p>
Many have fallen because they were not <i>really</i> in charge of their company. So, <a href="{{ site.our_values_url }}#ownership">who is in charge</a> of Safing?
</p>
</div>
</div>
</div>
<div>
<div class="right">
<img src="{{ site.icons_url }}community.svg" alt="">
<div>
<span>Ethical Funding</span>
<p>
We believe that we must also be open about all our financial influences & partnerships to truly become a privacy first company. <a href="{{ site.our_values_url }}#finances">Have a look!</a>
</p>
</div>
</div>
</div>
</div>
</div>
</content>

View file

@ -1,4 +0,0 @@
<span class="page-divider">
<span class="one"></span>
<span class="two"></span>
</span>

View file

@ -1,14 +0,0 @@
<div class="ui stackable mobile-hidden grid">
{% if modulo == 0 %}
{% include pitch/image.html %}
{% include pitch/text.html %}
{% else %}
{% include pitch/text.html %}
{% include pitch/image.html %}
{% endif %}
</div>
<div class="ui stackable mobile only grid">
{% include pitch/image.html %}
{% include pitch/text.html %}
</div>

View file

@ -1,9 +0,0 @@
<div class="four wide column">
<div class="ui basic segment {{ pitch.image.class }}">
{% if pitch.image.path %}
<img class="ui tiny image margin-0-auto" src="{{ site.assets_url }}{{ pitch.image.path }}" alt="{{ pitch.image.alt }}">
{% elsif pitch.image.icon %}
<i class="{{ pitch.image.icon }} margin-0-auto"></i>
{% endif %}
</div>
</div>

View file

@ -1,3 +0,0 @@
<div class="twelve wide column">
{{ pitch.text | markdownify | replace: '<p>','<p class="lead">' }}
</div>

View file

@ -0,0 +1,2 @@
<video style="padding-bottom: 1rem;" src="{{ page.video_source }}" controls></video>
<p class="text-center">Watch on <a href="https://youtu.be/{{ page.youtube_hash }}">YouTube</a> or <a href="https://invidio.us/{{ page.youtube_hash }}">Invidious</a></p>

View file

@ -1,18 +1,11 @@
<!DOCTYPE html>
<html lang={{ site.lang }}>
<head>
{% if layout.legacy_layout %}
<link rel="stylesheet" href="{{ site.vendor_url }}semantic/semantic.css" type="text/css">
<link rel="stylesheet" href="{{ site.assets_url }}css/legacy.css" type="text/css">
{% endif %}
{% include head.html %}
</head>
<body>
{% include new/nav.html %}
{% if page.include_mission %}
{% include new/mission.html %}
{% endif %}
<body class="antialiased font-medium">
{% include nav.html %}
{{ content }}
{% include new/footer.html %}
{% include footer.html %}
</body>
</html>

View file

@ -1,40 +0,0 @@
---
layout: page
legacy_layout: true
---
<content>
<div class="ui {{ page.container_class }} container">
{% if page.heading or page.title or layout.heading %}
<div class="ui basic center aligned very padded segment" style="margin: 0;">
<h1 class="">
{% if page.heading %}
{{ page.heading }}
{% elsif page.title %}
{{ page.title }}
{% elsif layout.heading %}
{{ layout.heading }}
{% endif %}
</h1>
{% if page.subheading %}
<h3 class="">
{% if page.subheading %}
{{ page.subheading }}
{% elsif page.title %}
{% elsif layout.subheading %}
{{ layout.subheading }}
{% endif %}
</h3>
{% endif %}
{% if page.include_divider %}
{% include page_divider.html %}
{% endif %}
</div>
{% endif %}
<div class=" ui basic segment" style="font-size: 1.3rem;">
{{ content }}
</div>
</div>
</content>

View file

@ -0,0 +1,19 @@
---
layout: page
---
<section id="page-container" class="{{ layout.container_class }} {{ page.container_class }}">
<div class="items-center h-full">
<div class="container mx-auto px-8 sm:px-0 flex">
<div class="max-w-screen-lg mx-auto px-4 sm:px-6 lg:flex">
<div class="py-12 bg-white">
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
<content>
{{ content }}
</content>
</div>
</div>
</div>
</div>
</div>
</section>

View file

@ -1,6 +0,0 @@
---
layout: page_column
---
<span class="markdownpage">
{{ content }}
</span>

View file

@ -1,23 +1,29 @@
---
layout: page_column
layout: page_container
title: "The Safing Podcast"
heading: "The Safing Podcast"
container_class: "podcast"
---
<div class="post">
<div class="tags">
{% for tag in page.tags %}
<div class="stealth-href"><i class="fa fa-tag fa-flip-horizontal"></i> {{ tag }}</div>
{% endfor %}
</div>
<div class="content">
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
{% if page.date %}
<h3>Description</h3>
{{ page.summary }}
{% endif %}
<div class="text-center">
{% assign title_length = page.title | size %}
<span style="font-size: 12rem; font-weight: 800; margin-top: -9rem; opacity: 0.05;" class="z-0 ml-0 w-full left-0 text-center absolute bg-top">#{{ page.title | slice: 2, 2 }}</span>
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">{{ page.title | slice: 7, title_length }}</h2>
<p class="opacity-55">{{ page.date | date: "%B %-d, %Y" }}</p>
<div class="flex mx-auto justify-center pt-5">
<a href="{{ site.twitter_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.1rem; width: auto;" src="{{ site.img_url }}icons/twitter.svg">
</a>
<a href="{{ site.github_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.19rem; width: auto;" src="{{ site.img_url }}icons/github.svg">
</a>
<a href="{{ site.reddit_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.18rem; width: auto;" src="{{ site.img_url }}icons/reddit.svg">
</a>
</div>
</div>
<div class="content">
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
<h3>Description</h3>
{{ page.summary }}
</div>

View file

@ -1,23 +1,27 @@
---
layout: page_column
layout: page_container
title: "Blog"
heading: "Blog"
subheading: "Announcements and things we'd like to share"
---
<div class="post">
<div class="date">
<a href="{{ site.base_url }}blog/all/#{{ page.date | date: "%Y" }}" class="stealth-href">{{ page.date | date: "%-d %b %Y" }}</a>
</div>
<div class="tags">
{% for tag in page.tags %}
<div class="stealth-href"><i class="fa fa-tag fa-flip-horizontal"></i> {{ tag }}</div>
{% endfor %}
</div>
<div class="content">
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
</div>
<div class="text-center">
<h1 class="text-5xl tracking-tight font-extrabold leading-none pb-5 pt-10 text-center">{{ page.title }}</h1>
<p>{{ page.date | date: "%B %-d, %Y" }}</p>
<div class="flex mx-auto justify-center pt-5">
<a href="{{ site.twitter_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.1rem; width: auto;" src="{{ site.img_url }}icons/twitter.svg">
</a>
<a href="{{ site.github_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.19rem; width: auto;" src="{{ site.img_url }}icons/github.svg">
</a>
<a href="{{ site.reddit_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.18rem; width: auto;" src="{{ site.img_url }}icons/reddit.svg">
</a>
</div>
</div>
<div class="content">
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
</div>
{% if site.inter_post_navigation == true %}

27
_layouts/video.html Normal file
View file

@ -0,0 +1,27 @@
---
layout: page_container
title: "The Safing Podcast"
heading: "The Safing Podcast"
container_class: "podcast"
---
<div class="text-center">
{% assign title_length = page.title | size %}
<span style="font-size: 12rem; font-weight: 800; margin-top: -9rem; opacity: 0.05;" class="z-0 ml-0 w-full left-0 text-center absolute bg-top">#{{ page.title | slice: 2, 2 }}</span>
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">{{ page.title | slice: 7, title_length }}</h2>
<p class="opacity-55">{{ page.date | date: "%B %-d, %Y" }}</p>
<div class="flex mx-auto justify-center pt-5">
<a href="{{ site.twitter_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.1rem; width: auto;" src="{{ site.img_url }}icons/twitter.svg">
</a>
<a href="{{ site.github_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.19rem; width: auto;" src="{{ site.img_url }}icons/github.svg">
</a>
<a href="{{ site.reddit_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
<img style="height: 1.18rem; width: auto;" src="{{ site.img_url }}icons/reddit.svg">
</a>
</div>
</div>
<div class="content">
{{ content }}
</div>

View file

@ -23,8 +23,8 @@ summary: "
<h4>Old and new designs</h4>
- Old: <a href='https://safing.io/assets/img/designs/homepage_v2.png'>https://safing.io/assets/img/designs/homepage_v2.png</a><br/>
- New: <a href='https://safing.io/assets/img/designs/homepage_current.png'>https://safing.io/assets/img/designs/homepage_current.png</a><br/>
- Old: <a href='https://safing.io/assets/img/archive/previous_designs/homepage_v2.png'>https://safing.io/assets/img/archive/previous_designs/homepage_v2.png</a><br/>
- New: <a href='https://safing.io/assets/img/archive/previous_designs/homepage_v3.png'>https://safing.io/assets/img/archive/previous_designs/homepage_v3.png</a><br/>
<h4>Shoutout to The Hated One!</h4>

View file

@ -21,7 +21,7 @@ summary: "
<h4>Links</h4>
- First day at the office in 2018: <a href='https://safing.io/assets/img/team/first_day_in_first_office.jpg'>https://safing.io/assets/img/team/first_day_in_first_office.jpg</a><br/>
- First day at the office in 2018: <a href='https://safing.io/assets/img/archive/first_day_in_first_office.jpg'>https://safing.io/assets/img/archive/first_day_in_first_office.jpg</a><br/>
- Celebration post from the new office: <a href='https://www.kickstarter.com/projects/safingio/spn/posts/2768665'>https://www.kickstarter.com/projects/safingio/spn/posts/2768665</a><br/>
- Video & COVID-19 Update: <a href='https://www.kickstarter.com/projects/safingio/spn/posts/2786638/'>https://www.kickstarter.com/projects/safingio/spn/posts/2786638/</a>

View file

@ -20,7 +20,7 @@ Then August came around. We were invited to an official review of our applicatio
## Hiring rounds
The next days I worked on our job description. A big shoutout to ghost.org - [their style and structure](https://careers.ghost.org/visual-designer/en) was great inspiration! After we distributed it through a few channels we for a responses. [Raphael]({{ site.our_values_url }}) pre-filtered many of the applications and with a few we set up a video call. The grant was restricted to Austria 🇦🇹, so even though we are open for remote workers, this position needed to be filled anywhere in Austria.
The next days I worked on our job description. A big shoutout to ghost.org - [their style and structure](https://careers.ghost.org/visual-designer/en) was great inspiration! After we distributed it through a few channels we for a responses. [Raphael]({{ site.team_url }}) pre-filtered many of the applications and with a few we set up a video call. The grant was restricted to Austria 🇦🇹, so even though we are open for remote workers, this position needed to be filled anywhere in Austria.
It was fun getting to dive into this area from an employers perspective. So far we've only sat on the other side of the table. One thing I learned was that you really get much more interested if an application sticks out from standard, generic descriptions. And then in our situation you _really_ stick out if you are already into privacy and burning for our mission. We had two applicants who restricted their work to _only_ privacy projects. One of them could not move to Austria, which was a dealbreaker, and the other one was Luke.
@ -28,7 +28,7 @@ It was fun getting to dive into this area from an employers perspective. So far
_Sidenote: [Luke talks all about his side of the story in the podcast]({{ site.podcast_url }}2019/11/29/hiring-a-designer-from-the-privacy-community/)_
From the very first email we received from Luke we learnt two things: he burns for privacy and he is outspoken. This was even more affirmed after [Raphael]({{ site.our_values_url }}) and I got to know him via a video call (Luke's from the United Kingdom).
From the very first email we received from Luke we learnt two things: he burns for privacy and he is outspoken. This was even more affirmed after [Raphael]({{ site.team_url }}) and I got to know him via a video call (Luke's from the United Kingdom).
The even crazier thing about this was, Luke found out about us and the job via The Hated One. I appeared on [his channel twice](https://www.youtube.com/channel/UCjr2bPAyPV7t35MvcgT3W8Q/), but would never have thought that this would end up helping us hiring our designer. HUGE shoutout to THO!!!
@ -38,7 +38,7 @@ After plenty of interviews and rounds we had the two most promising candidates r
Since it's easy to pull off a show for a few hours online, we really wanted to get to know Luke in person before making our decision. We offered him to fly in over the weekend, which he accepted after some suspicion.
We booked the flight the day before we received the result about the grant, which increased the gamble, but hey: [the next day we got it]({{ site.our_values_url }}#influences) 🎉
We booked the flight the day before we received the result about the grant, which increased the gamble, but hey: [the next day we got it]({{ site.ownership_url }}#influences) 🎉
## His weekend in Austria
@ -58,7 +58,7 @@ It is rather obvious by now that we decided to hire Luke. But both candidates we
It took Luke a few weeks to pack up his things and move to Austria, but soon enough, at the beginning of October he became our lead designer. We are very grateful for his work so far and see him as a perfect fit for the job.
He made us reconsider [our old designs]({{ site.img_url }}/designs/homepage_v2.png) and revamped everything to [look more professional]({{ site.img_url }}/designs/homepage_current.png), while still being approachable.
He made us reconsider [our old designs]({{ site.img_url }}/archive/previous_designs/homepage_v2.png) and revamped everything to [look more professional]({{ site.img_url }}/archive/previous_designs/homepage_v3.png), while still being approachable.
_Sidenote: [Luke talks all about his side of the story in the podcast]({{ site.podcast_url }}2019/11/29/hiring-a-designer-from-the-privacy-community/). Also, you can [follow him on Twitter.](https://twitter.com/LukeSeers/)_

View file

@ -12,7 +12,7 @@ With our Kickstarter around the corner - launching on the 2nd of January 2020 -
First and foremost, our first step is going to be launching the SPN in June. It is a feature packed privacy network which protects your web connections from meta-data extraction as they travel through the Internet. With the SPN your ISP and the Wi-Fi operator of your local coffee shop cannot collect and sell your browsing habits. It protects the connections of your whole computer, not only you those of the browser. It also enforces DNS over TLS. We're looking forward to completing this first step, but it's just the beginning.
_For more information, you can read [more about our tech]({{ site.technology_url }}#gate17) or [the SPN whitepaper]({{ site.whitepaper_url }})._
_For more information, you can read [more about our tech]({{ site.portmaster_url }}) or [the SPN whitepaper]({{ site.whitepaper_url }})._
## 2. Community Nodes

View file

@ -2,6 +2,7 @@
title: How the SPN compares to Tor
date: 2020-01-22
author: davegson
custom_thumbnail_name: spn-tor
---
## Different Missions

View file

@ -1,56 +0,0 @@
i.icon.safing-primary {
color: $primary;
}
.ui.safing-primary {
background-color: $primary;
&.button {
color: $white;
&:hover {
background-color: darken($primary, 5%);
}
}
}
.ui.button.safing-secondary {
color: $secondary;
&:hover {
color: $secondary;
}
}
.ui.button.safing-full {
color: $secondary;
background-color: $white;
&:hover {
background-color: $secondary;
color: $white;
}
}
.ui.windows.button {
background-color: #0072C6;
color: #fff;
&:hover {
background-color: darken(#0072C6, 5%);
}
}
.ui.ubuntu.button {
background-color: #E95420;
color: #fff;
&:hover {
background-color: darken(#E95420, 5%);
}
}
.ui.apple.disabled.button {
opacity: 1 !important;
}

View file

@ -1,33 +0,0 @@
.community-hub .ui.button {
width: 100%;
border-radius: 92px;
margin: 1rem 0;
.twitch.icon {
color: #4b367c;
}
.twitter.icon {
color: #1da1f2;
}
.github.icon {
color: black;
}
.reddit.icon {
color: #ff4301;
}
.discourse.icon {
color: green;
}
.rss.icon {
color: #a0a5ae;
}
.envelope.icon {
color: #c16f6f;
}
}

View file

@ -1,20 +0,0 @@
.contact-image {
text-align: center;
overflow: hidden;
img {
width: 100%;
}
}
.contact-text {
color: $color_tundora_approx;
padding-bottom: 60px;
line-height: 2;
text-align: center;
}
.imprint {
padding-top: 20px;
padding-bottom: 40px;
text-align: center;
}

View file

@ -1,13 +0,0 @@
.footer-section {
width: 100%;
background-color: $background_bar;
margin: 0 !important;
padding: 1rem;
a {
color: $discreet;
&:hover {
text-decoration: underline;
}
}
}

View file

@ -1,132 +1,182 @@
body, .ui.header, h1, h2, h3, h4, h5, h6, p {
font-family: 'Roboto', 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
* {
font-family: "Roboto";
}
.pusher {
background-color: $background_bar !important;
body {
overflow-x: hidden;
}
a {
color: $anchor;
footer {
background-image: url('/assets/img/footer.png');
}
p a:hover {
color: $anchor_hover;
text-decoration: underline;
.not-allowed {
cursor: not-allowed;
}
.color-primary {
color: $primary;
.spn-shadow {
box-shadow: 0 0px 90px 0 rgba(59, 93, 199, 0.1), 0 0px 5px 0 rgba(0, 0, 0, 0);
}
&:hover {
color: darken($primary, 10%)
.hover:hover {
box-shadow: 0 0px 90px 0 rgba(59, 93, 199, 0.1), 0 0px 5px 0 rgba(0, 0, 0, 0);
}
.shake-horizontal {
-webkit-animation: shake-horizontal .8s cubic-bezier(.455, .03, .515, .955) both;
animation: shake-horizontal .8s cubic-bezier(.455, .03, .515, .955) both
}
@-webkit-keyframes shake-horizontal {
0%, 100% {
-webkit-transform: translateX(0);
transform: translateX(0)
}
10%, 30%, 50%, 70% {
-webkit-transform: translateX(-10px);
transform: translateX(-10px)
}
20%, 40%, 60% {
-webkit-transform: translateX(10px);
transform: translateX(10px)
}
80% {
-webkit-transform: translateX(8px);
transform: translateX(8px)
}
90% {
-webkit-transform: translateX(-8px);
transform: translateX(-8px)
}
}
.color-primary-important {
color: $primary !important;
@keyframes shake-horizontal {
0%, 100% {
-webkit-transform: translateX(0);
transform: translateX(0)
}
10%, 30%, 50%, 70% {
-webkit-transform: translateX(-10px);
transform: translateX(-10px)
}
20%, 40%, 60% {
-webkit-transform: translateX(10px);
transform: translateX(10px)
}
80% {
-webkit-transform: translateX(8px);
transform: translateX(8px)
}
90% {
-webkit-transform: translateX(-8px);
transform: translateX(-8px)
}
}
.vertical-align {
display: flex;
align-items: center;
.spin {
animation-name: spin;
animation-duration: 21000ms;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.ui.text.container {
max-width: 850px !important;
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.max-width-100 {
max-width: 100%;
.heart {
// animation: .8s infinite beatHeart;
}
body > .content, .pusher > .content {
background-color: $background_main;
@keyframes beatHeart {
0% {
transform: scale(1);
}
25% {
transform: scale(1.1);
}
40% {
transform: scale(1);
}
60% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
}
.padding-top-10 { padding-top: 10px; }
.padding-top-20 { padding-top: 20px; }
.padding-top-40 { padding-top: 40px; }
.padding-top-60 { padding-top: 60px; }
.padding-top-80 { padding-top: 80px; }
.padding-top-100 { padding-top: 100px; }
.padding-right-10 { padding-right: 10px; }
.padding-right-20 { padding-right: 20px; }
.padding-right-40 { padding-right: 40px; }
.padding-right-60 { padding-right: 60px; }
.padding-right-80 { padding-right: 80px; }
.padding-right-100 { padding-right: 100px; }
.padding-bottom-10 { padding-bottom: 10px; }
.padding-bottom-20 { padding-bottom: 20px; }
.padding-bottom-40 { padding-bottom: 40px; }
.padding-bottom-60 { padding-bottom: 60px; }
.padding-bottom-80 { padding-bottom: 80px; }
.padding-bottom-100 { padding-bottom: 100px; }
.padding-left-10 { padding-left: 10px; }
.padding-left-20 { padding-left: 20px; }
.padding-left-40 { padding-left: 40px; }
.padding-left-60 { padding-left: 60px; }
.padding-left-80 { padding-left: 80px; }
.padding-left-100 { padding-left: 100px; }
.margin-top-10 { margin-top: 10px; }
.margin-top-20 { margin-top: 20px; }
.margin-top-40 { margin-top: 40px; }
.margin-top-60 { margin-top: 60px; }
.margin-top-80 { margin-top: 80px; }
.margin-top-100 { margin-top: 100px; }
.margin-right-10 { margin-right: 10px; }
.margin-right-20 { margin-right: 20px; }
.margin-right-40 { margin-right: 40px; }
.margin-right-60 { margin-right: 60px; }
.margin-right-80 { margin-right: 80px; }
.margin-right-100 { margin-right: 100px; }
.margin-bottom-10 { margin-bottom: 10px; }
.margin-bottom-20 { margin-bottom: 20px; }
.margin-bottom-40 { margin-bottom: 40px; }
.margin-bottom-60 { margin-bottom: 60px; }
.margin-bottom-80 { margin-bottom: 80px; }
.margin-bottom-100 { margin-bottom: 100px; }
.margin-left-10 { margin-left: 10px; }
.margin-left-20 { margin-left: 20px; }
.margin-left-40 { margin-left: 40px; }
.margin-left-60 { margin-left: 60px; }
.margin-left-80 { margin-left: 80px; }
.margin-left-100 { margin-left: 100px; }
.opacity-85 {
opacity: 0.85;
#menu-toggle:checked+#menu {
display: block;
}
.text-light {
opacity: $opacity-light;
.wiggle {
animation: wiggle .6s infinite alternate;
}
.text-lighter {
opacity: $opacity-lighter;
@keyframes wiggle {
0% {
transform: rotate(4deg);
}
100% {
transform: rotate(10deg);
}
}
.note-light {
font-style: italic;
opacity: $opacity-light;
.line {
width:100%;
text-align:center;
border-bottom: 2px solid rgba(0, 0, 0, 0.2);
line-height:0.1em;
margin:10px 0 20px;
}
.line span {
background:#fff;
padding:0 25px;
}
.margin-0-auto {
margin: 0 auto;
.support p{
color: #7d7d7d;
}
blockquote {
background: #f9f9f9;
border-left: 5px solid #ccc;
margin: 1.5em 10px;
padding: 0.5em 10px;
quotes: "\201C""\201D""\2018""\2019";
a.link {
--text-opacity: 1;
color: #667eea;
color: rgba(102, 126, 234, var(--text-opacity));
text-decoration: inherit;
background-color: transparent;
transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
&:hover{
opacity: .5;
transition-duration: 150ms;
transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}
}
blockquote p {
display: inline;
.opacity-55 {
opacity: 0.55;
}
i.white.icon {
color: #FFFFFF;
.hover\:opacity-55:hover {
opacity: 0.55;
}

View file

@ -1,38 +0,0 @@
/* Mobile */
@media only screen and (max-width: 767px) {
html {
font-size: 1.0rem;
}
}
/* Tablet / iPad Portrait */
@media only screen and (min-width: 768px) and (max-width: 991px) {
html {
font-size: 1.2rem;
}
}
/* Computer / Desktop / iPad Landscape */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
html {
font-size: 1.3rem;
}
}
/* Large Monitor */
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
html {
font-size: 1.3rem;
}
}
/* Widescreen Monitor */
@media only screen and (min-width: 1920px) {
html {
font-size: 1.3rem;
}
}
#gate-17 {
padding-top: 6em;
}

View file

@ -1,5 +0,0 @@
.ui.cards {
a {
color: $main_color;
}
}

View file

@ -1,11 +0,0 @@
.newsletter {
.consent {
font-size: 0.75em !important;
}
.segment {
margin-bottom: 4em !important;
}
text-align: left !important;
}

View file

@ -1,43 +0,0 @@
.funding-progressbar {
margin: 0 20px !important;
padding: 0 !important;
}
#ownership {
padding-top: 1.5em;
}
.ui.horizontal.cards .card {
width: 86%;
margin-left: 2%;
.image {
height: 150px;
}
.content {
padding-right: 0.5em;
.header .ui.small.text {
font-weight: normal;
}
.description {
font-size: 0.65em;
}
.meta {
font-size: 0.8em;
}
}
.extra.content {
opacity: 0.55;
padding-left: 0px;
a {
margin-left: 10px;
}
}
}

130
_sass/_page_container.scss Normal file
View file

@ -0,0 +1,130 @@
#page-container {
padding: 10rem 0;
&.podcast {
padding-top: 16rem;
padding-bottom: 6rem;
}
&.imprint {
h4 {
padding-top: 2rem;
}
p {
padding: .5rem 0;
}
}
}
#page-container content {
p {
padding-top: 1.8rem;
color: #898989;
}
strong {
color: black;
}
a:hover {
opacity: .5;
transition-duration: 150ms;
transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}
a {
--text-opacity: 1;
color: #667eea;
color: rgba(102, 126, 234, var(--text-opacity));
text-decoration: inherit;
background-color: transparent;
transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
}
a strong {
--text-opacity: 1;
color: #667eea;
color: rgba(102, 126, 234, var(--text-opacity));
}
h2 {
font-size: 1.875rem;
padding-top: 4rem;
font-weight: 800;
}
h3 {
font-size: 1.2rem;
padding-top: 1rem;
font-weight: 800;
}
h4 {
font-size: 1.1rem;
padding: 0.5rem 0;
font-weight: 500;
}
ul {
padding-top: 2rem;
}
ul li {
padding-top: 0.4rem;
}
.content {
max-width: 750px;
margin: auto;
margin-top: 3rem;
ul {
padding-top: 0.1rem;
list-style-type: decimal;
padding-left: 1rem;
color: #898989;
}
blockquote p {
font-weight: bold;
padding-left: 2rem;
color: black;
opacity: 0.6;
}
p {
padding: 0.5rem 0;
}
p img {
--transform-translate-x: 0;
--transform-translate-y: 0;
--transform-rotate: 0;
--transform-skew-x: 0;
--transform-skew-y: 0;
--transform-scale-x: 1.1;
--transform-scale-y: 1.1;
transform: translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y));
box-shadow: 0 0px 90px 0 rgba(59, 93, 199, 0.1), 0 0px 5px 0 rgba(0, 0, 0, 0);
margin-top: 5rem;
max-width: 100%;
height: auto;
border-radius: .375rem;
display: block;
margin-bottom: 4rem;
margin-top: 5rem;
}
.podcast h2 {
padding-top: 1rem;
font-weight: 500;
font-size: 1rem;
padding-bottom: 0.5rem;
}
audio {
padding-bottom: 1.5rem;
}
}
}

View file

@ -1,138 +0,0 @@
.post {
.date {
float: right;
padding: 2px;
}
.tags {
> a, > div {
display: inline-block;
background-color: $color_gallery_approx;
border-radius: 3px;
padding: 2px;
padding-left: 9px;
padding-right: 9px;
}
i {
color: $color_tapa_approx;
}
}
.blog-image {
width: 70%;
margin-left: 15%;
}
ul {
margin-top: -15px;
margin-bottom: 20px;
}
a.anchor {
display: block;
position: relative;
top: -99px;
visibility: hidden;
}
}
.no-border {
border-top: none !important;
border: none;
> td {
border-top: none !important;
border: none;
}
}
.pagination {
width: 100%;
text-align: center;
padding: 40px;
color: $color_tapa_approx;
}
.stealth-href {
color: $color_mine_shaft_approx;
&:hover {
text-decoration: none;
color: $primary;
}
}
.markdownpage {
#funding-cards {
font-size: 0.8em;
}
p {
padding-top: 5px;
padding-bottom: 5px;
}
li {
padding-bottom: 4px;
line-height: 24px;
}
h5 {
line-height: 24px;
font-weight: bold;
}
h6 {
line-height: 24px;
}
hr {
margin-top: 40px;
margin-bottom: 40px;
}
.footnotes p {
margin: 0 !important;
padding: 0 !important;
}
table, td, th {
border: 1px solid #00000044;
}
table {
border-collapse: collapse;
td, th {
padding: 4px;
min-width: 100px;
}
td:nth-child(n+2), th {
text-align: center;
}
}
}
.pod-links{
text-align: center;
margin-left: auto;
margin-right: auto;
margin-top: -3rem;
margin-bottom: 8rem;
}
.pod-links ul{
display: inline-flex;
}
.pod-links li{
list-style-type: none;
}
.pod-links ul br{
padding-left: 1rem;
padding-right: 1rem;
}

View file

@ -1,133 +0,0 @@
/*
// Semantic UI has these classes, however they're only applicable to
// grids, containers, rows and columns.
// plus, there isn't any `mobile hidden`, `X hidden` class.
// this snippet is using the same class names and same approach
// plus a bit more but to all elements.
//
// see https://github.com/Semantic-Org/Semantic-UI/issues/1114
*/
/* Mobile */
@media only screen and (max-width: 767px) {
[class*="mobile-hidden"],
[class*="tablet-only"]:not(.mobile),
[class*="computer-only"]:not(.mobile),
[class*="large-screen-only"]:not(.mobile),
[class*="widescreen-only"]:not(.mobile),
[class*="or-lower-hidden"] {
display: none !important;
}
}
/* Tablet / iPad Portrait */
@media only screen and (min-width: 768px) and (max-width: 991px) {
[class*="mobile-only"]:not(.tablet),
[class*="tablet-hidden"],
[class*="computer-only"]:not(.tablet),
[class*="large-screen-only"]:not(.tablet),
[class*="widescreen-only"]:not(.tablet),
[class*="or-lower-hidden"]:not(.mobile) {
display: none !important;
}
}
/* Computer / Desktop / iPad Landscape */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
[class*="mobile-only"]:not(.computer),
[class*="tablet-only"]:not(.computer),
[class*="computer-hidden"],
[class*="large-screen-only"]:not(.computer),
[class*="widescreen-only"]:not(.computer),
[class*="or-lower-hidden"]:not(.tablet):not(.mobile) {
display: none !important;
}
}
/* Large Monitor */
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
[class*="mobile-only"]:not([class*="large-screen"]),
[class*="tablet-only"]:not([class*="large-screen"]),
[class*="computer-only"]:not([class*="large-screen"]),
[class*="large-screen-hidden"],
[class*="widescreen-only"]:not([class*="large-screen"]),
[class*="or-lower-hidden"]:not(.computer):not(.tablet):not(.mobile) {
display: none !important;
}
}
/* Widescreen Monitor */
@media only screen and (min-width: 1920px) {
[class*="mobile-only"]:not([class*="widescreen"]),
[class*="tablet-only"]:not([class*="widescreen"]),
[class*="computer-only"]:not([class*="widescreen"]),
[class*="large-screen-only"]:not([class*="widescreen"]),
[class*="widescreen-hidden"],
[class*="widescreen-or-lower-hidden"] {
display: none !important;
}
}
/***/
/* Mobile */
@media only screen and (max-width: 767px) {
.hidden-on-mobile {
display: none !important;
}
}
/* Tablet / iPad Portrait */
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hidden-on-tablet {
display: none !important;
}
}
/* Tablet and lower*/
@media only screen and (max-width: 991px) {
.hidden-on-tablet-and-lower {
display: none !important;
}
}
/* Computer / Desktop / iPad Landscape */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hidden-on-computer {
display: none !important;
}
}
/* Computer and wider */
@media only screen and (min-width: 992px) {
.hidden-on-computer-and-wider {
display: none !important;
}
}
/* Large Monitor */
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
.hidden-on-large-screen {
display: none !important;
}
}
/* Widescreen Monitor */
@media only screen and (min-width: 1920px) {
.hidden-on-widescreen {
display: none !important;
}
}
// no reason to have a min height for segments
// normal segments do not have min-height, why should the placeholder one have it?
// if extra height is needed, just add it to the segment manually
.ui.placeholder.segment {
min-height: 0rem;
}
// a 'normal' .ui.vertical.divider has text in between, this adds the option to have the line fully go through it
// essentially a margin...
.ui.full.vertical.divider {
&::before, &::after {
height: 100%;
}
}

View file

@ -1,38 +0,0 @@
// from INFOUND
$primary: #f39200 !default;
// old: $primary: #1fa787 !default;
$fill_light: #667082 !default;
$fill_medium: #38465c !default;
$fill_dark: #222a37 !default;
// adaptions
$background_main: #f7f7f7 !default;
$fill_lighter: #788294 !default;
$secondary: $fill_medium;
$discreet: #F7F7F7;
$background_bar: #031949;
$anchor: #0078ff;
$anchor_hover: #258bff;
// other colors
$main_color: rgba(0, 0, 0, 0.87);
$color_mine_shaft_approx: #333 !default;
$color_alto_approx: #ddd !default;
$color_celeste_approx: #ccc !default;
$color_pink_swan_approx: #bababa !default;
$color_tapa_approx: #777 !default;
$color_tundora_approx: #444 !default;
$color_gallery_approx: #eee !default;
$color_alabaster_approx: #f9f9f9 !default;
$color_royal_purple_approx: rebeccapurple !default;
$white: #ffffff !default;
$opacity-light: 0.7;
$opacity-lighter: 0.5;
// email
$email_user: 'hello' !default;
$email_domain: 'safing.io' !default;

View file

@ -1,51 +0,0 @@
content .about-short{
color: black;
height: 25vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns:1fr 1fr;
grid-row: 0;
grid-column: 1/4;
align-items: center;
}
content .about-short h1{
justify-self: end;
font-size: 2.5rem;
padding-right: 9rem;
width: 500px;
}
content .about-short p{
justify-self: start;
font-size: 1.1rem;
opacity: 0.5;
padding-left: 5rem;
width: 500px;
}
@media (max-width: 1318px){
content .about-short{
height: 95vh;
grid-template-columns: 1fr;
text-align: center;
}
content .about-short h1{
padding-right: 0rem;
justify-self: center;
width: 100%;
}
content .about-short p{
grid-row: 2;
justify-self: center;
font-size: 1.1rem;
opacity: 0.5;
padding-left: 0rem;
width: 100%;
margin-top: -19rem;
}
}

View file

@ -1,7 +0,0 @@
.post {
.content {
img {
width: 100%;
}
}
}

View file

@ -1,118 +0,0 @@
content .cast{
color: black;
height: 105vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns:1fr 1fr;
grid-row: 0;
grid-column: 1/4;
align-items: center;
justify-self: center;
margin-top: -100px;
}
content .cast .c-l{
padding-right: 5rem;
align-items: center;
justify-self: end;
}
content .cast .c-l a{
background-color: white;
border-radius: 3px;
padding: 1rem;
padding-right: 5rem;
box-shadow: 0 4px 80px 0 rgba(0, 0, 0, 0.0), 0 6px 20px 0 rgba(0, 0, 0, 0.00);
display: flex;
position: relative;
z-index: 2;
margin-top: 0.5rem;
transition: all .3s ease-in-out;
text-decoration: none;
color: black;
transform: scale(0.9);
z-index: 1;
}
content .cast .c-l a:hover{
transform: scale(1.0);
box-shadow: 0 4px 80px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
z-index: 2;
}
content .cast .c-l a div{
padding-top: 1.5rem;
padding-left: 2rem;
}
content .cast .c-l a img{
width: 100px;
height: 100px;
}
content .cast .c-l a div p{
padding-top: 0.5rem;
opacity: 0.5;
}
content .cast .c-l img{
}
content .cast .c-r{
padding-left: 5rem;
}
content .cast .c-r h1{
font-size: 3rem;
width: 450px;
padding-bottom: 2rem;
}
content .cast .c-r p{
font-size: 1.1rem;
padding-top: 1rem;
width: 350px;
opacity: 0.5;
}
@media (max-width: 1318px) {
content .cast{
grid-template-columns:1fr;
margin-top: -100px;
height: 155vh;
}
content .cast .c-l{
grid-row: 2;
padding-right: 0rem;
align-items: center;
justify-self: center;
}
content .cast .c-l a div{
padding-top: 0rem;
}
content .cast .c-r{
padding-left: 0rem;
align-items: center;
justify-self: center;
text-align: center;
}
content .cast .c-r h1{
font-size: 3rem;
width: 100%;
padding-bottom: 2rem;
}
content .cast .c-r p{
font-size: 1.1rem;
padding-top: 1rem;
width: 100%;
opacity: 0.5;
}
}

View file

@ -1,57 +0,0 @@
.features{
color: black;
height: 55vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns: 1fr 1fr 1fr;
grid-row: 0;
grid-column: 1/4;
align-items: center;
justify-self: center;
}
.features div{
width: 450px;
}
.features div img{
width: 2rem;
}
.features div div{
padding-top: 1rem;
}
.features div div span{
font-size: 1.5rem;
font-weight: bold;
}
.features div div p{
font-size: 1.1rem;
padding-top: 1rem;
width: 350px;
opacity: 0.5;
}
@media (max-width: 1318px){
.features{
height: 125vh;
grid-template-columns: 1fr;
grid-column: 1/3;
}
.features div{
width: 100%;
padding-top: 2rem;
}
.features div{
text-align: center;
}
.features div div p{
width: 100%;
}
}

View file

@ -1,151 +0,0 @@
content.kickstarter-plug {
width: 100%;
a {
width: 100%;
background-color: #05F2BA;
text-decoration: none;
color: black;
div {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
padding: 3.5em;
h3 {
text-decoration: underline;
font-weight: normal;
font-size: 1.5em;
margin-bottom: 0.4em;
}
}
}
}
footer{
color: white;
height: 45vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns: 1fr;
grid-row: 0;
grid-column: 2/4;
align-items: center;
}
footer .vhidden {
visibility: hidden;
}
.f-bg{
grid-row: 0;
grid-column: span 5;
background-color: black;
background-image: url(/assets/img/f-bg.png);
background-repeat: no-repeat;
background-size: cover;
z-index: -1;
}
footer a{
color: white;
text-decoration: none;
opacity: 0.5;
transition:.5s;
}
footer a:hover{
opacity: 1;
text-decoration: none;
}
footer div{
}
footer .list{
display: flex;
align-items: center;
justify-self: center;
}
footer .list ul{
padding: 6rem 3rem 0 3rem;
}
footer .list ul span{
font-size: 1.5rem;
font-weight: bold;
}
footer .list ul li{
padding-top: 1rem;
list-style-type: none;
}
footer .list ul li a{
color: white;
text-decoration: none;
opacity: 0.5;
transition:.5s;
}
footer .list ul li a:hover{
opacity: 1;
text-decoration: none;
}
footer .legal{
grid-row: 2;
align-self: end;
justify-self: end;
padding-bottom: 3rem;
padding-right: 5rem;
}
footer .legal ul{
display: flex;
}
footer .legal ul li{
padding-left: 2rem;
list-style-type: none;
}
@media (max-width: 1318px) {
footer{
height: 45vh;
border-top-style: solid;
// border-top-width: 8rem; removed because of KS plug banner
}
footer .list ul{
padding-top: 2rem;
padding-left: 6rem;
}
footer .legal{
padding-top: 3rem;
}
footer .list ul{
padding-left: 0rem;
padding-right: 3rem;
}
.f-bg{
background-image: none;
}
footer .list{
display: block;
align-items: center;
justify-self: center;
}
}

View file

@ -1,264 +0,0 @@
header{
color: white;
height: 90vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns: 1fr 1fr;
grid-row: 2;
grid-column: 2/4;
align-items: center;
}
.h-bg{
grid-row: 2;
grid-column: span 5;
background-color: black;
background-image: url(/assets/img/h-bg.png);
background-repeat: no-repeat;
background-size: cover;
z-index: -1;
}
header .h-l{
width: 90%;
grid-column: 1/2;
justify-self: end;
}
header .h-l-i{
}
header .h-l-i img{
width: 100%;
height: auto;
}
header .h-l-v{
position: relative;
padding-bottom: 2rem;
}
header .h-l-v button{
width: 100px;
height: 100px;
color: white;
background-color: #ff5700;
border: 0;
border-radius: 50%;
cursor: pointer;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: all .3s ease-in-out;
}
header .h-l-v button:hover{
box-shadow: 2px 2px 30px #ff5500b9;
}
header .h-l-v button img {
width: 40%;
height: auto;
padding-top: 0.1rem;
padding-left: 0.4rem;
}
header .h-l-v img{
width: 95%;
height: auto;
border: 0;
border-radius: 10px 10px 10px 10px;
font-variant-caps: all-petite-caps;
cursor: pointer;
}
header .h-l span{
font-size: 1.1rem;
}
header .h-l ul{
display: flex;
list-style-type: none;
padding-top: 2rem;
padding-right: 5.5rem;
}
header .h-l ul li{
padding-right: 4vh;
}
header .h-l ul li img{
width: 90%;
height: auto;
}
header .h-r{
grid-column: 2/3;
align-items: center;
padding-bottom: 8vh;
padding-left: 10rem;
}
header .h-r span{
opacity: 0.5;
font-size: 1.4rem;
}
header .h-r h1{
max-width: 10px;
font-size: 8rem;
line-height: 1;
padding-top: 2rem;
padding-bottom: 2rem;
}
header .h-r p{
max-width: 470px;
font-size: 1.2rem;
font-weight: 300;
opacity: 0.5;
padding-bottom: 2.5rem;
}
header .h-r ul{
display: inline-flex;
list-style-type: none;
}
header .h-r ul li{
text-align: center;
padding-right: 2rem;
}
header .h-r ul li span{
font-size: 2rem;
font-weight: 500;
opacity: 1;
}
header .h-r ul li p{
opacity: 0.5;
}
header .h-r div{
display: flex;
padding-top: 1rem;
}
header .h-r div a{
text-decoration: none;
}
header .h-r div button{
color: white;
background-color: #05ce78;
display: flex;
border: 0;
padding: 10px 25px;
border-radius: 0 10px 10px;
font-variant-caps: all-petite-caps;
cursor: pointer;
transition: all .3s ease-in-out;
}
header .h-r div button:hover{
transform: scale(1.1);
box-shadow: 2px 2px 30px #05ce77af;
}
header .h-r div button img{
width: 20px;
height: auto;
}
header .h-r div button span{
font-size: 1rem;
padding-left: 1rem;
opacity: 1;
}
header .h-r div span{
font-size: 1rem;
align-self: center;
padding-left: 1rem;
}
header .h-r div span a{
color: white;
padding-left: 1rem;
opacity: 0.8;
transition: .5s;
}
header .h-r div a:hover{
opacity: 1;
}
@media (max-width: 1318px){
header{
height: 170vh;
grid-template-columns: 1fr;
}
header .h-l{
width: 90%;
grid-column: 1/2;
justify-self: center;
}
header .h-l{
width: 90%;
grid-column: 1/2;
grid-row: 2;
justify-self: end;
}
header .h-r{
grid-column: 1/2;
grid-row: 1;
align-items: center;
padding-bottom: 8vh;
padding-left: 0rem;
text-align: center;
}
header .h-r span{
opacity: 0.5;
font-size: 1.4rem;
}
header .h-r h1{
max-width: 100%;
font-size: 4rem;
line-height: 1;
padding-top: 2rem;
padding-bottom: 2rem;
}
header .h-r p{
max-width: 100%;
font-size: 1.2rem;
font-weight: 300;
opacity: 0.5;
padding-bottom: 2.5rem;
}
header .h-r div button{
margin-bottom: 1.5rem;
}
header .h-r div {
display: inline-block;
}
header .h-l ul li img{
width: 150%;
height: auto;
}
header .h-r div span{
margin-right: 1.4rem;
}
}

View file

@ -1,71 +0,0 @@
content > .map{
color: black;
height: 55vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns:1fr 1fr;
grid-row: 0;
grid-column: 1/4;
align-items: center;
justify-self: center;
}
content .map .m-l{
align-items: center;
justify-self: end;
}
content .map .m-l img{
width: 90%;
height: auto;
}
content .map .m-r{
padding-left: 5rem;
}
content .map .m-r h1{
font-size: 3rem;
width: 450px;
padding-bottom: 2rem;
}
content .map .m-r p{
font-size: 1.1rem;
width: 450px;
opacity: 0.5;
padding-bottom: 2rem;
}
@media (max-width: 1318px){
content .map{
height: 125vh;
grid-template-columns:1fr;
}
content .map .m-l{
align-items: center;
justify-self: center;
}
content .map .m-l img{
width: 100%;
height: auto;
}
content .map .m-r{
grid-row: 2;
padding-left: 0rem;
}
content .map .m-r h1{
width: 100%;
text-align: center;
}
content .map .m-r p{
width: 100%;
text-align: center;
}
}

View file

@ -1,87 +0,0 @@
content .mission{
color: white;
height: 60vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns: 1fr;
grid-row: 1;
grid-column: 1/2;
align-items: center;
justify-self: center;
}
.o-bg{
background-color: black;
// https://pixabay.com/photos/rough-horn-alpine-2146181/
// Free for commercial use
// No attribution required
background-image: url(/assets/img/o-bg.png);
background-repeat: no-repeat;
background-size: cover;
z-index: -1;
}
content .mission{
padding-right: 6rem;
justify-self: center;
}
content .mission h1{
grid-row: 1;
grid-column: 1/2;
font-size: 3.8rem;
font-weight: bold;
width: calc(60%);
text-align: center;
margin-left: auto;
margin-right: auto;
}
content .mission p{
grid-row: 1;
grid-column: 1/2;
font-size: 1.4rem;
font-weight: 200;
width: calc(50%);
opacity: 0.75;
margin-top: 17rem;
text-align: center;
margin-left: auto;
margin-right: auto;
}
@media (min-width: 200px) and (max-width: 460px){
content .mission{
padding-right: 0rem;
justify-self: center;
}
content .mission h1{
font-size: 2rem;
width: calc(80%);
}
content .mission p{
font-size: 1rem;
width: calc(80%);
margin-top: 13rem;
}
}
@media (min-width: 460px) and (max-width: 1376px){
content .mission{
padding-right: 0rem;
justify-self: center;
}
content .mission h1{
font-size: 2.8rem;
}
content .mission p{
font-size: 1.1rem;
}
}

View file

@ -1,80 +0,0 @@
nav{
color: white;
height: auto;
display: grid;
grid-auto-columns: auto;
grid-template-columns: 1fr 1fr;
grid-row: 1;
grid-column: 2/4;
padding-top: 5.5vh;
padding-bottom: 5.5vh;
align-self: center;
}
nav a{
color: white;
text-decoration: none;
opacity: 1;
transition:.5s;
}
nav a:hover{
opacity: 0.5;
text-decoration: none;
}
nav a div{
display: flex;
justify-self: start;
}
nav div img{
height: 1.5em;
width: 2.5rem;
padding-right: 1rem;
margin-top: -3px;
}
nav div p span{
opacity: 0.5;
}
nav ul{
display: flex;
justify-self: end;
}
nav li{
list-style-type: none;
padding-left: 5vh;
}
nav ul li a{
color: white;
opacity: 0.5;
text-decoration: none;
transition:.5s;
}
nav ul li a:hover{
opacity: 1;
text-decoration: none;
}
@media (max-width: 1318px){
nav{
grid-column: 1/4;
}
nav a{
padding-right: 1vh;
margin-left: 2vh;
}
nav li{
list-style-type: none;
padding-left: 0;
padding-right: 0.5vh;
}
}

View file

@ -1,127 +0,0 @@
content .overview{
color: black;
height: 70vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns:1fr 1fr;
grid-row: 0;
grid-column: 1/4;
align-items: center;
justify-self: center;
}
content .overview .o-l{
padding-right: 6rem;
justify-self: end;
}
content .overview .o-l h1{
font-size: 2.5rem;
width: 580px;
padding-bottom: 2rem;
}
content .overview .o-l p{
font-size: 1.1rem;
width: 450px;
opacity: 0.5;
padding-bottom: 2rem;
}
content .overview .o-r{
color: black;
height: 55vh;
display: grid;
grid-auto-columns: auto;
grid-template-columns: 1fr 1fr;
grid-row: 0;
grid-column: 2/4;
align-items: center;
justify-self: end;
}
content .overview .o-r .left div{
width: 450px;
padding-bottom: 2rem;
}
content .overview .o-r .right div{
width: 450px;
padding-bottom: 2rem;
}
content .overview .o-r div img{
width: 2rem;
}
content .overview .o-r div div{
padding-top: 1rem;
}
content .overview .o-r div div span{
font-size: 1.5rem;
font-weight: bold;
}
content .overview .o-r div div p{
font-size: 1.1rem;
padding-top: 1rem;
width: 350px;
opacity: 0.5;
}
@media (max-width: 1318px) {
content .overview{
height: 170vh;
grid-template-columns:1fr;
grid-column: 2/4;
padding-top: 5rem;
}
content .overview .o-l{
padding-right: 0rem;
text-align: center;
}
content .overview .o-l h1{
font-size: 2.5rem;
width: 100%;
padding-bottom: 2rem;
}
content .overview .o-l p{
font-size: 1.1rem;
width: 100%;
opacity: 0.5;
padding-bottom: 2rem;
}
content .overview .o-r {
height: 95vh;
grid-template-columns: 1fr;
grid-column: 1/5;
align-items: center;
justify-self: start;
padding-left: 0rem;
}
content .overview .o-r div div {
padding-top: 1rem;
text-align: center;
}
content .overview .o-r div div p{
width: 100%;
}
content .overview .o-r .left div{
width: 100%;
}
content .overview .o-r .right div{
width: 100%;
}
}

View file

@ -1,35 +0,0 @@
* {
font-family: 'Roboto', sans-serif;
margin: 0;
padding: 0;
box-sizing: border-box;
}
body{
height: 0vh;
display: grid;
grid-template-rows: auto auto;
grid-template-columns: 5vh 1fr 1fr 5vh;
background-color: black;
overflow-x: hidden;
}
content{
height: auto;
display: grid;
grid-auto-columns: auto;
grid-template-columns: 1fr;
grid-row: auto;
grid-column: span 5;
background-color: white;
}
::selection {
background-color: #396bf5;
}
@media (max-width: 1318px) {
body{
grid-template-columns: 1fr;
}
}

View file

@ -0,0 +1,29 @@
---
# ⚠️ ALWAYS follow this format: "#001 - Some sweet title"
# this has to be consistent for displaying only the episode number or only the title
title: "#004 - The Account Server is up and running"
date: 2020-05-08
video_source: https://assets.safing.io/video/progress_updates/4.mp4
youtube_hash: vZSZUipikh8
custom_thumbnail_name: 004-account-server-is-running
---
{% include video_wrapper.html %}
### Description
Hey there, the Safing Account server is up and running. 🙌
<https://account.safing.io/>
It's the place where you can manage and sign up to your SPN/Safing account. Next to payments, the server also manages the current waitlist and the future SPN authentication. Authorization will happen on another server, but that's another story.
For all you Kickstarter backers, your are already first in line! We'll send you instructions how to set up or link your accounts in a few weeks.
### Links
- Listen to our Podcast:
<https://safing.io/podcast/>
- Download the Portmaster Download:
<https://github.com/Safing/portmaster/#portmaster>
- Check out our latest Newsletter:
<https://t80607841.emailsys1a.net/mailing/184/2825189/362888995/71/1ce681e04a/index.html>

98
about/index.html Normal file
View file

@ -0,0 +1,98 @@
---
title: About Safing
layout: page
redirect_from:
- /our-values/
- /community-hub/
---
<header style="padding-top: 12rem;"></header>
<section style="margin-top: 3rem;" class="pb-48 ">
<div class="items-center h-full">
<div class="container mx-auto px-8 sm:px-0 flex">
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex block justify-center m-auto w-auto items-center">
<div class="pb-16 lg:pb-0 ml-0 lg:ml-32 lg:hidden self-center">
<img src="{{ site.img_url }}page-specific/about/team_overview.png" alt="">
</div>
<div class="inline-block max-w-lg">
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 lg:w-3/4">
We <span style="color: #6188ff;">love&nbsp;Freedom</span>, just like You
</h2>
<p class="text-md opacity-55 max-w-lg">
We are a bunch of ordinary people who want to change the world. Discontent with the global state of mass surveillance, and seeing how it negatively impacts our lives, we decided it was time to do something about it.
</p>
<p class="text-md opacity-55 max-w-lg pt-4">
We still have a long way to go. We hope you'll join us on this venture.
</p>
<div class="py-10 flex">
<a href="{{ site.team_url }}">
<button type="button" style="background-color: #000;" class="transform hover:scale-95 inline-flex items-center px-10 py-3 border border-transparent text-xs leading-5 font-extrabold rounded-full text-white hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 active:bg-indigo-700 transition duration-150 ease-in-out uppercase">
View Team Overview
</button>
</a>
<a href="#footer" class="inline-flex pl-8 transition duration-150 ease-in-out hover:opacity-100 self-center uppercase opacity-55 text-xs font-bold">
Follow Along
</a>
</div>
</div>
<div class="hidden pt-16 lg:pt-0 ml-0 lg:ml-32 lg:block self-center">
<img src="{{ site.img_url }}page-specific/about/team_overview.png" alt="">
</div>
</div>
</div>
</div>
<div class="items-center h-full mt-64">
<div class="container mx-auto px-8 sm:px-0 flex">
<div class="flex grid md:grid-cols-2">
<div class="mx-auto transform hover:scale-95 duration-150 ease-in-out">
<div class="absolute bg-white w-48 text-center mx-auto leading-tight p-3">
<span class="text-2xl font-extrabold">Get to know some of us.</span>
</div>
<video src="{{ site.assets_server_url }}video/interview_sessions/1/daniel.mp4" controls></video>
</div>
<div class="mx-auto grid md:grid-cols-2 gap-8 lg:pl-8 lg:pt-0 transform scale-90">
<div class="mx-auto transform hover:scale-95 duration-150 ease-in-out">
<video src="{{ site.assets_server_url }}video/interview_sessions/1/david.mp4" controls></video>
</div>
<div class="mx-auto transform hover:scale-95 duration-150 ease-in-out">
<video src="{{ site.assets_server_url }}video/interview_sessions/1/tabitha.mp4" controls></video>
</div>
<div class="mx-auto transform hover:scale-95 duration-150 ease-in-out">
<video src="{{ site.assets_server_url }}video/interview_sessions/1/raphael.mp4" controls></video>
</div>
<div class="mx-auto transform hover:scale-95 duration-150 ease-in-out">
<video src="{{ site.assets_server_url }}video/interview_sessions/1/martin.mp4" controls></video>
</div>
</div>
</div>
</div>
</div>
<div class="items-center h-full mt-64">
<div class="container mx-auto px-8 sm:px-0 flex">
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex block justify-center m-auto w-auto">
<div class="pb-16 lg:pb-0 ml-0 lg:ml-32 lg:hidden self-center">
<img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
</div>
<div class="inline-block max-w-lg">
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 lg:w-auto">
Ownership & Transparent Funding
</h2>
<p class="text-md opacity-55 max-w-lg">
Taking money always means opening up to influences. Therefore, we see it as our duty to not only be open about our ownership, but also about how we are financing this venture.
</p>
<div class="py-10 flex">
<a href="{{ site.ownership_url }}">
<button type="button" style="background-color: #000;" class="transform hover:scale-95 inline-flex items-center px-10 py-3 border border-transparent text-xs leading-5 font-extrabold rounded-full text-white hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 active:bg-indigo-700 transition duration-150 ease-in-out uppercase">
Explore our influences
</button>
</a>
</div>
</div>
<div class="hidden pt-16 lg:pt-0 ml-0 lg:ml-32 lg:block self-center">
<img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
</div>
</div>
</div>
</div>
</section>

View file

@ -1,367 +0,0 @@
---
layout: page_markdown
container_class: 'text'
include_mission: true
redirect_from:
- /our-values/
---
<h2 id="ownership">Ownership & Team</h2>
<p>
The company behind Safing is <em>Safing ICS Technologies GmbH</em>, a private company registered in Austria. The company is <a href="{{ site.company_agreement_url }}" target="\_blank">fully owned</a> by its three founders.
</p>
<div class="nine wide column">
<div class="ui horizontal cards">
<div class="card">
<div class="image">
<img src="{{ site.assets_url }}img/profiles/raphty.jpg">
</div>
<div class="content">
<div class="header">
Raphael <span class="ui small text">- CEO</span>
</div>
<div class="meta">
<a href="{{ site.company_agreement_url }}" target="\_blank">
<i class="file contract icon"></i>
owns 30%
</a>
, joined December 2017
</div>
<div class="description">
Raphael noticed that online - everywhere he went - he was treated like a 1st class citizen. He soon realized: when he received benefits he did not earn, someone else had to pay to cover the costs. His responsibility is developing and managing our business. He also takes care of networking, company culture and accounting.
</div>
</div>
<div class="extra content">
<a href="https://twitter.com/Raphty101" target="\_blank">
<i class="twitter black icon"></i>
</a>
<a href="https://www.linkedin.com/in/raphael-fiedler-808a7441" target="\_blank">
<i class="linkedin black icon"></i>
</a>
<a href="https://reddit.com/user/Raphty101" target="\_blank">
<i class="reddit black icon"></i>
</a>
</div>
</div>
<div class="card">
<div class="image">
<img src="{{ site.assets_url }}img/profiles/dhaavi.jpg">
</div>
<div class="content">
<div class="header">
Daniel <span class="ui small text">- CTO</span>
</div>
<div class="meta">
<a href="{{ site.company_agreement_url }}" target="\_blank">
<i class="file contract icon"></i>
owns 40%
</a>
, joined January 2017
</div>
<div class="description">
Daniel studied IT-Security. At his first job, his skills led him to become the system architect of the first Austrian cyber attack simulation platform. Ever since the Snowden revelations he invested most of his free time to conceptualize privacy solutions. He is the brain behind the Safing Privacy Network and its lead developer.
</div>
</div>
<div class="extra content">
<a href="https://twitter.com/dehaavi" target="\_blank">
<i class="twitter black icon"></i>
</a>
<a href="https://github.com/dhaavi" target="\_blank">
<i class="github black icon"></i>
</a>
<a href="https://reddit.com/user/dhaavi" target="\_blank">
<i class="reddit black icon"></i>
</a>
</div>
</div>
<div class="card">
<div class="image">
<img src="{{ site.assets_url }}img/profiles/davegson.jpeg">
</div>
<div class="content">
<div class="header">
David <span class="ui small text">- Dev & Community Manager</span>
</div>
<div class="meta">
<a href="{{ site.company_agreement_url }}" target="\_blank">
<i class="file contract icon"></i>
owns 30%
</a>
, joined January 2017
</div>
<div class="description">
Previously, David worked on large scale gaming applications with millions of users. Seeing first hand how the industry gathers and processes intimate user data, he became more and more aware of the importance of privacy. His responsibilities at Safing are development, community management as well as writing and podcasting.
</div>
</div>
<div class="extra content">
<a href="https://twitter.com/davegson" target="\_blank">
<i class="twitter black icon"></i>
</a>
<a href="https://github.com/davegson" target="\_blank">
<i class="github black icon"></i>
</a>
<a href="https://reddit.com/user/davegson" target="\_blank">
<i class="reddit black icon"></i>
</a>
</div>
</div>
<div class="card">
<div class="image">
<img src="{{ site.assets_url }}img/profiles/martin.jpg">
</div>
<div class="content">
<div class="header">
Martin <span class="ui small text">- Company Advisor</span>
</div>
<div class="meta">
joined July 2019
</div>
<div class="description">
Martin's track record in international management and sales is invaluable to our team. As our consultant and coach he comes by one day a week to help us think through and reflect over past steps, empowering us to make better decisions in all key areas.
</div>
</div>
<div class="extra content">
</div>
</div>
<div class="card">
<div class="image">
<img src="{{ site.assets_url }}img/profiles/alex.jpg">
</div>
<div class="content">
<div class="header">
Alex <span class="ui small text">- Developer</span>
</div>
<div class="meta">
joined September 2019
</div>
<div class="description">
Alex is involved in building the backends of the major web platforms of Safing, including the SPN user platform and payment system. As the first employee he also helped shaping the company.
</div>
</div>
<div class="extra content">
</div>
</div>
<div class="card">
<div class="image">
<img src="{{ site.assets_url }}img/profiles/luke.jpg">
</div>
<div class="content">
<div class="header">
Luke <span class="ui small text">- Designer</span>
</div>
<div class="meta">
joined October 2019
</div>
<div class="description">
Luke's uncompromising passion for privacy led us to hire him directly from within the community. With his pragmatism and determination towards easy design he already made a big impact.
</div>
</div>
<div class="extra content">
</div>
</div>
<div class="card">
<div class="image">
<img src="{{ site.assets_url }}img/profiles/tabitha.jpg">
</div>
<div class="content">
<div class="header">
Tabitha <span class="ui small text">- Backoffice</span>
</div>
<div class="meta">
joined January 2020
</div>
<div class="description">
Tabitha is supporting us to tackle all emerging bottle-necks in the office. May it be accounting, reporting, writing or editing podcasts - she is always eagerly helping out.
</div>
</div>
<div class="extra content">
</div>
</div>
<div class="card">
<div class="image">
<img src="{{ site.assets_url }}img/profiles/patrick.jpg">
</div>
<div class="content">
<div class="header">
Patrick <span class="ui small text">- Senior Dev & Server Admin</span>
</div>
<div class="meta">
joined March 2020
</div>
<div class="description">
With his wide experience, ranging from IT-security and pen-testing to driver development to server management, Patrick rapidly became an invaluable part of the team. With his passion for Go-lang he is primarily advancing the SPN.
</div>
</div>
<div class="extra content">
<a href="https://github.com/ppacher" target="\_blank">
<i class="github black icon"></i>
</a>
</div>
</div>
</div>
</div>
<div class="margin-top-40"></div>
## Privacy First
The [Charter of Fundamental Rights of the European Union](https://eur-lex.europa.eu/legal-content/EN/TXT/PDF/?uri=CELEX:12012P/TXT&from=EN) clearly states in Article 8:
<blockquote>
<p class="text-light">
Everyone has the right to the protection of personal data concerning him or her.
</p>
</blockquote>
Privacy is *your right*, we want to do our part to make it easier for you to reclaim that right!
## Open Source
To ensure maximum privacy and transparency we need to be open in every aspect. That's why we [publish all of our hard work]({{ site.github_url }}) as open source. This way you and others can validate if we truly stay to our word. But we do not want to stop there.
## Ethical Funding
Taking money always means opening up to influences. That is why we see it as our responsibility to be thoughtful about taking investments. We do not want parties to gain influence which do not or might not stand behind our values. That is why in our current funding phase we took more personal risks instead of selling parts of our company for easy money.
### Transparent Funding Policy
For us, ethical funding also means we want to make sure that our users know who paid for the programs and services they use.
As a result we openly share how we are funded. All our funding (and partnerships) will remain public!
<h2 id="influences">Influences <small class="text-lighter">updated November 2019</small></h2>
<p>This section shows what influences the company is exposed to. This includes received funding, partnerships, supporters, trainings and other things.</p>
<div class="ui two stackable cards" id="funding-cards">
<!-- Personal Investment card -->
<div class="ui card">
<div class="image">
<img src="{{ site.assets_url }}img/logo_v3_name_dark.svg">
</div>
<div class="content">
<div class="header">Personal Investment</div>
<div class="meta">
<span class="date">Starting from 2017</span>
</div>
<div class="description">
We invest our personal time and money to further push the project and company. Starting from 2017, and drastically increasing over the next years, we personally invested over 200.000€ in value.
</div>
</div>
<div class="extra content">
<i class="green money icon"></i>invested over <b>200.000€</b> in value
<div class="margin-top-10"></div>
<i class="blue clock icon"></i>You can support us by <a href="/donate/" style="color: #0078ff;"><b>donating.</b></a>
</div>
</div>
<!-- FFG card -->
<div class="ui card">
<div class="image">
<img src="{{ site.img_url }}external-logos/ffg_color.png">
</div>
<div class="content">
<a class="header" href="https://www.ffg.at/">FFG</a>
<div class="meta">
<span class="date">2019-2020</span>
</div>
<div class="description">
The FFG is the national funding institution for Research & Development of Austria. Their goal is to strengthen innovation within Austria, advancing their international competitiveness and its economy.<br/><br/>
We got accepted into <a href="https://www.ffg.at/programm/basisprogramm">the FFG Basisprogramm</a> in September 2019. The included funding and loan enables us to hire our first employees and further progress our products.
</div>
</div>
<div class="extra content">
<i class="green money icon"></i> received <b>82.800€</b> funding (2019)
<div class="margin-top-10"></div>
<i class="green money icon"></i> received <b>78.200€ loan</b> (2019)
<div class="margin-top-10"></div>
<i class="blue clock icon"></i>82.800€ funding held out in prospect (2020)
<div class="margin-top-10"></div>
<i class="blue clock icon"></i>78.200€ <b>loan</b> held out in prospect (2020)
</div>
</div>
<!-- Netidee card -->
<div class="ui card">
<div class="image">
<img src="{{ site.img_url }}external-logos/netidee.png">
</div>
<div class="content">
<a class="header" href="https://www.netidee.at/">Netidee</a>
<div class="meta">
<span class="date">2017-2019</span>
</div>
<div class="description">
<a href="https://www.netidee.at/">Netidee</a> funding from 2017 helped us to kickstart all this. In late 2018, they granted a follow-up funding for the year 2019 🎉
</div>
</div>
<div class="extra content">
<i class="green money icon"></i> received <b>47.799€</b> funding (2017)
<div class="margin-top-10"></div>
<i class="green money icon"></i> received <b>30.048€</b> funding (2019)
<div class="margin-top-10"></div>
<i class="blue clock icon"></i>7.512€ held out in prospect (2019)
</div>
</div>
<!-- ESA-BIC card -->
<div class="ui card">
<div class="image" style="padding: 20px; background-color: white;">
<img src="{{ site.img_url }}external-logos/esa-bic_austria.svg">
</div>
<div class="content">
<a class="header" href="/esa-bic/">ESA-BIC Austria</a>
<div class="meta">
<span class="date">2018-2020</span>
</div>
<div class="description">
Safing ICS Technologies GmbH is <a href="/esa-bic/">participating in the ESA Business Incubation Centre Austria</a>.<br>
We are incubated by Accent, with SPG and the Lower Austrian State as the contractual partners.
</div>
</div>
<div class="extra content">
<i class="grey user icon"></i> coaching over the incubation timespan
<div class="margin-top-10"></div>
<i class="green money icon"></i> received <b>30.000€</b> in funding
<div class="margin-top-10"></div>
<i class="blue clock icon"></i>20.000€ held out in prospect
</div>
</div>
<!-- Fund of Excellence -->
<div class="ui card">
<div class="header">
<h1 style="font-size: 3rem; text-align: center;">FoE</h1>
</div>
<div class="content">
<a class="header" href="https://www.fundofexcellence.com/">Fund of Excellence</a>
<div class="meta">
<span class="date">2018-2019</span>
</div>
<div class="description">
The <a href="https://www.fundofexcellence.com/">Fund of Excellence</a> is an investment fund by the <a href="https://www.erstegroup.com/en/home">Erste Group</a>, that invests in people, rather than companies.<br>
They are actively investing in one of Safing's founders.
</div>
</div>
<div class="extra content">
<i class="green money icon"></i> receiving continuous personal funding
</div>
</div>
<!-- Accent -->
<!-- Science Park Graz -->
<!-- YC Startup School -->
</div>
## Clear Business Model
Instead of pushing a free product and worry about the business model later, we wanted to have a strong foundation and have this figured out right from the start:
The subscribers of our Safing Privacy Network will be our main source of income. As soon as we can carry ourselves with SPN, we will further develop privacy enabling, open source tools. One such product in the pipeline is a free Application Firewall, which will block malicious outgoing connections.
<p>If you like what we are all about, consider supporting us by subscribing to SPN or <a href="{{ site.reddit_url }}">engaging in our community!</a>
<div class="margin-top-80"></div>

View file

@ -1,13 +0,0 @@
---
---
@import "variables.scss";
@import "semantic_fixes.scss";
@import "community.scss";
@import "global.scss";
@import "post.scss";
@import "contact.scss";
@import "button.scss";
@import "our-values.scss";
@import "newsletter.scss";
@import "jobs.scss";

View file

@ -1,14 +1,5 @@
---
---
@import "new/page";
@import "new/nav";
@import "new/header";
@import "new/features";
@import "new/map";
@import "new/overview";
@import "new/about-short";
@import "new/cast";
@import "new/footer";
@import "new/mission";
@import "new/blog";
@import "global";
@import "page_container";

View file

Before

Width:  |  Height:  |  Size: 361 KiB

After

Width:  |  Height:  |  Size: 361 KiB

View file

Before

Width:  |  Height:  |  Size: 3.5 MiB

After

Width:  |  Height:  |  Size: 3.5 MiB

View file

Before

Width:  |  Height:  |  Size: 542 KiB

After

Width:  |  Height:  |  Size: 542 KiB

View file

Before

Width:  |  Height:  |  Size: 264 KiB

After

Width:  |  Height:  |  Size: 264 KiB

View file

Before

Width:  |  Height:  |  Size: 185 KiB

After

Width:  |  Height:  |  Size: 185 KiB

View file

Before

Width:  |  Height:  |  Size: 4 KiB

After

Width:  |  Height:  |  Size: 4 KiB

View file

Before

Width:  |  Height:  |  Size: 238 KiB

After

Width:  |  Height:  |  Size: 238 KiB

View file

Before

Width:  |  Height:  |  Size: 255 KiB

After

Width:  |  Height:  |  Size: 255 KiB

View file

Before

Width:  |  Height:  |  Size: 4.3 KiB

After

Width:  |  Height:  |  Size: 4.3 KiB

View file

Before

Width:  |  Height:  |  Size: 311 KiB

After

Width:  |  Height:  |  Size: 311 KiB

View file

Before

Width:  |  Height:  |  Size: 272 KiB

After

Width:  |  Height:  |  Size: 272 KiB

View file

Before

Width:  |  Height:  |  Size: 5.1 KiB

After

Width:  |  Height:  |  Size: 5.1 KiB

View file

Before

Width:  |  Height:  |  Size: 325 KiB

After

Width:  |  Height:  |  Size: 325 KiB

View file

Before

Width:  |  Height:  |  Size: 671 KiB

After

Width:  |  Height:  |  Size: 671 KiB

View file

Before

Width:  |  Height:  |  Size: 826 KiB

After

Width:  |  Height:  |  Size: 826 KiB

View file

Before

Width:  |  Height:  |  Size: 948 KiB

After

Width:  |  Height:  |  Size: 948 KiB

View file

Before

Width:  |  Height:  |  Size: 79 KiB

After

Width:  |  Height:  |  Size: 79 KiB

View file

Before

Width:  |  Height:  |  Size: 330 KiB

After

Width:  |  Height:  |  Size: 330 KiB

View file

Before

Width:  |  Height:  |  Size: 1.5 MiB

After

Width:  |  Height:  |  Size: 1.5 MiB

View file

Before

Width:  |  Height:  |  Size: 1.9 MiB

After

Width:  |  Height:  |  Size: 1.9 MiB

View file

Before

Width:  |  Height:  |  Size: 4.8 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

View file

Before

Width:  |  Height:  |  Size: 404 KiB

After

Width:  |  Height:  |  Size: 404 KiB

View file

Before

Width:  |  Height:  |  Size: 7.1 KiB

After

Width:  |  Height:  |  Size: 7.1 KiB

View file

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

View file

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

View file

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 24 KiB

BIN
assets/img/external/logos/esa_dark.png vendored Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB

View file

Before

Width:  |  Height:  |  Size: 7.6 KiB

After

Width:  |  Height:  |  Size: 7.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.9 KiB

View file

Before

Width:  |  Height:  |  Size: 6.8 KiB

After

Width:  |  Height:  |  Size: 6.8 KiB

View file

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 20 KiB

BIN
assets/img/external/logos/ffg_dark.png vendored Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

View file

Before

Width:  |  Height:  |  Size: 4.7 KiB

After

Width:  |  Height:  |  Size: 4.7 KiB

View file

Before

Width:  |  Height:  |  Size: 56 KiB

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 KiB

Some files were not shown because too many files have changed in this diff Show more