mirror of
https://github.com/safing/web
synced 2025-04-12 23:19:09 +00:00
Merge branch 'feature/integrate-safingTailwind'
This commit is contained in:
commit
6a74405441
83 changed files with 272803 additions and 4473 deletions
_data
_includes
footer.htmlhead.htmlheader.htmlnav.htmlnext_previous_item.htmlportmaster_plug.htmlprogress-update-tablecards.htmlproject_card.htmlproject_tablecard.htmlsource_code_faq.htmltag.htmlthumbnail_blog.htmlthumbnail_podcast.htmlthumbnail_video.html
_layouts
blog.htmlexception_container.htmllegal_container.htmlpage_container.htmlpodcast.htmlpublication_container.htmlvideo.html
_publications
2019-11-30-hiring-a-designer-from-the-privacy-community.md2020-07-31-progress-update-july.md2020-08-31-progress-update-august.md2020-10-02-progress-update-september.md2020-11-02-progress-update-october.md2020-12-03-progress-update-november.md2021-01-04-progress-update-december.md2021-02-04-progress-update-january.md2021-03-06-progress-update-february.md2021-04-08-progress-update-march.md2021-05-06-how-weak-business-models-destroy-everything-we-fight-for.md2021-05-07-progress-update-april.md2021-06-02-progress-update-may.md2021-07-02-progress-update-june.md2021-08-09-progress-update-july.md2021-09-01-progress-update-august.md2021-11-05-progress-update-october.md2021-12-07-progress-update-november.md2021-12-09-portmaster-vs-pi-hole.md
_sass
about
assets
backlog
blog
business-model
contact
esa-bic
index.htmljobs
next
ownership
podcast
portmaster
privacy
roadmapblog
spn
support
team
terms
vendor
video
|
@ -13,7 +13,7 @@ spn:
|
|||
a: The SPN is heavily inspired by Tor, but the mission is different. Next to tightly integrating with other privacy modules, the main focus of the SPN is easy protection for your whole computer, not just your browser. Additionally it spreads your connections across the globe instead of routing everything through the same circuit.
|
||||
link:
|
||||
text: Read our comparison blog to find out more.
|
||||
url: https://safing.io/blog/2020/01/22/how-the-spn-compares-to-tor/
|
||||
url: /blog/2020/01/22/how-the-spn-compares-to-tor/
|
||||
- q: How does the SPN compare to VPNs?
|
||||
a: The VPN technology was built to securely connect two company locations. However, the SPN was developed from the ground up to protect user privacy. As a result the SPN can easily outperform VPNs in every aspect.
|
||||
link:
|
||||
|
|
|
@ -1,95 +1,125 @@
|
|||
source:
|
||||
ffg:
|
||||
timespan: "2019-2021"
|
||||
# FFG Total:
|
||||
# - Received Funding: 278.421€
|
||||
# - Received Loans: 263.025€
|
||||
# - Funding In Prospect: 32.720€
|
||||
# - Loans In Prospect: 30.920€
|
||||
years:
|
||||
- year: 2021
|
||||
items:
|
||||
- type: funding
|
||||
amount: "32.720"
|
||||
status: open
|
||||
- type: loan
|
||||
amount: "30.920"
|
||||
status: open
|
||||
- year: 2021
|
||||
items:
|
||||
- type: funding
|
||||
amount: "49.080"
|
||||
status: completed
|
||||
- type: loan
|
||||
amount: "46.380"
|
||||
status: completed
|
||||
- year: 2020
|
||||
items:
|
||||
- type: funding
|
||||
amount: "146.541"
|
||||
status: completed
|
||||
- type: loan
|
||||
amount: "138.445"
|
||||
status: completed
|
||||
- year: 2019
|
||||
items:
|
||||
- type: funding
|
||||
amount: "82.800"
|
||||
status: completed
|
||||
- type: loan
|
||||
amount: "78.200"
|
||||
status: completed
|
||||
# Netidee Total:
|
||||
# - Received Funding: 117.839€
|
||||
# - Funding In Prospect: 5.000€
|
||||
netidee:
|
||||
timespan: "2017-2021"
|
||||
years:
|
||||
- year: 2021
|
||||
items:
|
||||
- type: funding
|
||||
amount: "5.000"
|
||||
status: open
|
||||
- year: 2021
|
||||
items:
|
||||
- type: funding
|
||||
amount: "20.000"
|
||||
status: completed
|
||||
- year: 2020
|
||||
items:
|
||||
- type: funding
|
||||
amount: "20.012"
|
||||
status: completed
|
||||
- year: 2019
|
||||
items:
|
||||
- type: funding
|
||||
amount: "30.048"
|
||||
status: completed
|
||||
- year: 2017
|
||||
items:
|
||||
- type: funding
|
||||
amount: "47.779"
|
||||
status: completed
|
||||
# Kickstarter is not counted towards the grants chart
|
||||
# since backers receive(d) SPN access in return
|
||||
kickstarter:
|
||||
timespan: "February 2020"
|
||||
years:
|
||||
- year: 2020
|
||||
items:
|
||||
- type: funding
|
||||
amount: "11.755"
|
||||
status: completed
|
||||
# ESA Total:
|
||||
# - Received Funding: 40.000€
|
||||
esa:
|
||||
timespan: "2018-2020"
|
||||
years:
|
||||
- year: 2019
|
||||
items:
|
||||
- type: funding
|
||||
amount: "40.000"
|
||||
status: completed
|
||||
- name: FFG
|
||||
description: |
|
||||
The FFG is the national funding institution for Research & Development of Austria. Their goal is to strengthen innovation and the economy.
|
||||
|
||||
We got accepted into the FFG Basisprogramm in 2019 continuing until 2021. The included funding and loan enabled us to hire our first employees and further progress our products.
|
||||
timespan: "2019-2021"
|
||||
# FFG Total:
|
||||
# - Received Funding: 278.421€
|
||||
# - Received Loans: 263.025€
|
||||
# - Funding In Prospect: 32.720€
|
||||
# - Loans In Prospect: 30.920€
|
||||
years:
|
||||
- year: 2021
|
||||
items:
|
||||
- type: funding
|
||||
amount: "32.720"
|
||||
status: open
|
||||
- type: loan
|
||||
amount: "30.920"
|
||||
status: open
|
||||
- year: 2021
|
||||
items:
|
||||
- type: funding
|
||||
amount: "49.080"
|
||||
status: completed
|
||||
- type: loan
|
||||
amount: "46.380"
|
||||
status: completed
|
||||
- year: 2020
|
||||
items:
|
||||
- type: funding
|
||||
amount: "146.541"
|
||||
status: completed
|
||||
- type: loan
|
||||
amount: "138.445"
|
||||
status: completed
|
||||
- year: 2019
|
||||
items:
|
||||
- type: funding
|
||||
amount: "82.800"
|
||||
status: completed
|
||||
- type: loan
|
||||
amount: "78.200"
|
||||
status: completed
|
||||
# Netidee Total:
|
||||
# - Received Funding: 117.839€
|
||||
# - Funding In Prospect: 5.000€
|
||||
- name: Netidee
|
||||
description: |
|
||||
Netidee funding from 2017 helped us to kickstart all this. In late 2019 and 2020, they granted follow-up fundings for the years 2019/20 and 2020/21 respectively.
|
||||
timespan: "2017-2021"
|
||||
years:
|
||||
- year: 2021
|
||||
items:
|
||||
- type: funding
|
||||
amount: "5.000"
|
||||
status: open
|
||||
- year: 2021
|
||||
items:
|
||||
- type: funding
|
||||
amount: "20.000"
|
||||
status: completed
|
||||
- year: 2020
|
||||
items:
|
||||
- type: funding
|
||||
amount: "20.012"
|
||||
status: completed
|
||||
- year: 2019
|
||||
items:
|
||||
- type: funding
|
||||
amount: "30.048"
|
||||
status: completed
|
||||
- year: 2017
|
||||
items:
|
||||
- type: funding
|
||||
amount: "47.779"
|
||||
status: completed
|
||||
# Kickstarter is not counted towards the grants chart
|
||||
# since backers receive(d) SPN access in return
|
||||
- name: Kickstarter
|
||||
description: |
|
||||
Through our [crowdfunding campaign](https://www.kickstarter.com/projects/safingio/spn) we received our first supporters who also backed us financially. Thanks to every one of you for giving us your trust and money even before we had any software to show for!
|
||||
timespan: "February 2020"
|
||||
years:
|
||||
- year: 2020
|
||||
items:
|
||||
- type: funding
|
||||
amount: "11.755"
|
||||
status: completed
|
||||
# ESA Total:
|
||||
# - Received Funding: 40.000€
|
||||
- name: ESA-BIC Austria
|
||||
description: |
|
||||
Safing ICS Technologies GmbH is participating in the [ESA Business Incubation Centre Austria.](/esa-bic/) We are incubated by Accent, with SPG and the Lower Austrian State as the contractual partners.
|
||||
timespan: "2018-2020"
|
||||
years:
|
||||
- year: 2019
|
||||
items:
|
||||
- type: funding
|
||||
amount: "40.000"
|
||||
status: completed
|
||||
|
||||
|
||||
- name: Fund of Excellence
|
||||
description: |
|
||||
The Fund of Excellence is an investment fund by the Erste Group, that invests in people, rather than companies. They were investing in one of Safing's founders.
|
||||
timespan: "2018-2020"
|
||||
years:
|
||||
- year: 2018-2019
|
||||
items:
|
||||
- type: funding
|
||||
custom: "Received continuous personal funding"
|
||||
|
||||
- name: Personal Investment
|
||||
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.
|
||||
timespan: "2018-2020"
|
||||
years:
|
||||
- year: 2019
|
||||
items:
|
||||
- type: funding
|
||||
custom: "Invested over 200.000€ in value"
|
||||
|
||||
# Total Numbers of Grants/Loans Image
|
||||
#
|
||||
|
@ -100,4 +130,4 @@ source:
|
|||
# Investors: 0€ => 0€
|
||||
|
||||
# the previous image had a higher count since
|
||||
# it also counted the Grants/Loans held out in prospect
|
||||
# it also counted the Grants/Loans held out in prospect
|
|
@ -1,179 +1,117 @@
|
|||
<footer class="bg-black p-8" id="footer">
|
||||
<div class="pt-12 pb-12 md: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 via Newsletter</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 focus:outline-none" required placeholder="email">
|
||||
<div class="pt-5 lg:pt-0 lg:pl-5 ">
|
||||
<input type="submit" value="Subscribe" style="background-color: #6188ff;" class="cursor-pointer 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="mx-auto lg:mx-0 max-w-lg lg:max-w-md lg: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 &
|
||||
<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 process and use the email for newsletter purposes.
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<footer class="footer" id="footer">
|
||||
<div class="footer-form-wrapper">
|
||||
<span class="footer-form-title">Stay Connected via Newsletter</span>
|
||||
<form class="footer-form" action="https://t80607841.emailsys1a.net/184/1387/c70759e794/subscribe/form.html" method="post">
|
||||
<div class="footer-form-subscribe">
|
||||
<input class="input-rounded-primary w-full" type="email" name="email" required placeholder="email">
|
||||
<input class="btn-primary" type="submit" value="Subscribe">
|
||||
</div>
|
||||
<div class="footer-form-legal">
|
||||
<input class="toggle" type="checkbox" id="consent_text" name="consent_text" value="yes" required="">
|
||||
<div>
|
||||
<label class="consent cursor-pointer text-safing-gray-500" for="consent_text">
|
||||
I agree that Safing &
|
||||
<a class="link-primary-external" href="https://rapidmail.de" target="_blank">rapidmail.de</a>
|
||||
may process and use the email for newsletter purposes.
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="grid mx-auto grid-rows-4 grid-cols-1 sm:grid-rows-2 sm:grid-cols-2 row-gap-16 lg:row-gap-0 lg:grid-cols-none lg:grid-rows-none grid-flow-col-dense grid-flow-row-dense justify-center md:justify-around max-w-screen-sm lg:max-w-screen-xl pt-10">
|
||||
<div class="flex" style="width: max-content;">
|
||||
<div>
|
||||
<p class="text-white text-xl mb-6">Company</p>
|
||||
<ul class="list-reset">
|
||||
<li class="block 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-3 block mr-0">
|
||||
<a href="{{ site.business_model_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Business Model</a>
|
||||
</li>
|
||||
<li class="mt-3 block 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-3 block mr-0 relative">
|
||||
<a href="{{ site.jobs_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">
|
||||
We're Hiring
|
||||
</a>
|
||||
<span class="absolute -mr-2 rounded-full" style="width: 0.35rem; height: 0.35rem; background: #6188ff; left: -11px; top: 9px;">
|
||||
</span>
|
||||
</li>
|
||||
<li class="mt-3 block 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 class="footer-wrapper">
|
||||
<div class="footer-category">
|
||||
<div class="footer-category-title">
|
||||
<span>Company</span>
|
||||
</div>
|
||||
<div class="footer-links">
|
||||
<div class="footer-links-left">
|
||||
<a href="{{ site.about_url }}" class="footer-link"> About Us </a>
|
||||
<a href="{{ site.business_model_url }}" class="footer-link"> Business Model </a>
|
||||
<a href="{{ site.ownership_url }}" class="footer-link"> Ownership </a>
|
||||
<div class="flex items-center">
|
||||
<span class="dot absolute -ml-5"></span>
|
||||
<a href="{{ site.jobs_url }}" class="footer-link"> We're Hiring </a>
|
||||
</div>
|
||||
<a href="{{ site.help_url }}" class="footer-link"> Get Help </a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hidden lg:block ml-8 mr-8 border-r-2 border-white w-0 h-full" style="opacity: .1;"></div>
|
||||
<div class="flex relative">
|
||||
<div>
|
||||
<p class="text-white text-xl mb-6">Community</p>
|
||||
<div class="flex" style="width: max-content;">
|
||||
<ul class="list-reset">
|
||||
<li class="block mr-0">
|
||||
<a href="{{ site.next_page_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out"> What's Next?</a>
|
||||
</li>
|
||||
<li class="mt-3 flex items-center 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>
|
||||
<a href="{{ site.blog_feed_url }}" style="transform: scale(0.8); margin-top: 2px; margin-left: 3px;"
|
||||
class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">
|
||||
<img style="height: 1.3rem; width: auto;" src="{{ site.img_url }}icons/rss-white.svg">
|
||||
</a>
|
||||
</li>
|
||||
<li class="mt-3 flex items-center 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>
|
||||
<a href="{{ site.podcast_feed_url }}" style="transform: scale(0.8); margin-top: 2px; margin-left: 3px;"
|
||||
class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">
|
||||
<img style="height: 1.3rem; width: auto;" src="{{ site.img_url }}icons/rss-white.svg">
|
||||
</a>
|
||||
</li>
|
||||
<li class="mt-3 block mr-0">
|
||||
<a href="{{ site.video_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Videos</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="list-reset pl-12">
|
||||
<li class="block mr-0">
|
||||
<a href="{{ site.docs_code_of_conduct_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Code of Conduct</a>
|
||||
</li>
|
||||
<li class="mt-3 block 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-3 block 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-3 block 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="vertical-line"></div>
|
||||
<div class="footer-category">
|
||||
<div class="footer-category-title">
|
||||
<span>Community</span>
|
||||
</div>
|
||||
<div class="footer-links">
|
||||
<div class="footer-links-left">
|
||||
<a href="{{ site.next_page_url }}" class="footer-link"> What's Next? </a>
|
||||
<div class="flex items-center space-x-2">
|
||||
<a href="{{ site.blog_url }}" class="footer-link"> Blog </a>
|
||||
<a href="{{ site.blog_feed_url }}" class="footer-link"><i class="icon-rss text-xs"></i></a>
|
||||
</div>
|
||||
<div class="flex items-center space-x-2">
|
||||
<a href="{{ site.podcast_url }}" class="footer-link"> Podcast </a>
|
||||
<a href="{{ site.podcast_feed_url }}" class="footer-link"><i class="icon-rss text-xs"></i></a>
|
||||
</div>
|
||||
<a href="{{ site.video_url }}" class="footer-link"> Videos </a>
|
||||
</div>
|
||||
<div class="footer-links-right">
|
||||
<a href="{{ site.docs_code_of_conduct_url }}" class="footer-link"> Code of Conduct </a>
|
||||
<a href="{{ site.github_url }}" class="footer-link"> Github </a>
|
||||
<a href="{{ site.reddit_url }}" class="footer-link"> Reddit </a>
|
||||
<a href="{{ site.twitter_url }}" class="footer-link"> Twitter </a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hidden lg:block ml-8 mr-8 border-r-2 border-white w-0 h-full" style="opacity: .1;"></div>
|
||||
<div class="flex-1">
|
||||
<div class="flex items-center">
|
||||
<p class="text-white text-xl mb-6 pr-10">Portmaster</p>
|
||||
<div class="border-t-2 border-white w-full" style="opacity: .1; height: 20px;"></div>
|
||||
<div class="vertical-line"></div>
|
||||
<div class="footer-category">
|
||||
<div class="footer-category-title">
|
||||
<span>Portmaster</span>
|
||||
<div class="horizontal-line"></div>
|
||||
</div>
|
||||
<div class="footer-links">
|
||||
<div class="footer-links-left">
|
||||
<a href="{{ site.portmaster_url }}" class="footer-link"> Discover </a>
|
||||
<a href="{{ site.docs_url }}portmaster/architecture/overview" class="footer-link"> Documentation </a>
|
||||
<a href="{{ site.github_url }}/portmaster/" class="footer-link"> Source Code </a>
|
||||
<a href="{{ site.backlog_url }}#portmaster" class="footer-link"> Backlog </a>
|
||||
</div>
|
||||
<div class="footer-links-right">
|
||||
<a href="{{ site.pihole_comparison_url }}" class="footer-link"> vs Pi-hole</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<ul class="list-reset mb-6">
|
||||
<li class="block mr-0">
|
||||
<a href="{{ site.portmaster_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Discover</a>
|
||||
</li>
|
||||
<li class="mt-3 block mr-0">
|
||||
<a href="{{ site.docs_url }}portmaster/architecture/overview" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Documentation</a>
|
||||
</li>
|
||||
<li class="mt-3 block mr-0">
|
||||
<a href="{{ site.github_url }}/portmaster/" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Source Code</a>
|
||||
</li>
|
||||
<li class="mt-3 block mr-0">
|
||||
<a href="{{ site.backlog_url }}#portmaster" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Backlog</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="list-reset mb-6 pl-12">
|
||||
<li class=" block mr-0">
|
||||
<a href="{{ site.pihole_comparison_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">vs Pi-hole</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="footer-category">
|
||||
<div class="footer-category-title">
|
||||
<span>SPN</span>
|
||||
<div class="horizontal-line"></div>
|
||||
</div>
|
||||
<div class="footer-links">
|
||||
<div class="footer-links-left">
|
||||
<a href="{{ site.spn_url }}" class="footer-link"> Discover </a>
|
||||
<a href="{{ site.whitepaper_url }}" class="footer-link"> Whitepaper </a>
|
||||
<a href="{{ site.github_url }}/spn/" class="footer-link"> Source Code </a>
|
||||
<a href="{{ site.backlog_url }}#spn" class="footer-link"> Backlog </a>
|
||||
</div>
|
||||
<div class="footer-links-right">
|
||||
<a href="{{ site.tor_comparison_url }}" class="footer-link"> vs Tor </a>
|
||||
<a href="{{ site.vpn_comparison_url }}" class="footer-link"> vs VPNs </a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hidden lg:block ml-0 mr-0 w-0 h-full"></div>
|
||||
<div class="flex-1">
|
||||
<div class="flex items-center">
|
||||
<p class="text-white text-xl mb-6 pr-10">SPN</p>
|
||||
<div class="border-t-2 border-white w-full" style="opacity: .1; height: 20px;"></div>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<ul class="list-reset mb-6">
|
||||
<li class="block mr-0">
|
||||
<a href="{{ site.spn_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Discover</a>
|
||||
</li>
|
||||
<li class="mt-3 block 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>
|
||||
<li class="mt-3 block mr-0">
|
||||
<a href="{{ site.github_url }}/spn/" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Source Code</a>
|
||||
</li>
|
||||
<li class="mt-3 block mr-0">
|
||||
<a href="{{ site.backlog_url }}#spn" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Backlog</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="list-reset mb-6 pl-12">
|
||||
<li class="block mr-0">
|
||||
<a href="{{ site.tor_comparison_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">vs Tor</a>
|
||||
</li>
|
||||
<li class="mt-3 block mr-0">
|
||||
<a href="{{ site.vpn_comparison_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">vs VPNs</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-sm pt-20 pb-4">
|
||||
<div class="lg:flex md:mx-auto" style="width: max-content;">
|
||||
<p class="md:text-center leading-6 text-white opacity-25">
|
||||
© {{ site.time | date: '%Y' }} Safing ICS Technologies GmbH
|
||||
</p>
|
||||
<ul class=" pt-5 lg:pt-0 md:flex">
|
||||
<li class="lg:pl-16">
|
||||
<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="pt-4 md:py-0 md:pl-10">
|
||||
<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>
|
||||
<li class="pt-4 md:py-0 md:pl-10">
|
||||
<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>
|
||||
</ul>
|
||||
</div>
|
||||
<p class="md:text-center leading-6 text-white opacity-25 pt-10 md:pt-4">
|
||||
Companies mentioned are by way of example and are an opinion only, not based on fact.
|
||||
</p>
|
||||
<div class="footer-legal">
|
||||
<div class="footer-legal-wrapper">
|
||||
<span class="footer-legal-copyright">
|
||||
© {{ site.time | date: '%Y' }} Safing ICS Technologies GmbH
|
||||
</span>
|
||||
<div class="footer-legal-links">
|
||||
<a href="{{ site.terms_url }}" class="footer-legal-link"> Terms of Service </a>
|
||||
<a href="{{ site.privacy_url }}" class="footer-legal-link"> Privacy Policy </a>
|
||||
<a href="{{ site.contact_url }}" class="footer-legal-link"> Contact & Notice </a>
|
||||
</div>
|
||||
</div>
|
||||
<span class="footer-legal-extra">
|
||||
Companies mentioned are by way of example and are an opinion only, not based on fact.
|
||||
</span>
|
||||
</div>
|
||||
</footer>
|
||||
|
|
|
@ -39,5 +39,5 @@
|
|||
<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.vendor_url }}safingTailwind/safingTailwind-1.5.css" type="text/css">
|
||||
<link rel="stylesheet" href="{{ site.assets_url }}css/main.css" type="text/css">
|
||||
|
|
|
@ -1,42 +1,23 @@
|
|||
<header class="relative h-full bg-local bg-no-repeat bg-cover bg-center lg:pb-40 md:pt-32">
|
||||
<span class="bottom-0 left-0 absolute hidden lg:block">
|
||||
<header class="header-one-container mb-64">
|
||||
<div class="header-one-left">
|
||||
<span style="margin-top: -8rem; margin-left: 14rem; z-index: -1;" class="absolute">
|
||||
<img src="{{ site.img_url }}/shapes/circle-md-2.png" alt="">
|
||||
</span>
|
||||
<h1 class="header-one-left-title">
|
||||
<span class="text-safing-blue-500">Fight surveillance</span>
|
||||
because you
|
||||
<span class="text-safing-blue-500">love Freedom</span>.
|
||||
</h1>
|
||||
<p class="header-one-left-desc">
|
||||
Without privacy there is no freedom of press, no freedom of speech,
|
||||
not even freedom of thought.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.portmaster_url }}">Take back your freedom</a>
|
||||
</div>
|
||||
<div class="header-one-right">
|
||||
<img class="max-w-2xl" src="{{ site.img_url }}freedom.gif" alt="">
|
||||
</div>
|
||||
<span style="z-index: -1;" class="-bottom-12 left-0 absolute hidden xl:block">
|
||||
<img src="{{ site.img_url }}/shapes/corner-bl.png" alt="">
|
||||
</span>
|
||||
<div class="flex items-center md:h-full">
|
||||
<div class="container mx-auto sm:px-8 sm:px-0">
|
||||
<div class="container mx-auto px-8 pt-16 md:pt-0 sm:px-0 flex">
|
||||
<div class="max-w-screen-xl 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">
|
||||
<span style="margin-top: -8rem; margin-left: 14rem; z-index: -1;" class="absolute">
|
||||
<img src="{{ site.img_url }}/shapes/circle-md-2.png" alt="">
|
||||
</span>
|
||||
<h2 class="py-10 text-5xl tracking-tight font-extrabold text-gray-900 sm:text-5xl leading-none md:text-6xl md:mx-auto">
|
||||
<!-- the is super nice for bigger screens, but breaks stuff on mobile -->
|
||||
<!-- hence, we only have the header with on md+ devices -->
|
||||
<span class="block md:hidden">
|
||||
<span style="color: #6188ff;">Fight surveillance</span> because you <span style="color: #6188ff;">love Freedom</span>.
|
||||
</span>
|
||||
<span class="hidden md:block">
|
||||
<span style="color: #6188ff;">Fight surveillance</span> because you <span style="color: #6188ff;">love Freedom</span>.
|
||||
</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.
|
||||
</p>
|
||||
<div class="pb-0 pt-10 md:py-10 lg:flex text-center">
|
||||
<a href="{{ site.portmaster_url }}">
|
||||
<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">
|
||||
Take back your freedom
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img class="flex mx-auto md:mt-12 transform md:pr-1 md:left-0 md:right-0 lg:relative md:max-w-sm lg:max-w-md lg:scale-150 lg:ml-16" src="{{ site.img_url }}freedom.gif" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
|
|
@ -1,88 +1,41 @@
|
|||
<nav class="flex flex-wrap items-center bg-black px-10 py-6 w-full z-50">
|
||||
<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>
|
||||
<nav class="nav">
|
||||
<div class="nav-left">
|
||||
<a href="{{ site.base_url }}" class="nav-logo-wrapper">
|
||||
<!-- turn this into a font icon -->
|
||||
<svg class="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" opacity=".8"></path>
|
||||
<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" opacity=".8"></path>
|
||||
<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"></path>
|
||||
<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)"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<span>Safing<span>.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 class="nav-right-burger" for="nav-toggle-visable">
|
||||
<!-- turn this into a font icon -->
|
||||
<svg class="h-6 w-6 fill-current text-white" stroke="currentColor" fill="none" viewBox="0 0 24 24">
|
||||
<path class="inline-flex" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
|
||||
<path class="hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
||||
</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.docs_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">
|
||||
Docs
|
||||
</a>
|
||||
</li>
|
||||
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
|
||||
<a href="{{ site.github_url }}/portmaster/" 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">
|
||||
Source Code
|
||||
</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 relative">
|
||||
<a href="{{ site.next_page_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">
|
||||
What's Next?
|
||||
</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>
|
||||
<input class="nav-toggle-burger" id="nav-toggle-visable" type="checkbox">
|
||||
<div class="nav-right">
|
||||
<div class="nav-right-links">
|
||||
<a href="{{ site.portmaster_url }}" class="nav-link"> Portmaster </a>
|
||||
<a href="{{ site.spn_url }}" class="nav-link"> SPN </a>
|
||||
<a href="{{ site.docs_url }}" class="nav-link"> Docs </a>
|
||||
<a href="{{ site.github_url }}/portmaster/" class="nav-link"> Source Code </a>
|
||||
<a href="{{ site.about_url }}" class="nav-link"> About </a>
|
||||
<a href="{{ site.next_page_url }}" class="nav-link"> What's Next </a>
|
||||
<a href="{{ site.help_url }}" class="nav-link"> Get Help </a>
|
||||
</div>
|
||||
<div class="nav-right-actions">
|
||||
<a href="{{ site.account_server_url }}account/sign_in" class="nav-link"> Sign In </a>
|
||||
<a href="{{ site.account_server_url }}account/sign_up" class="btn-primary justify-center"> Sign Up </a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<div class="flex mt-24 justify-center grid grid-rows-2 grid-cols-2 row-gap-12 md:grid-rows-1 md:row-gap-0 md:col-gap-16 max-w-3xl mx-auto">
|
||||
<div class="prev-next-container">
|
||||
{% if page.next.url %}
|
||||
<div class="text-left row-start-1 row-end-2 col-start-1 col-end-3 md:row-auto md:col-auto">
|
||||
<div class="prev-next-container-next">
|
||||
{% if page.next.category == "blog" %}
|
||||
{% assign next_type = "Blog Post" %}
|
||||
{% elsif page.next.category == "video" %}
|
||||
|
@ -8,12 +8,14 @@
|
|||
{% elsif page.next.category == "podcast" %}
|
||||
{% assign next_type = "Podcast" %}
|
||||
{% endif %}
|
||||
<div class="pb-4 text-md opacity-55">Next {{ next_type }}</div>
|
||||
<a href="{{ page.next.url }}" class="text-3xl tracking-tight font-extrabold leading-none break-normal">{{ page.next.title }}</a>
|
||||
<span class="prev-next-container-next-title">
|
||||
Next {{ next_type }}
|
||||
</span>
|
||||
<a href="{{ page.next.url }}" class="link-primary">{{ page.next.title }}</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if page.previous.url %}
|
||||
<div class="text-right row-start-2 row-end-3 col-start-1 md:col-start-2 col-end-3 md:row-auto">
|
||||
<div class="prev-next-container-previous">
|
||||
{% if page.previous.category == "blog" %}
|
||||
{% assign previous_type = "Blog Post" %}
|
||||
{% elsif page.previous.category == "video" %}
|
||||
|
@ -21,8 +23,10 @@
|
|||
{% elsif page.previous.category == "podcast" %}
|
||||
{% assign previous_type = "Podcast" %}
|
||||
{% endif %}
|
||||
<div class="pb-4 text-md opacity-55">Previous {{ previous_type }}</div>
|
||||
<a href="{{ page.previous.url }}" class="text-3xl tracking-tight font-extrabold leading-none break-normal">{{ page.previous.title }}</a>
|
||||
<span class="prev-next-container-next-title">
|
||||
Previous {{ previous_type }}
|
||||
</span>
|
||||
<a href="{{ page.previous.url }}" class="link-primary">{{ page.previous.title }}</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
|
|
@ -1,17 +1,11 @@
|
|||
<a href="{{ site.portmaster_url }}" style="opacity: 1;" id="portmaster-plug">
|
||||
<div class="w-full" style="height: 260px;">
|
||||
<div class="absolute mx-auto right-0 left-0 rounded-md flex items-center" style="max-width: 950px; height: inherit;">
|
||||
<img class="hidden lg:block absolute" style="margin-top: 12rem; margin-left: 55.5rem; z-index: 1;" src="/assets/img/shapes/circle-md-2.png" alt="">
|
||||
</div>
|
||||
<div class="absolute mx-auto right-0 left-0 rounded-md flex items-center overflow-hidden" style="background-color: #647cbf; max-width: 950px; height: inherit;">
|
||||
<img class="absolute right-0 bottom-0 hidden lg:block max-w-5xl lg:max-w-full" style="margin-right: -28.8rem; margin-bottom: -14.1rem;" src="{{ site.img_url }}page-specific/portmaster/full-interface.png" alt="">
|
||||
<div class="text-center mx-auto lg:text-left lg:ml-20">
|
||||
<span class="text-white font-bold block lg:max-w-sm" style="font-size: 2.8rem; line-height: 41px;">Discover the Portmaster</span>
|
||||
<span class="text-white text-md block mt-3 opacity-75">Open Source. Free Forever.</span>
|
||||
<button type="button" style="background-color: #ffff; color: #647cbf; margin-left: -8px;" class="mt-3 transform scale-95 hover:scale-90 lg:inline-flex px-8 py-2 border border-transparent text-sm md: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">
|
||||
Take Back Control
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<a class="advert-container" href="{{ site.portmaster_url }}">
|
||||
<div class="advert-container-left">
|
||||
<span class="advert-container-left-title">Discover the Portmaster</span>
|
||||
<span class="advert-container-left-sub">Open Source. Free Forever.</span>
|
||||
<div class="advert-container-left-button btn bg-black text-safing-blue-400">Take Back Control</div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="absolute mx-auto right-0 left-0 rounded-md flex items-center overflow-hidden" style="max-width: 950px; height: inherit;">
|
||||
<img class="absolute right-0 bottom-0 hidden lg:block max-w-5xl lg:max-w-full" style="margin-right: -28.8rem; margin-bottom: -14.1rem;" src="{{ site.img_url }}page-specific/portmaster/full-interface.png" alt="">
|
||||
</div>
|
||||
<img class="hidden lg:block absolute -right-8 -bottom-8" style="z-index: 1;" src="{{ site.img_url }}/shapes/circle-md-2.png" alt="">
|
||||
</a>
|
||||
|
|
54
_includes/progress-update-tablecards.html
Normal file
54
_includes/progress-update-tablecards.html
Normal file
|
@ -0,0 +1,54 @@
|
|||
<div class="space-y-10">
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="space-y-10">
|
||||
<div class="space-y-3" style="max-width: 750px;">
|
||||
<h3>Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="space-y-10">
|
||||
<div class="space-y-3" style="max-width: 750px;">
|
||||
<h3>In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="space-y-10">
|
||||
<div class="space-y-3" style="max-width: 750px;">
|
||||
<h3>Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="space-y-10">
|
||||
<div class="space-y-3" style="max-width: 750px;">
|
||||
<h3>Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
|
@ -1,65 +1,56 @@
|
|||
<div class="card text-left transform">
|
||||
<div class="block cardshadow p-8 rounded-lg">
|
||||
<div class="tabs">
|
||||
<div class="tab">
|
||||
<input class="dropinput" type="checkbox" id="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}">
|
||||
<label style="min-width: 90%; min-height: 150px; display: block;" class="absolute cursor-pointer" for="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}">
|
||||
<img class="absolute right-0" style="margin-right: 1rem;" id="icon" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
||||
</label>
|
||||
<div>
|
||||
<div class="flex">
|
||||
{% for tag in card.projects %}
|
||||
{% include tag.html tag=tag %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="flex pt-6 items-center">
|
||||
<div>
|
||||
{% if include.state == 'done' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/tick.svg" alt="">
|
||||
{% elsif include.state == 'in_progress' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/cog.svg" alt="">
|
||||
{% elsif include.state == 'discarded' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/cross.svg" alt="">
|
||||
{% elsif include.state == 'postponed' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/files.svg" alt="">
|
||||
{% elsif include.state == 'backlog' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/files.svg" alt="">
|
||||
{% endif %}
|
||||
</div>
|
||||
<h1 class="pl-3 font-bold text-lg">{{ card.title }}</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding-left: 0;" class="tab-content opacity-50 text-md">
|
||||
<p>The Assignment:</p>
|
||||
<br/>
|
||||
{% for paragraph in card.description %}
|
||||
<p>{{ paragraph }}</p>
|
||||
{% unless forloop.last %}
|
||||
<br/>
|
||||
{% endunless %}
|
||||
<div class="card">
|
||||
<label class="card-label" for="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}">
|
||||
<div class="wrapper-left">
|
||||
<div class="flex">
|
||||
{% for tag in card.projects %}
|
||||
{% include tag.html tag=tag %}
|
||||
{% endfor %}
|
||||
|
||||
{% if card.link %}
|
||||
<br/>
|
||||
<a href="{{ card.link.url }}">
|
||||
{{ card.link.text }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-3">
|
||||
<div class="absolute top-0 right-0 mr-6 pt-1 overflow-visible mt-20 sm:mt-16 sm:mr-16">
|
||||
<div class="flex-shrink-0 mt-0">
|
||||
<div class="flex ">
|
||||
{% for member in card.team %}
|
||||
<span class="transform hover:scale-110 duration-150 ease-in-out" tooltip="{{ member | capitalize }}" >
|
||||
<img class="inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="{{ site.img_url }}profiles/{{ member | downcase }}.png" alt="{{ member }}">
|
||||
</span>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-title">
|
||||
{% if include.state == 'done' %}
|
||||
<i class="icon-tick text-green-500"></i>
|
||||
{% elsif include.state == 'in_progress' %}
|
||||
<i class="icon-cog text-gray-500"></i>
|
||||
{% elsif include.state == 'discarded' %}
|
||||
<i class="icon-cross text-red-500"></i>
|
||||
{% elsif include.state == 'postponed' %}
|
||||
<i class="icon-files text-gray-800"></i>
|
||||
{% elsif include.state == 'backlog' %}
|
||||
<i class="icon-files text-gray-800"></i>
|
||||
{% endif %}
|
||||
<h3 class="title">{{ card.title }}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wrapper-right">
|
||||
<div class="wrapper-right-profiles">
|
||||
{% for member in card.team %}
|
||||
<div class="circular-profile" tooltip="{{ member | capitalize }}">
|
||||
<img src="{{ site.img_url }}profiles/{{ member | downcase }}.png" alt="{{ member | capitalize }}">
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<i class="icon-arrow"></i>
|
||||
</div>
|
||||
</label>
|
||||
<input class="card-input-toggle" id="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}" type="checkbox">
|
||||
<div class="card-dropdown-toggle">
|
||||
<div class="card-dropdown-content">
|
||||
<h4>The Assignment:</h4>
|
||||
<br/>
|
||||
{% for paragraph in card.description %}
|
||||
<p>{{ paragraph }}</p>
|
||||
{% unless forloop.last %}
|
||||
<br/>
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
|
||||
{% if card.link %}
|
||||
<br/>
|
||||
<a href="{{ card.link.url }}">
|
||||
{{ card.link.text }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -1,125 +1,81 @@
|
|||
<div class="tablecard cardshadow text-left transform">
|
||||
<div class="block px-8 py-6 rounded-lg">
|
||||
<div class="absolute top-0 right-0 overflow-visible mr-16 mt-12 z-20">
|
||||
<div class="flex-shrink-0 mt-0">
|
||||
<div class="flex ">
|
||||
{% for member in card.team %}
|
||||
<span class="transform hover:scale-110 duration-150 ease-in-out" tooltip="{{ member | capitalize }}">
|
||||
<img class="inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="{{ site.img_url }}profiles/{{ member | downcase }}.png" alt="{{ member }}">
|
||||
</span>
|
||||
<div class="card-extended">
|
||||
<label class="card-label" for="tablecard-{{ include.state }}-{{ forloop.index }}">
|
||||
<div class="wrapper-left">
|
||||
<div class="flex">
|
||||
{% for tag in card.projects %}
|
||||
{% include tag.html tag=tag %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tabs">
|
||||
<div class="tab relative">
|
||||
<input class="dropinput" type="checkbox" id="tablecard-{{ include.state }}-{{ forloop.index }}">
|
||||
<label style="min-width: 100%; min-height: 115px; display: block;" class="z-10 absolute cursor-pointer" for="tablecard-{{ include.state }}-{{ forloop.index }}">
|
||||
<img class="absolute right-0" style="margin-right: 1rem; margin-top: 1.2rem;" id="icon" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
||||
</label>
|
||||
<div class="flex relative ">
|
||||
<div>
|
||||
<div class="flex">
|
||||
{% for tag in card.projects %}
|
||||
{% assign tag_bg_strength = 100 %}
|
||||
|
||||
{% if tag == 'Portmaster' %}
|
||||
{% assign tag_color = 'blue' %}
|
||||
{% elsif tag == 'SPN' %}
|
||||
{% assign tag_color = 'green' %}
|
||||
{% elsif tag == 'Website' %}
|
||||
{% assign tag_color = 'pink' %}
|
||||
{% elsif tag == 'Back Office' %}
|
||||
{% assign tag_color = 'gray' %}
|
||||
{% assign tag_bg_strength = 200 %}
|
||||
{% elsif tag == 'Community' %}
|
||||
{% assign tag_color = 'purple' %}
|
||||
{% elsif tag == 'Marketing' %}
|
||||
{% assign tag_color = 'orange' %}
|
||||
{% endif %}
|
||||
<span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium leading-5 bg-{{ tag_color }}-{{ tag_bg_strength }} text-{{ tag_color }}-800 mr-2">
|
||||
{{ tag }}
|
||||
</span>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="flex pt-3 items-center">
|
||||
<div>
|
||||
{% if include.state == 'done' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/tick.svg" alt="">
|
||||
{% elsif include.state == 'in_progress' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/cog.svg" alt="">
|
||||
{% elsif include.state == 'discarded' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/cross.svg" alt="">
|
||||
{% elsif include.state == 'postponed' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/files.svg" alt="">
|
||||
{% elsif include.state == 'backlog' %}
|
||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/files.svg" alt="">
|
||||
{% endif %}
|
||||
</div>
|
||||
<h4 class="pl-3 font-bold text-lg pr-16 ">{{ card.title }}</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-title">
|
||||
{% if include.state == 'done' %}
|
||||
<i class="icon-tick text-green-500"></i>
|
||||
{% elsif include.state == 'in_progress' %}
|
||||
<i class="icon-cog text-gray-500"></i>
|
||||
{% elsif include.state == 'discarded' %}
|
||||
<i class="icon-cross text-red-500"></i>
|
||||
{% elsif include.state == 'postponed' %}
|
||||
<i class="icon-files text-gray-800"></i>
|
||||
{% elsif include.state == 'backlog' %}
|
||||
<i class="icon-files text-gray-800"></i>
|
||||
{% endif %}
|
||||
<h3 class="title">{{ card.title }}</h3>
|
||||
</div>
|
||||
<div style="padding-left: 0; padding-right: 0;" class="tab-content text-md">
|
||||
<div class="block py-3">
|
||||
<hr>
|
||||
<div class="tab relative" id="tabtwo">
|
||||
<input class="dropinput" type="checkbox" id="tablecard-description-{{ include.state }}-{{ forloop.index }}">
|
||||
<label style="min-width: 100%; min-height: 115px; display: block;" class="z-10 absolute cursor-pointer" for="tablecard-description-{{ include.state }}-{{ forloop.index }}">
|
||||
<img class="absolute right-0" style="margin-right: 1rem; margin-top: 0.5rem;" id="icontwo" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
||||
</div>
|
||||
<div class="wrapper-right">
|
||||
<div class="wrapper-right-profiles">
|
||||
{% for member in card.team %}
|
||||
<div class="circular-profile" tooltip="{{ member | capitalize }}">
|
||||
<img src="{{ site.img_url }}profiles/{{ member | downcase }}.png" alt="{{ member | capitalize }}">
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<i class="icon-arrow"></i>
|
||||
</div>
|
||||
</label>
|
||||
<input class="card-input-toggle" id="tablecard-{{ include.state }}-{{ forloop.index }}" type="checkbox">
|
||||
<div class="card-dropdown-toggle">
|
||||
<div class="card-dropdown-content markdown-container max-w-full pr-0">
|
||||
<div class="card">
|
||||
<label class="card-label" for="tablecard-description-{{ include.state }}-{{ forloop.index }}">
|
||||
<div class="wrapper-left">
|
||||
<div class="card-title">
|
||||
<h1 class="title">Assignment</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wrapper-right">
|
||||
<i class="icon-arrow"></i>
|
||||
</div>
|
||||
</label>
|
||||
<div class="flex relative">
|
||||
<div class="self-center -mt-5">
|
||||
<div class="absolute right-0 mr-12 transform scale-110">
|
||||
<input class="card-input-toggle" id="tablecard-description-{{ include.state }}-{{ forloop.index }}" type="checkbox">
|
||||
<div class="card-dropdown-toggle">
|
||||
<div class="card-dropdown-content">
|
||||
{% for paragraph in card.description %}
|
||||
<p>{{ paragraph }}</p>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex pt-3" style="margin-left: 1rem;">
|
||||
<div>
|
||||
<img src="" alt="">
|
||||
</div>
|
||||
<span class=" text-md opacity-50">Assignment</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding-left: 3; padding-right: 1em; padding-top: 0;" class="tab-content text-md">
|
||||
<p>
|
||||
{% for paragraph in card.description %}
|
||||
{{ paragraph }}
|
||||
{% endfor %}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
<div>
|
||||
{% for tag in card.progress %}
|
||||
{% if tag.type == 'a' %}
|
||||
<{{ tag.type }} href='{{ tag.href }}'>{{ tag.text }}</{{tag.type}}>
|
||||
{% elsif tag.type == 'br' %}
|
||||
<br/>
|
||||
{% elsif tag.type == 'ol' %}
|
||||
<ol>
|
||||
{% for li in tag.lis %}
|
||||
<li>{{ li }}</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
{% elsif tag.type == 'ul' %}
|
||||
<ul>
|
||||
{% for li in tag.lis %}
|
||||
<li>{{ li }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<{{ tag.type }}>{{ tag.text }}</{{tag.type}}>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<!-- <div class="pt-12">
|
||||
<span style="font-size: 0.8rem;" class="absolute right-0"><strong>01/6/2020</strong> <span class="opacity-50">-</span><strong> 31/6/2020</strong></span>
|
||||
</div> -->
|
||||
</div>
|
||||
{% for tag in card.progress %}
|
||||
{% if tag.type == 'a' %}
|
||||
<p><{{ tag.type }} href='{{ tag.href }}'>{{ tag.text }}</{{tag.type}}></p>
|
||||
{% elsif tag.type == 'br' %}
|
||||
<br/>
|
||||
{% elsif tag.type == 'ol' %}
|
||||
<ol>
|
||||
{% for li in tag.lis %}
|
||||
<li>{{ li }}</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
{% elsif tag.type == 'ul' %}
|
||||
<ul>
|
||||
{% for li in tag.lis %}
|
||||
<li>{{ li }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<{{ tag.type }}>{{ tag.text }}</{{tag.type}}>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
30
_includes/source_code_faq.html
Normal file
30
_includes/source_code_faq.html
Normal file
|
@ -0,0 +1,30 @@
|
|||
{% if include.faq_id %}
|
||||
{% assign faq_id = include.faq_id %}
|
||||
{% else %}
|
||||
{% assign faq_id = "0" %}
|
||||
{% endif %}
|
||||
|
||||
<div class="faq-container-bottom-question">
|
||||
<div class="card-faq hover-scale-out">
|
||||
<label class="card-label" for="card-toggle-anchor-{{ faq_id }}">
|
||||
<div class="wrapper-left">
|
||||
<div class="card-title">
|
||||
<h3 class="title">
|
||||
Where can I find your source code?
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wrapper-right">
|
||||
<i class="icon-arrow"></i>
|
||||
</div>
|
||||
</label>
|
||||
<input class="card-input-toggle" id="card-toggle-anchor-{{ faq_id }}" type="checkbox">
|
||||
<div class="card-dropdown-toggle">
|
||||
<div class="card-dropdown-content">
|
||||
<div class="text-safing-gray-500">
|
||||
You can find our code on <a href="{{ site.github_url }}" class="link-primary">Github</a>. <a href="{{ site.github_url }}/portmaster/" class="link-primary">The Portmaster</a>, the <a href="{{ site.github_url }}/portmaster-ui/" class="link-primary">Portmaster UI</a>, the <a href="{{ site.github_url }}/spn/" class="link-primary">SPN</a>, the <a href="{{ site.github_url }}/docs/" class="link-primary">docs</a> and <a href="{{ site.github_url }}/web/" class="link-primary">this website</a> have their respective repositories. <a href="{{ site.github_url }}/jess/" class="link-primary">Jess</a>, the heart of the SPN, which got <a href="https://cure53.de/pentest-report_safing-jess.pdf">audited by Cure53</a>, can also be found online.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -1,18 +1,13 @@
|
|||
{% assign tag_bg_strength = 100 %}
|
||||
{% if include.tag == 'Portmaster' %}
|
||||
{% assign tag_color = 'blue' %}
|
||||
<span class="tag-portmaster">Portmaster</span>
|
||||
{% elsif include.tag == 'SPN' %}
|
||||
{% assign tag_color = 'green' %}
|
||||
<span class="tag-spn">SPN</span>
|
||||
{% elsif include.tag == 'Website' %}
|
||||
{% assign tag_color = 'pink' %}
|
||||
<span class="tag bg-pink-100 text-pink-800">Website</span>
|
||||
{% elsif include.tag == 'Back Office' %}
|
||||
{% assign tag_color = 'gray' %}
|
||||
{% assign tag_bg_strength = 200 %}
|
||||
<span class="tag bg-gray-100 text-gray-800">Back Office</span>
|
||||
{% elsif include.tag == 'Community' %}
|
||||
{% assign tag_color = 'purple' %}
|
||||
<span class="tag-community">Community</span>
|
||||
{% elsif include.tag == 'Marketing' %}
|
||||
{% assign tag_color = 'orange' %}
|
||||
<span class="tag-marketing">Marketing</span>
|
||||
{% endif %}
|
||||
<span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium leading-5 bg-{{ tag_color }}-{{ tag_bg_strength }} text-{{ tag_color }}-800 mr-2">
|
||||
{{ include.tag }}
|
||||
</span>
|
||||
|
|
|
@ -1,49 +1,42 @@
|
|||
<li class="list-none mt-10 md:mt-0 grid">
|
||||
<div class="block transform hover:scale-95 duration-150 ease-in-out" style="max-width: 350px; justify-self: center;">
|
||||
<a href="{{ post.url }}">
|
||||
<div class="relative" style="max-width: 365px;">
|
||||
{% if post.custom_thumbnail_name == null %}
|
||||
<img src="{{ site.img_url }}thumbnails/blog/placeholder.png">
|
||||
{% else %}
|
||||
<img src="{{ site.img_url }}thumbnails/blog/{{ post.custom_thumbnail_name }}.png">
|
||||
{% endif %}
|
||||
{% if post.progress_update == true %}
|
||||
<span class="absolute text-white right-0 bottom-0 pr-3 pb-3" style="font-size: 3.1rem; font-weight: 800;">#{{ post.title | slice: 2, 2 }}</span>
|
||||
{% endif %}
|
||||
{% if post.portmaster_update == true %}
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
|
||||
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-3 py-3 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
|
||||
<svg class="h-8 w-auto lg:h-7" style="padding: 0.3rem;" xmlns="http://www.w3.org/2000/svg" data-name="Layer 2" viewBox="0 0 10.82 10.94">
|
||||
<path fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.4" d="M1.41 7.98a5 5 0 0 0 .65.83 4.7 4.7 0 0 0 8-2.67M.75 4.8a4.68 4.68 0 0 1 1.32-2.67 4.73 4.73 0 0 1 6.68 0 4.56 4.56 0 0 1 .65.83" />
|
||||
<path fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.4" d="M1.23 9.65V7.98H2.9M9.59 1.29v1.67H7.92" />
|
||||
</svg>
|
||||
</button>
|
||||
<a class="card-blog" href="{{ post.url }}">
|
||||
<div class="card-blog-thumbnail">
|
||||
{% if post.custom_thumbnail_name == null %}
|
||||
<img
|
||||
src="{{ site.img_url }}thumbnails/blog/placeholder.png"
|
||||
style="max-width: 365px; max-height: 223px;"
|
||||
>
|
||||
{% else %}
|
||||
<img
|
||||
src="{{ site.img_url }}thumbnails/blog/{{ post.custom_thumbnail_name }}.png"
|
||||
style="max-width: 365px; max-height: 223px;"
|
||||
>
|
||||
{% endif %}
|
||||
{% if post.progress_update == true %}
|
||||
<span class="counter">#{{ post.title | slice: 2, 2 }}</span>
|
||||
{% endif %}
|
||||
{% if post.portmaster_update == true %}
|
||||
<span class="box-icon">
|
||||
<i class="icon-reload text-xl"></i>
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="pt-6">
|
||||
<div class="flex w-full relative">
|
||||
<span class="opacity-25">
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-blog-content" style="max-width: 365px;">
|
||||
<div class="content-wrapper">
|
||||
<span class="w-full">
|
||||
{% if include.pre_header %}
|
||||
{{ include.pre_header }} -
|
||||
{% endif %}
|
||||
{{ post.date | date: "%-d. %b %Y" }}
|
||||
</span>
|
||||
<div class="flex-shrink-0 right-0 absolute right-0">
|
||||
<div class="flex ">
|
||||
<span class="transform hover:scale-110 duration-150 ease-in-out" tooltip="{{ post.author | capitalize }}">
|
||||
<img class="inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-transparent" src="{{ site.img_url }}profiles/{{ post.author | downcase }}.png" alt="{{ post.author | capitalize }}">
|
||||
</span>
|
||||
</div>
|
||||
<div class="circular-profile" tooltip="{{ post.author | capitalize }}">
|
||||
<img src="{{ site.img_url }}profiles/{{ post.author | downcase }}.png" alt="{{ post.author | capitalize }}">
|
||||
</div>
|
||||
</div>
|
||||
{% if post.progress_update == true %}
|
||||
{% assign title_length = post.title | size %}
|
||||
<p>{{ post.title | slice: 7, title_length }} - #{{ post.title | slice: 2, 2 }}</p>
|
||||
{% else %}
|
||||
<p>{{ post.title }}</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</a>
|
||||
{% if post.progress_update == true %}
|
||||
{% assign title_length = post.title | size %}
|
||||
<span>{{ post.title | slice: 7, title_length }} - #{{ post.title | slice: 2, 2 }}</span>
|
||||
{% else %}
|
||||
<span>{{ post.title }}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</li>
|
||||
</a>
|
|
@ -1,44 +1,34 @@
|
|||
<li class="mt-10 md:mt-0">
|
||||
<div class="block transform hover:scale-95 duration-150 ease-in-out">
|
||||
<a href="{{ episode.url }}">
|
||||
<div class="relative" style="max-width: 365px;">
|
||||
{% if episode.custom_thumbnail_name == null %}
|
||||
<img src="{{ site.img_url }}thumbnails/podcast/placeholder.png">
|
||||
{% else %}
|
||||
<img src="{{ site.img_url }}thumbnails/podcast/{{ episode.custom_thumbnail_name }}.jpg">
|
||||
{% endif %}
|
||||
<span class="absolute text-white right-0 bottom-0 pr-3 pb-3" style="font-size: 3.1rem; font-weight: 800;" >#{{ episode.title | slice: 2, 2 }}</span>
|
||||
</div>
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
|
||||
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-3 py-3 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
|
||||
<svg class="h-8 w-auto lg:h-7" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<g fill="none">
|
||||
<path d="M0 0h24v24H0z"/>
|
||||
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M12 15v0c-1.657 0-3-1.343-3-3V6c0-1.657 1.343-3 3-3v0c1.657 0 3 1.343 3 3v6c0 1.657-1.343 3-3 3z"/>
|
||||
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M18 10v2c0 3.314-2.686 6-6 6v0c-3.314 0-6-2.686-6-6v-2M12 18v3M7.82 21h8.36"/>
|
||||
</g>
|
||||
</svg>
|
||||
</button>
|
||||
<a class="card-blog" href="{{ episode.url }}">
|
||||
<div class="card-blog-thumbnail">
|
||||
{% if episode.custom_thumbnail_name == null %}
|
||||
<img
|
||||
src="{{ site.img_url }}thumbnails/podcast/placeholder.png"
|
||||
style="max-width: 365px; max-height: 223px;"
|
||||
>
|
||||
{% else %}
|
||||
<img
|
||||
src="{{ site.img_url }}thumbnails/podcast/{{ episode.custom_thumbnail_name }}.jpg"
|
||||
style="max-width: 365px; max-height: 223px;"
|
||||
>
|
||||
{% endif %}
|
||||
<span class="counter">#{{ episode.title | slice: 2, 2 }}</span>
|
||||
<span class="box-icon">
|
||||
<i class="icon-mic text-xl"></i>
|
||||
</span>
|
||||
<div class="pt-6">
|
||||
<div class="flex w-full relative">
|
||||
<span class="opacity-25">
|
||||
</div>
|
||||
<div class="card-blog-content" style="max-width: 365px;">
|
||||
<div class="content-wrapper">
|
||||
<span class="w-full">
|
||||
{% if include.pre_header %}
|
||||
{{ include.pre_header }} -
|
||||
{% endif %}
|
||||
{{ episode.date | date: "%-d. %b %Y" }}
|
||||
</span>
|
||||
<div class="flex-shrink-0 right-0 absolute right-0">
|
||||
<div class="flex ">
|
||||
<span class="transform hover:scale-110 duration-150 ease-in-out" tooltip="{{ post.author | capitalize }}">
|
||||
<img class="inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-transparent" src="{{ site.img_url }}profiles/{{ post.author | downcase }}.png" alt="{{ post.author | capitalize }}">
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign title_length = episode.title | size %}
|
||||
<p>{{ episode.title | slice: 7, title_length }} - #{{ episode.title | slice: 2, 2 }}</p>
|
||||
</span>
|
||||
<div class="circular-profile" tooltip="{{ post.author | capitalize }}">
|
||||
<img src="{{ site.img_url }}profiles/{{ post.author | downcase }}.png" alt="{{ post.author | capitalize }}">
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{% assign title_length = episode.title | size %}
|
||||
<span>{{ episode.title | slice: 7, title_length }} - #{{ episode.title | slice: 2, 2 }}</span>
|
||||
</div>
|
||||
</li>
|
||||
</a>
|
||||
|
|
|
@ -1,31 +1,38 @@
|
|||
<li class="mt-10 md:mt-0">
|
||||
<div class="block transform hover:scale-95 duration-150 ease-in-out">
|
||||
<a href="{{ video.url }}">
|
||||
<a class="card-blog" href="{{ video.url }}">
|
||||
<div class="card-blog-thumbnail">
|
||||
{% if video.custom_thumbnail_name == null %}.
|
||||
<img src="{{ site.img_url }}thumbnails/video/placeholder.png" alt="">
|
||||
<img
|
||||
src="{{ site.img_url }}thumbnails/video/placeholder.png"
|
||||
style="max-width: 365px; max-height: 223px;"
|
||||
>
|
||||
|
||||
{% else %}
|
||||
<img src="{{ site.img_url }}thumbnails/video/{{ video.custom_thumbnail_name }}.png" alt="">
|
||||
<img
|
||||
src="{{ site.img_url }}thumbnails/video/{{ video.custom_thumbnail_name }}.png"
|
||||
style="max-width: 365px; max-height: 223px;"
|
||||
>
|
||||
{% endif %}
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
|
||||
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-4 py-4 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
|
||||
<svg class="h-8 w-auto lg:h-5 fill-current text-white" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 9.41 11">
|
||||
<path d="M8.43 4.62l-6.34-4A1 1 0 00.5 1.5v8a1 1 0 001.59.88l6.34-4a1 1 0 000-1.76z" stroke-miterlimit="10" /></svg>
|
||||
</button>
|
||||
<span class="box-icon">
|
||||
<i class="icon-play text-xl"></i>
|
||||
</span>
|
||||
<div class="pt-6">
|
||||
<span class="opacity-25">
|
||||
{% if include.pre_header %}
|
||||
{{ include.pre_header }} -
|
||||
{% endif %}
|
||||
{{ video.date | date: "%-d. %b %Y" }}
|
||||
</span>
|
||||
{% if video.progress_update %}
|
||||
{% assign title_length = video.title | size %}
|
||||
<p>{{ video.title | slice: 7, title_length }} - #{{ video.title | slice: 2, 2 }}</p>
|
||||
{% else %}
|
||||
<p>{{ video.title }}</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<div class="card-blog-content" style="max-width: 365px;">
|
||||
<div class="content-wrapper">
|
||||
<span class="w-full">
|
||||
{% if include.pre_header %}
|
||||
{{ include.pre_header }} -
|
||||
{% endif %}
|
||||
{{ video.date | date: "%-d. %b %Y" }}
|
||||
</span>
|
||||
<div class="circular-profile" tooltip="{{ post.author | capitalize }}">
|
||||
<img src="{{ site.img_url }}profiles/{{ post.author | downcase }}.png" alt="{{ post.author | capitalize }}">
|
||||
</div>
|
||||
</div>
|
||||
{% if video.progress_update %}
|
||||
{% assign title_length = video.title | size %}
|
||||
<span>{{ video.title | slice: 7, title_length }} - #{{ video.title | slice: 2, 2 }}</span>
|
||||
{% else %}
|
||||
<span>{{ video.title }}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</a>
|
|
@ -1,43 +1,27 @@
|
|||
---
|
||||
layout: page_container
|
||||
layout: publication_container
|
||||
---
|
||||
|
||||
<div class="text-center">
|
||||
<h1 >{{ page.title }}</h1>
|
||||
<div class="header-four-container">
|
||||
<h1 class="header-four-container-title">{{ page.title }}</h1>
|
||||
{% if page.summary %}
|
||||
<p class="text-left max-w-2xl mx-auto" >
|
||||
<p class="header-four-container-desc">
|
||||
{{ page.summary | markdownify | remove: "<p>" | remove: "</p>" }}
|
||||
</p>
|
||||
{% endif %}
|
||||
<p>{{ page.date | date: "%B %-d, %Y" }} • Written by <a href="{{ site.team_url }}#{{ page.author | slugify }}">{{ page.author | capitalize }}</a></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>
|
||||
<span class="header-four-container-title-author">
|
||||
{{ page.date | date: "%B %-d, %Y" }} • Written by <a class="link-primary" href="{{ site.team_url }}#{{ page.author | slugify }}">{{ page.author | capitalize }}</a>
|
||||
</span>
|
||||
<div class="header-four-container-social">
|
||||
<a class="link hover-opacity-in" href="{{ site.twitter_url }}"><i class="icon-twitter text-lg"></i></a>
|
||||
<a class="link hover-opacity-in" href="{{ site.github_url }}"><i class="icon-github text-xl"></i></a>
|
||||
<a class="link hover-opacity-in" href="{{ site.reddit_url }}"><i class="icon-reddit text-xl"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if page.progress_update %}
|
||||
<div class="progress-update">
|
||||
{% else %}
|
||||
<div class="content" id="blog">
|
||||
{% endif %}
|
||||
<div class="markdown-container">
|
||||
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
|
||||
{% if page.progress_update == null %}
|
||||
<p>{{ page.date | date: "%B %-d, %Y" }} • Written by <a href="{{ site.team_url }}#{{ page.author | slugify }}">{{ page.author | capitalize }}</a></p>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
{% if page.portmaster_plug == true %}
|
||||
{% include portmaster_plug.html %}
|
||||
{% endif %}
|
||||
|
||||
{% include next_previous_item.html %}
|
||||
</div>
|
14
_layouts/exception_container.html
Normal file
14
_layouts/exception_container.html
Normal file
|
@ -0,0 +1,14 @@
|
|||
---
|
||||
layout: page
|
||||
---
|
||||
|
||||
<section class="publication-layout">
|
||||
<div class="markdown-container max-w-5xl">
|
||||
{% unless page.heading == null %}
|
||||
<h1 class="font-extrabold">
|
||||
{{ page.heading }}
|
||||
</h1>
|
||||
{% endunless %}
|
||||
{{ content }}
|
||||
</div>
|
||||
</section>
|
14
_layouts/legal_container.html
Normal file
14
_layouts/legal_container.html
Normal file
|
@ -0,0 +1,14 @@
|
|||
---
|
||||
layout: page
|
||||
---
|
||||
|
||||
<section class="publication-layout">
|
||||
<div class="markdown-container max-w-5xl">
|
||||
{% unless page.heading == null %}
|
||||
<h1 class="font-extrabold">
|
||||
{{ page.heading }}
|
||||
</h1>
|
||||
{% endunless %}
|
||||
{{ content }}
|
||||
</div>
|
||||
</section>
|
|
@ -1,25 +0,0 @@
|
|||
---
|
||||
layout: page
|
||||
---
|
||||
|
||||
<section id="page-container" class="pb-8 lg:pb-24 pt-16 lg:pt-40 {{ layout.container_class }} {{ page.container_class }}">
|
||||
<div class="items-center h-full">
|
||||
<div class="container mx-auto sm: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-2 sm:px-6 lg:px-8">
|
||||
<content>
|
||||
{% unless page.heading == null %}
|
||||
<h1 class="text-5xl tracking-tight font-extrabold leading-none">
|
||||
{{ page.heading }}
|
||||
</h1>
|
||||
{% endunless %}
|
||||
|
||||
{{ content }}
|
||||
</content>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
|
@ -1,28 +1,21 @@
|
|||
---
|
||||
layout: page_container
|
||||
container_class: "podcast pt-40 lg:pt-40"
|
||||
layout: publication_container
|
||||
---
|
||||
|
||||
<div class="text-center">
|
||||
<div class="header-four-container">
|
||||
{% 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>
|
||||
<h1 style="padding-top: 1.5em;">{{ page.title | slice: 7, title_length }}</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>
|
||||
<span class="header-four-container-counter">#{{ page.title | slice: 2, 2 }}</span>
|
||||
<h1 class="header-four-container-title">{{ page.title | slice: 7, title_length }}</h1>
|
||||
<p class="header-four-container-desc">{{ page.date | date: "%B %-d, %Y" }}</p>
|
||||
<div class="header-four-container-social">
|
||||
<a class="link hover-opacity-in" href="{{ site.twitter_url }}"><i class="icon-twitter text-lg"></i></a>
|
||||
<a class="link hover-opacity-in" href="{{ site.github_url }}"><i class="icon-github text-xl"></i></a>
|
||||
<a class="link hover-opacity-in" href="{{ site.reddit_url }}"><i class="icon-reddit text-xl"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
|
||||
<div class="markdown-container">
|
||||
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
|
||||
<h3>Description</h3>
|
||||
{{ page.summary }}
|
||||
|
||||
{% include next_previous_item.html %}
|
||||
</div>
|
15
_layouts/publication_container.html
Normal file
15
_layouts/publication_container.html
Normal file
|
@ -0,0 +1,15 @@
|
|||
---
|
||||
layout: page
|
||||
---
|
||||
|
||||
<section class="publication-layout">
|
||||
{{ content }}
|
||||
|
||||
<div class="horizontal-line element-x-center max-w-4xl mt-0"></div>
|
||||
|
||||
{% if page.portmaster_plug == true %}
|
||||
{% include portmaster_plug.html %}
|
||||
{% endif %}
|
||||
|
||||
{% include next_previous_item.html %}
|
||||
</section>
|
|
@ -1,31 +1,30 @@
|
|||
---
|
||||
layout: page_container
|
||||
container_class: "podcast pt-40 lg:pt-64"
|
||||
layout: publication_container
|
||||
---
|
||||
|
||||
<div class="text-center">
|
||||
<div class="header-four-container">
|
||||
{% if page.progress_update %}
|
||||
{% 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>
|
||||
<h1 style="padding-top: 1.5em;">{{ page.title | slice: 7, title_length }}</h1>
|
||||
<span class="header-four-container-counter">#{{ page.title | slice: 2, 2 }}</span>
|
||||
<h1 class="header-four-container-title">{{ page.title | slice: 7, title_length }}</h1>
|
||||
{% else %}
|
||||
<h1>{{ page.title }}</h1>
|
||||
<h1 class="header-four-container-title">{{ page.title }}</h1>
|
||||
{% endif %}
|
||||
<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>
|
||||
{% if page.summary %}
|
||||
<p class="header-four-container-desc">
|
||||
{{ page.summary | markdownify | remove: "<p>" | remove: "</p>" }}
|
||||
</p>
|
||||
{% endif %}
|
||||
<span class="header-four-container-title-author">
|
||||
{{ page.date | date: "%B %-d, %Y" }}
|
||||
</span>
|
||||
<div class="header-four-container-social">
|
||||
<a class="link hover-opacity-in" href="{{ site.twitter_url }}"><i class="icon-twitter text-lg"></i></a>
|
||||
<a class="link hover-opacity-in" href="{{ site.github_url }}"><i class="icon-github text-xl"></i></a>
|
||||
<a class="link hover-opacity-in" href="{{ site.reddit_url }}"><i class="icon-reddit text-xl"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
{{ content }}
|
||||
</div>
|
||||
|
||||
{% include next_previous_item.html %}
|
||||
<div class="markdown-container">
|
||||
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
|
||||
</div>
|
||||
|
|
|
@ -33,12 +33,10 @@ It was fun getting to dive into this area from an employers perspective. So far
|
|||
|
||||
### Then Luke Appeared on the Scene
|
||||
|
||||
<div class="notification-podcast">
|
||||
<img src="{{ site.img_url }}icons/mic.svg">
|
||||
<a href="/podcast/2019/11/29/hiring-a-designer-from-the-privacy-community/">
|
||||
<p>
|
||||
Listen to the accompanying podcast where Luke talks about his side of the story
|
||||
</p>
|
||||
<div class="alert-primary">
|
||||
<i class="icon-mic text-lg"></i>
|
||||
<a class="underline hover-opacity-in" href="/podcast/2019/11/29/hiring-a-designer-from-the-privacy-community/">
|
||||
Listen to the accompanying podcast where Luke talks about his side of the story
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -268,47 +268,4 @@ cards:
|
|||
discarded:
|
||||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -254,47 +254,4 @@ cards:
|
|||
discarded:
|
||||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -214,61 +214,4 @@ cards:
|
|||
discarded:
|
||||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -165,60 +165,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -166,60 +166,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -131,60 +131,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -193,60 +193,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -156,60 +156,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -182,60 +182,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
||||
|
|
|
@ -34,12 +34,10 @@ And before we move on, let me be clear: all of these costs do not have to be cov
|
|||
|
||||
## How To Evaluate A Healthy Privacy Company
|
||||
|
||||
<div class="notification-podcast">
|
||||
<img src="{{ site.img_url }}icons/mic.svg">
|
||||
<a href="/podcast/2021/05/06/how-weak-business-models-corrupt-privacy-projects/">
|
||||
<p>
|
||||
Enjoy Podcasts? Privacy YouTuber "TheHatedOne" and I got together to discuss this topic in-depth.
|
||||
</p>
|
||||
<div class="alert-primary">
|
||||
<i class="icon-mic text-lg"></i>
|
||||
<a class="underline hover-opacity-in" href="/podcast/2021/05/06/how-weak-business-models-corrupt-privacy-projects">
|
||||
Enjoy Podcasts? Privacy YouTuber "TheHatedOne" and I got together to discuss this topic in-depth.
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
@ -189,12 +187,10 @@ Transparency is key, and here Signal sadly is not open about their current state
|
|||
|
||||
Earlier this year, Signal announced plans to implement cryptocurrency payments into its messenger via MobileCoin. This stirred a lot of worry and uncertainty within the community.
|
||||
|
||||
<div class="notification-podcast">
|
||||
<img src="{{ site.img_url }}icons/mic.svg">
|
||||
<a href="/podcast/2021/05/06/how-weak-business-models-corrupt-privacy-projects/">
|
||||
<p>
|
||||
Privacy YouTuber "TheHatedOne" and I talk extensively about the MobileCoin situation. Tune into that episode for more details
|
||||
</p>
|
||||
<div class="alert-primary">
|
||||
<i class="icon-mic text-lg"></i>
|
||||
<a class="underline hover-opacity-in" href="/podcast/2021/05/06/how-weak-business-models-corrupt-privacy-projects">
|
||||
Privacy YouTuber "TheHatedOne" and I talk extensively about the MobileCoin situation. Tune into that episode for more details
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -145,60 +145,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -169,60 +169,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -127,60 +127,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -106,60 +106,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -126,60 +126,4 @@ cards:
|
|||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -174,61 +174,4 @@ cards:
|
|||
discarded:
|
||||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -202,61 +202,4 @@ cards:
|
|||
discarded:
|
||||
---
|
||||
|
||||
|
||||
<div>
|
||||
{% if page.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>A list of work packages we've fully wrapped up this month. Expand any to find out more about its conclusion.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>Expand any work package to find out more about its progress, obstacles and sub-achievements.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>Work packages we for one reason or the other decided to discard. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if page.cards.postponed.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Postponed</h3>
|
||||
<p>Work packages we for one reason or the other decided to postpone. Click on a package to find out the exact reasons why.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in page.cards.postponed %}
|
||||
{% include project_tablecard.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include progress-update-tablecards.html %}
|
|
@ -12,90 +12,103 @@ summary: Both Portmaster and Pi-hole are free and open source privacy tools. The
|
|||
|
||||
## Overview Chart
|
||||
|
||||
<div class="table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col>
|
||||
<col class="highlight">
|
||||
<col>
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Portmaster</th>
|
||||
<th>Pi-hole</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Open Source</td>
|
||||
<td class="link">
|
||||
<a href="{{ site.github_url }}/portmaster" class="exclude-external-icon">
|
||||
<div>
|
||||
<img src="{{ site.img_url }}icons/tick.svg">
|
||||
</div>
|
||||
<img src="{{ site.img_url }}icons/external-black.svg">
|
||||
</a>
|
||||
</td>
|
||||
<td class="link">
|
||||
<a href="https://github.com/pi-hole/pi-hole/" class="exclude-external-icon">
|
||||
<div>
|
||||
<img src="{{ site.img_url }}icons/tick.svg">
|
||||
</div>
|
||||
<img src="{{ site.img_url }}icons/external-black.svg">
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Setup</td>
|
||||
<td><strong>Easy</strong></td>
|
||||
<td><strong>Advanced</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Protection Type</td>
|
||||
<td><strong>Device</strong></td>
|
||||
<td><strong>Network</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Availabilty</td>
|
||||
<td class="link">
|
||||
<a href="{{ site.portmaster_url }}#downloads">
|
||||
<div>
|
||||
<img src="{{ site.img_url }}icons/windows.svg">
|
||||
<img src="{{ site.img_url }}icons/linux.svg">
|
||||
</div>
|
||||
<img src="{{ site.img_url }}icons/external-black.svg">
|
||||
</a>
|
||||
</td>
|
||||
<td class="link">
|
||||
<a href="https://docs.pi-hole.net/main/prerequisites/#supported-operating-systems" class="exclude-external-icon">
|
||||
<div>
|
||||
<img src="{{ site.img_url }}icons/linux.svg">
|
||||
<img src="{{ site.img_url }}icons/docker.svg">
|
||||
</div>
|
||||
<img src="{{ site.img_url }}icons/external-black.svg">
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Secure DNS</td>
|
||||
<td><img src="{{ site.img_url }}icons/tick.svg"></td>
|
||||
<td><img src="{{ site.img_url }}icons/tick.svg"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Individual Apps Settings</td>
|
||||
<td><img src="{{ site.img_url }}icons/tick.svg"></td>
|
||||
<td><img src="{{ site.img_url }}icons/cross.svg"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Adaptive Threat Model</td>
|
||||
<td><img src="{{ site.img_url }}icons/tick.svg"></td>
|
||||
<td><img src="{{ site.img_url }}icons/cross.svg"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="card-table">
|
||||
<table>
|
||||
<colgroup class="card-table-colgroup">
|
||||
<col class="card-table-colgroup-col">
|
||||
<col class="card-table-colgroup-col-highlight">
|
||||
<col class="card-table-colgroup-col">
|
||||
</colgroup>
|
||||
<thead class="card-table-header">
|
||||
<tr class="card-table-header-row">
|
||||
<th class="card-table-header-row-cell"></th>
|
||||
<th class="card-table-header-row-cell">Portmaster</th>
|
||||
<th class="card-table-header-row-cell">Pi-hole</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="card-table-body">
|
||||
<tr class="card-table-body-row">
|
||||
<td class="card-table-body-row-cell-title">Open Source</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<a class="card-table-body-row-cell-link" href="{{ site.github_url }}/portmaster">
|
||||
<i class="icon-tick text-2xl text-green-500"></i>
|
||||
</a>
|
||||
</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<a class="card-table-body-row-cell-link" href="https://github.com/pi-hole/pi-hole/">
|
||||
<i class="icon-tick text-2xl text-green-500"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="card-table-body-row">
|
||||
<td class="card-table-body-row-cell-title">Setup</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
Easy
|
||||
</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
Advanced
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="card-table-body-row">
|
||||
<td class="card-table-body-row-cell-title">Protection Type</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
Device
|
||||
</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
Network
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="card-table-body-row">
|
||||
<td class="card-table-body-row-cell-title">Availabilty</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<a class="card-table-body-row-cell-link" href="{{ site.portmaster_url }}#downloads">
|
||||
<div class="md:space-x-2">
|
||||
<i class="icon-windows text-2xl text-safing-blue-500"></i>
|
||||
<i class="icon-linux text-2xl"></i>
|
||||
</div>
|
||||
</a>
|
||||
</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<a class="card-table-body-row-cell-link" href="https://docs.pi-hole.net/main/prerequisites/#supported-operating-systems">
|
||||
<div class="md:space-x-2">
|
||||
<i class="icon-linux text-2xl"></i>
|
||||
<i class="icon-docker text-3xl text-safing-blue-500"></i>
|
||||
</div>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="card-table-body-row">
|
||||
<td class="card-table-body-row-cell-title">Secure DNS</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<i class="icon-tick text-2xl text-green-500"></i>
|
||||
</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<i class="icon-tick text-2xl text-green-500"></i>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="card-table-body-row">
|
||||
<td class="card-table-body-row-cell-title">Individual Apps Settings</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<i class="icon-tick text-2xl text-green-500"></i>
|
||||
</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<i class="icon-cross text-2xl text-red-500"></i>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="card-table-body-row">
|
||||
<td class="card-table-body-row-cell-title">Adaptive Threat Model</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<i class="icon-tick text-2xl text-green-500"></i>
|
||||
</td>
|
||||
<td class="card-table-body-row-cell">
|
||||
<i class="icon-cross text-2xl text-red-500"></i>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
## Detailed Comparison
|
||||
|
||||
### One Shoe Does Not Fit All - What Is Your Threat Model?
|
||||
|
|
|
@ -1,523 +0,0 @@
|
|||
* {
|
||||
font-family: "Roboto";
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.not-allowed {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.spn-shadow {
|
||||
box-shadow: 0 0px 90px 0 rgba(59, 93, 199, 0.1), 0 0px 5px 0 rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.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)
|
||||
}
|
||||
}
|
||||
|
||||
@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)
|
||||
}
|
||||
}
|
||||
|
||||
.spin {
|
||||
animation-name: spin;
|
||||
animation-duration: 21000ms;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.heart {
|
||||
// animation: .8s infinite beatHeart;
|
||||
}
|
||||
|
||||
@keyframes beatHeart {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
25% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
40% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
#menu-toggle:checked+#menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.wiggle {
|
||||
animation: wiggle .6s infinite alternate;
|
||||
}
|
||||
|
||||
@keyframes wiggle {
|
||||
0% {
|
||||
transform: rotate(4deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(10deg);
|
||||
}
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.support p{
|
||||
color: #7d7d7d;
|
||||
}
|
||||
|
||||
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);
|
||||
}
|
||||
}
|
||||
|
||||
.opacity-55 {
|
||||
opacity: 0.55;
|
||||
}
|
||||
|
||||
.hover\:opacity-55:hover {
|
||||
opacity: 0.55;
|
||||
}
|
||||
|
||||
.card{
|
||||
max-width: auto;
|
||||
}
|
||||
|
||||
.tablecard{
|
||||
max-width: auto;
|
||||
|
||||
h3{
|
||||
padding-top: 2.5rem !important;
|
||||
}
|
||||
|
||||
ul, ol{
|
||||
padding: 1rem;
|
||||
|
||||
li{
|
||||
padding-top: 0.7rem;
|
||||
color: #898989;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-type: circle;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
|
||||
a{
|
||||
display: inline-table;
|
||||
position: none;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.cardshadow{
|
||||
box-shadow: 0 0px 5px 0 rgba(0, 0, 0, 0), 0 0px 90px 0 rgba(59, 93, 199, 0.1);
|
||||
}
|
||||
|
||||
.blogwrapper{
|
||||
display: grid;
|
||||
grid-template-columns: repeat(1, auto);
|
||||
grid-template-rows: auto;
|
||||
grid-row-gap: 15px;
|
||||
grid-auto-flow: row;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1350px;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.blogwrapper{
|
||||
grid-template-columns: repeat(1, auto);
|
||||
}
|
||||
|
||||
#icon{
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.nextwrapper{
|
||||
display: grid;
|
||||
grid-template-columns: repeat(1, auto);
|
||||
grid-template-rows: auto;
|
||||
grid-row-gap: 1rem;
|
||||
grid-column-gap: 1rem;
|
||||
grid-auto-flow: row;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1350px;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.nextwrapper{
|
||||
grid-template-columns: repeat(1, auto);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.nextwrapper{
|
||||
grid-template-columns: repeat(3, minmax(auto, 445px));
|
||||
.card{
|
||||
max-width: 445px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropinput {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
border-radius: 8px;
|
||||
overflow: visible;
|
||||
|
||||
}
|
||||
.tab {
|
||||
width: 100%;
|
||||
color: black;
|
||||
overflow: hidden;
|
||||
&-label {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 1em;
|
||||
background: transparent;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: transparent;
|
||||
}
|
||||
&::after {
|
||||
content: " ";
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
text-align: center;
|
||||
transition: all .0s;
|
||||
transition-timing-function: ease;
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
}
|
||||
&-content {
|
||||
max-height: 0;
|
||||
padding: 0 1em;
|
||||
color: black;
|
||||
background: transparent;
|
||||
transition: all .3s;
|
||||
transition-timing-function: ease-in-out;
|
||||
|
||||
}
|
||||
&-close {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 1em;
|
||||
font-size: 0.75em;
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#icon {
|
||||
width: 35px;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
#icontwo {
|
||||
width: 35px;
|
||||
}
|
||||
|
||||
input:checked {
|
||||
|
||||
+ label #icon {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
+ label #icontwo {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
~ .tab-content {
|
||||
max-height: 100%;
|
||||
padding: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.dot {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
height: 5px;
|
||||
width: 5px;
|
||||
background-color: #6188ff;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
[tooltip] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
[tooltip]::before,
|
||||
[tooltip]::after {
|
||||
text-transform: none;
|
||||
font-size: .9em;
|
||||
line-height: 1;
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
display: none;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
[tooltip]::before {
|
||||
content: '';
|
||||
border: 5px solid transparent;
|
||||
z-index: 1001;
|
||||
}
|
||||
|
||||
[tooltip]::after {
|
||||
content: attr(tooltip);
|
||||
font-family: Helvetica, sans-serif;
|
||||
text-align: center;
|
||||
min-width: 3em;
|
||||
max-width: 21em;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
padding: 1ch 2ch;
|
||||
border-radius: 100px;
|
||||
box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
|
||||
background: #333;
|
||||
color: #fff;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
[tooltip]:hover::before,
|
||||
[tooltip]:hover::after {
|
||||
display: block;
|
||||
}
|
||||
|
||||
[tooltip='']::before,
|
||||
[tooltip='']::after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
[tooltip]:not([flow])::before,
|
||||
[tooltip][flow^="up"]::before {
|
||||
bottom: 100%;
|
||||
border-bottom-width: 0;
|
||||
border-top-color: #333;
|
||||
}
|
||||
|
||||
[tooltip]:not([flow])::after,
|
||||
[tooltip][flow^="up"]::after {
|
||||
bottom: calc(100% + 5px);
|
||||
}
|
||||
|
||||
[tooltip]:not([flow])::before,
|
||||
[tooltip]:not([flow])::after,
|
||||
[tooltip][flow^="up"]::before,
|
||||
[tooltip][flow^="up"]::after {
|
||||
left: 50%;
|
||||
transform: translate(-50%, -.5em);
|
||||
}
|
||||
|
||||
@keyframes tooltips-vert {
|
||||
to {
|
||||
opacity: .9;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
}
|
||||
|
||||
[tooltip]:not([flow]):hover::before,
|
||||
[tooltip]:not([flow]):hover::after,
|
||||
[tooltip][flow^="up"]:hover::before,
|
||||
[tooltip][flow^="up"]:hover::after {
|
||||
animation: tooltips-vert 300ms ease-out forwards;
|
||||
}
|
||||
|
||||
.notification {
|
||||
position: relative;
|
||||
opacity: 0;
|
||||
animation: notification 0.5s forwards ease-in;
|
||||
animation-delay: 0.1s;
|
||||
}
|
||||
|
||||
@keyframes notification {
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
// This is a hacky way to solve this problem.
|
||||
// I could not find away in tailwind to set a max of cols and to allow
|
||||
// each tag to have their own width.
|
||||
|
||||
.tag-grid{
|
||||
grid-template-columns: repeat(3, minmax(max-content, 1fr))
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.tag-grid{
|
||||
grid-template-columns: repeat(4, minmax(max-content, 1fr))
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.tag-grid{
|
||||
grid-template-columns: repeat(7, minmax(max-content, 1fr))
|
||||
}
|
||||
}
|
||||
|
||||
#blog.content {
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
|
||||
#portmaster-plug:hover button {
|
||||
--transform-scale-x: 1.04;
|
||||
--transform-scale-y: 1.04;
|
||||
}
|
||||
|
||||
/*
|
||||
Grabs External Links only:
|
||||
|
||||
1. make sure it is NOT an internal link like: href="/guides/" by filtering it starts with http
|
||||
2. exclude all links that contain "safing.io" which is super unlikely to hit external links
|
||||
3. also exclude "localhost", which basically is 2. for local development
|
||||
4. exclude social icons on top of content, which is currently grabbed with :not opacity-55, kinda dirty
|
||||
*/
|
||||
#page-container content a[href^="http"]:not([href*="safing.io"]):not([href*="localhost"]):not([class*="opacity-55"]):not([class="exclude-external-icon"]):after {
|
||||
background-image : url("/assets/img/icons/external.svg");
|
||||
display : inline-block;
|
||||
height : 10px;
|
||||
width : 17px;
|
||||
content : "";
|
||||
background-repeat : no-repeat;
|
||||
background-position-y: 0px;
|
||||
background-position-x: 4px;
|
||||
background-size : 10px;
|
||||
}
|
||||
|
||||
/*
|
||||
Grab Internal Setting links to add a cog
|
||||
|
||||
1., 2. from other docs pages, the href will include some form of /settings-reference(/)#
|
||||
*/
|
||||
#page-container content a[href*="portmaster/settings#"]:before,
|
||||
#page-container content a[href*="portmaster/settings/#"]:before {
|
||||
background-image : url("/assets/img/icons/cog.svg");
|
||||
display : inline-block;
|
||||
height : 20px;
|
||||
width : 20px;
|
||||
content : "";
|
||||
background-repeat : no-repeat;
|
||||
background-position-y: 5px;
|
||||
background-position-x: 1px;
|
||||
background-size : 17px;
|
||||
}
|
|
@ -1,402 +0,0 @@
|
|||
#page-container {
|
||||
&.imprint {
|
||||
h4 {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
p {
|
||||
padding: .5rem 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#page-container content .progress-update {
|
||||
h4 {
|
||||
font-size : 1.125rem;
|
||||
margin : 0;
|
||||
padding-left: .75rem;
|
||||
font-weight : 700;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin : 0;
|
||||
border-top-width: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
#page-container content {
|
||||
|
||||
p {
|
||||
margin-top: 1rem;
|
||||
color : #545454;
|
||||
}
|
||||
|
||||
strong {
|
||||
color: #353535;
|
||||
}
|
||||
|
||||
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;
|
||||
|
||||
strong {
|
||||
--text-opacity: 1;
|
||||
color : #667eea;
|
||||
color : rgba(102, 126, 234, var(--text-opacity))
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
a:hover {
|
||||
opacity : .5;
|
||||
transition-duration : 150ms;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size : 3rem;
|
||||
font-weight: 600;
|
||||
color : #000;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size : 1.8rem;
|
||||
margin-top : 2rem;
|
||||
font-weight : 500;
|
||||
color : #000;
|
||||
border-bottom : 1px solid #d7d7d7;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size : 1.4rem;
|
||||
margin-top : 2.5rem;
|
||||
font-weight: 500;
|
||||
color : #000;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size : 1.2rem;
|
||||
margin-top : 1.5rem;
|
||||
font-weight: 500;
|
||||
color : #000;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size : 1.1rem;
|
||||
margin-top : 1.5rem;
|
||||
font-weight: 500;
|
||||
color : #000;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size : 1rem;
|
||||
margin-top : 1.5rem;
|
||||
font-weight: 500;
|
||||
color : #000;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-top : 1.25rem;
|
||||
padding-left : 1.85rem;
|
||||
list-style-type: disc;
|
||||
color : #545454;
|
||||
|
||||
li {
|
||||
padding-left: .25rem;
|
||||
|
||||
li ul {
|
||||
padding-top : 0.05rem;
|
||||
padding-left : 1.25rem;
|
||||
list-style-type: disc;
|
||||
color : #545454;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table {
|
||||
width : fit-content;
|
||||
--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);
|
||||
max-width : 100%;
|
||||
height : auto;
|
||||
border-radius : .375rem;
|
||||
display : block;
|
||||
margin-bottom : 4rem;
|
||||
margin-top : 4rem;
|
||||
margin-left : auto;
|
||||
margin-right : auto;
|
||||
|
||||
padding-left : 2rem;
|
||||
padding-right: 2rem;
|
||||
|
||||
table {
|
||||
table-layout: auto;
|
||||
text-align : left;
|
||||
margin-left : 1.5rem;
|
||||
margin-right: 1.5rem;
|
||||
|
||||
colgroup>col {
|
||||
width: 220px;
|
||||
}
|
||||
|
||||
colgroup .highlight {
|
||||
background-color: #f7f9ff;
|
||||
}
|
||||
|
||||
thead {
|
||||
margin-top: 1.5rem;
|
||||
|
||||
tr {
|
||||
text-align : center;
|
||||
border-bottom: 2px solid rgba(0, 0, 0, 0.19);
|
||||
}
|
||||
|
||||
tr>th {
|
||||
padding-top : 1.4rem;
|
||||
padding-bottom: 1.4rem;
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
margin-bottom: 1.5rem;
|
||||
text-align : center;
|
||||
|
||||
tr {
|
||||
border-bottom: 2px solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
tr>td {
|
||||
height : 4.5rem;
|
||||
font-size: 0.9rem;
|
||||
|
||||
>* {
|
||||
margin-left : auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
img[src*="tick.svg"],
|
||||
img[src*="cross.svg"],
|
||||
img[src*="windows.svg"],
|
||||
img[src*="linux.svg"] {
|
||||
width: 1.4rem;
|
||||
}
|
||||
|
||||
img[src*="docker.svg"] {
|
||||
width: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
tr:last-child {
|
||||
border-bottom: 0px;
|
||||
}
|
||||
|
||||
tr td:first-child {
|
||||
text-align: left;
|
||||
opacity : 0.65;
|
||||
}
|
||||
|
||||
.link {
|
||||
position: relative;
|
||||
|
||||
a:hover {
|
||||
opacity: 1 !important;
|
||||
|
||||
img {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
display : flex;
|
||||
align-items: center;
|
||||
height : 100%;
|
||||
|
||||
div {
|
||||
width : fit-content;
|
||||
display : flex;
|
||||
margin-left : auto;
|
||||
margin-right: auto;
|
||||
|
||||
>* {
|
||||
margin: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
>img {
|
||||
position : absolute;
|
||||
right : 15px;
|
||||
width : 0.75rem;
|
||||
margin-right: auto;
|
||||
margin-top : -3px;
|
||||
opacity : 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
padding : 16px;
|
||||
overflow : auto;
|
||||
font-size : 10%;
|
||||
line-height : 1.45;
|
||||
background-color: #f7f7f7;
|
||||
border-radius : 3px;
|
||||
padding-top : 1rem;
|
||||
display : flex;
|
||||
margin-top : 1rem;
|
||||
|
||||
code {
|
||||
background-color: transparent;
|
||||
padding-left : 0;
|
||||
padding-right : 0;
|
||||
color : black;
|
||||
font-size : 0.8rem;
|
||||
font-weight : 500;
|
||||
max-width : 5rem;
|
||||
display : inline;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
margin-top : 3rem;
|
||||
margin-bottom : 3rem;
|
||||
border-top-width: 2px;
|
||||
}
|
||||
|
||||
code {
|
||||
color : #ba00bf;
|
||||
font-weight: 500;
|
||||
font-size : .875rem;
|
||||
word-break : break-word;
|
||||
|
||||
&::after {
|
||||
content: "`";
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: "`";
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
em {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
ol {
|
||||
padding-top : 0.1rem;
|
||||
list-style-type: decimal;
|
||||
padding-left : 1rem;
|
||||
color : #545454;
|
||||
|
||||
li {
|
||||
padding-top: 0.4rem
|
||||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
padding-left: 1rem;
|
||||
margin-top : 1.55rem;
|
||||
color : black;
|
||||
opacity : 1;
|
||||
border-left : 4px solid #ddd;
|
||||
}
|
||||
|
||||
.content {
|
||||
max-width : 750px;
|
||||
margin : auto;
|
||||
margin-top: 3rem;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.notification-podcast {
|
||||
font-size : .85rem;
|
||||
background-color: #5c85ff;
|
||||
width : fit-content;
|
||||
width : -moz-fit-content;
|
||||
overflow-wrap : break-word;
|
||||
padding-left : 1.25rem;
|
||||
padding : 1.25rem;
|
||||
margin-bottom : 1.25rem;
|
||||
margin-top : 1.25rem;
|
||||
display : flex;
|
||||
border-radius : .375rem;
|
||||
width : 100%;
|
||||
|
||||
p {
|
||||
color : #fff !important;
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
img {
|
||||
width : 1.5rem;
|
||||
margin-right: 1.25rem;
|
||||
height : 1.5rem;
|
||||
align-self : center;
|
||||
max-width : 100%;
|
||||
display : block;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
a {
|
||||
color : white !important;
|
||||
padding-left : .25rem;
|
||||
padding-right : .25rem;
|
||||
text-decoration: underline !important;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
opacity : .5;
|
||||
transition-duration : 150ms;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
}
|
||||
}
|
20
_sass/prebuilt/general-layout/default.scss
Normal file
20
_sass/prebuilt/general-layout/default.scss
Normal file
|
@ -0,0 +1,20 @@
|
|||
.general-layout {
|
||||
margin-top: 10rem;
|
||||
margin-bottom: 16rem;
|
||||
}
|
||||
|
||||
.general-layout > div:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.general-layout > div {
|
||||
margin-top: 15rem;
|
||||
}
|
||||
|
||||
.general-layout.spacing-sm > div {
|
||||
margin-top: 8rem;
|
||||
}
|
||||
|
||||
.general-layout.spacing-xl > div {
|
||||
margin-top: 24rem;
|
||||
}
|
11
_sass/prebuilt/publication-layout/default.scss
Normal file
11
_sass/prebuilt/publication-layout/default.scss
Normal file
|
@ -0,0 +1,11 @@
|
|||
.publication-layout {
|
||||
margin-top: 10rem;
|
||||
margin-bottom: 16rem;
|
||||
}
|
||||
|
||||
.publication-layout > div:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
.publication-layout > div {
|
||||
margin-top: 5rem;
|
||||
}
|
215
about/index.html
215
about/index.html
|
@ -6,154 +6,99 @@ redirect_from:
|
|||
- /community-hub/
|
||||
---
|
||||
|
||||
<section class="mt-20 lg:mt-40 mb-16 lg:mb-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 Freedom</span>, just like You
|
||||
<section class="general-layout">
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 1050px;">
|
||||
<img src="{{ site.img_url }}page-specific/about/team_overview.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
We <span class="text-safing-blue-500">love 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">
|
||||
<p class="showcase-right-desc">
|
||||
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.
|
||||
<br>
|
||||
<br>
|
||||
We still have a long way to go. We hope you'll join the journey.
|
||||
</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 class="col-container w-full text-left md:text-center lg:w-max lg:text-left">
|
||||
<a class="btn-secondary" href="{{ site.team_url }}">View team overview</a>
|
||||
<a class="btn-tertiary" href="#footer">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 my-48">
|
||||
<div class="flex 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:px-0 lg:flex">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-0">
|
||||
<div class="inline-block max-w-3xl text-center md:text-left">
|
||||
<h2 class="text-5xl w-1/1 tracking-tight font-extrabold leading-none py-10">Engage the problem at <span style="color: #6188ff;">The Core</span></h2>
|
||||
<p class="text-md opacity-55">
|
||||
The Internet is one of the most beautiful things there is. But every connection has the potential to betray you, leaking personal information you never wanted to share. That's where we intercept.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-10 self-center md:ml-0 lg:ml-16">
|
||||
<ul class="md:grid md:grid-cols-3 md:col-gap-10 md:row-gap-10 text-center md:text-left">
|
||||
<li class="pt-8 md:pt-0 transform transition hover:scale-105 duration-150 ease-in-out">
|
||||
<div class="flex items-center justify-center pl-2 md:pl-0 h-12 md:w-12 w-auto">
|
||||
<svg class="h-8 w-8" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<g fill="none">
|
||||
<path stroke="#446eed" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M20 11.182c0 4.541-3.413 8.787-8 9.818-4.587-1.031-8-5.277-8-9.818V7.615c0-.812.491-1.544 1.243-1.851l5-2.046c1.126-.461 2.388-.461 3.514 0l5 2.046C19.509 6.072 20 6.803 20 7.615v3.567z" />
|
||||
<path stroke="#446eed" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M15.25 10.125l-3.75 3.75-2.25-2.25" />
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="mt-4 ml-4">
|
||||
<h5 class="text-2xl leading-6 font-bold text-gray-900">Open Source</h5>
|
||||
<p class="mt-4 text-base leading-6 opacity-55 max-w-sm m-auto">
|
||||
Secure software can only emerge when many smart people review and contribute to the code base.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="pt-10 md:pt-0 transform transition hover:scale-105 duration-150 ease-in-out">
|
||||
<div class="flex items-center justify-center pl-2 md:pl-0 h-12 md:w-12 w-auto">
|
||||
<svg class="heart h-8 w-8" stroke="#446eed" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 5.711C12.689 4.905 13.881 4 15.696 4 18.871 4 21 6.98 21 9.755 21 15.556 13.778 20 12 20c-1.778 0-9-4.444-9-10.245C3 6.98 5.129 4 8.304 4c1.815 0 3.007.905 3.696 1.711z" stroke-linecap="round" stroke-width="1.8" fill="none"
|
||||
stroke-linejoin="round" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="mt-4 ml-4">
|
||||
<h5 class="text-2xl leading-6 font-bold text-gray-900">Transparency</h5>
|
||||
<p class="mt-4 text-base leading-6 opacity-55 max-w-sm m-auto">
|
||||
The trust to handle your sensitive data can only grow by being open about our company. In every aspect.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="pt-10 md:pt-0 transform transition hover:scale-105 duration-150 ease-in-out">
|
||||
<div class="flex items-center justify-center pl-2 md:pl-0 h-12 md:w-12 w-auto ">
|
||||
<svg class="h-8 w-8" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<g stroke-linecap="round" stroke-width="1.8" stroke="#446eed" fill="none" stroke-linejoin="round">
|
||||
<path d="M13.7678 10.9822c.976311.976311.976311 2.55922 0 3.53553-.976311.976311-2.55922.976311-3.53553 0-.976311-.976311-.976311-2.55922 0-3.53553.976311-.976311 2.55922-.976311 3.53553 0M19.2538 4.98223c.976311.976311.976311 2.55922 0 3.53553-.976311.976311-2.55922.976311-3.53553 0-.976311-.976311-.976311-2.55922 0-3.53553.976311-.976311 2.55922-.976311 3.53553 0M18 12.25c1.533 0 3 .533 4 1.333M8.28177 4.98223c.976311.976311.976311 2.55922 0 3.53553-.976311.976311-2.55922.976311-3.53553 0-.976311-.976311-.976311-2.55922 0-3.53553.976311-.976311 2.55922-.976311 3.53553 0M2 13.583c1-.8 2.467-1.333 4-1.333M16.591 19.75c-1.165-.901-2.839-1.5-4.591-1.5-1.752 0-3.426.599-4.591 1.5" />
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="mt-4 ml-4">
|
||||
<h5 class="text-2xl leading-6 font-bold text-gray-900">Our Quest</h5>
|
||||
<p class="mt-4 text-base leading-6 opacity-55 max-w-sm m-auto">
|
||||
We chase freedom so our societies can flourish. Giving control back to the people is way overdue.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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">
|
||||
<div class="pb-16 lg:pb-0 ml-0 lg:ml-32 lg:hidden self-center">
|
||||
<img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt="">
|
||||
</div>
|
||||
<div class="inline-block max-w-lg">
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none py-10 lg:w-auto">
|
||||
A Simple Business Model
|
||||
<div class="feature-container">
|
||||
<div class="feature-left">
|
||||
<h2 class="feature-left-title">
|
||||
Engage the problem at
|
||||
<span class="text-safing-blue-500">The Core</span>
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Our business model is Freemium. First provide local privacy for free, forever. Then let happy users support us by paying for a powerful VPN alternative. Finally reinvest earnings into making all our products better.
|
||||
<p class="feature-left-desc">
|
||||
The Internet is one of the most beautiful things there is.
|
||||
But every connection has the potential to betray you, leaking
|
||||
personal information you never wanted to share. That's where
|
||||
we intercept.
|
||||
</p>
|
||||
<div class="py-10 flex">
|
||||
<a href="{{ site.business_model_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">
|
||||
Look At The Cycle
|
||||
</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/business-model/reinvest-earnings-into-privacy.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="feature-right">
|
||||
<div class="feature-right-content">
|
||||
<i class="icon-shield feature-right-content-icon"></i>
|
||||
<span class="feature-right-content-title">Open Source</span>
|
||||
<p class="feature-right-content-desc">
|
||||
Secure software can only emerge when many smart people
|
||||
review and contribute to the code base.
|
||||
</p>
|
||||
</div>
|
||||
<div class="feature-right-content">
|
||||
<i class="icon-heart feature-right-content-icon"></i>
|
||||
<span class="feature-right-content-title">Transparency</span>
|
||||
<p class="feature-right-content-desc">
|
||||
The trust to handle your sensitive data can only grow by being open
|
||||
about our company. In every aspect.
|
||||
</p>
|
||||
</div>
|
||||
<div class="feature-right-content">
|
||||
<i class="icon-users feature-right-content-icon"></i>
|
||||
<span class="feature-right-content-title">Our Quest</span>
|
||||
<p class="feature-right-content-desc">
|
||||
We chase freedom so our societies can flourish. Giving control back to
|
||||
the people is way overdue.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="items-center h-full mt-8 md:mt-32">
|
||||
<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">
|
||||
<div class="lg:pb-0 m0-0 lg:mr-32 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">
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
A Simple Business Model
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Our business model is Freemium. First provide local privacy for free, forever.
|
||||
Then let happy users support us by paying for a powerful VPN alternative. Finally
|
||||
reinvest earnings into making all our products better.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.business_model_url }}">Look At The Cycle</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Clear 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 financed our journey so far.
|
||||
<p class="showcase-right-desc">
|
||||
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 financed our journey
|
||||
so far.
|
||||
</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>
|
||||
<a class="btn-secondary" href="{{ site.ownership_url }}">Explore our influences</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -1,5 +1,10 @@
|
|||
---
|
||||
---
|
||||
|
||||
@import "global";
|
||||
@import "page_container";
|
||||
/* Components */
|
||||
/* Components End */
|
||||
|
||||
/* Prebuilt */
|
||||
@import './prebuilt/general-layout/default.scss';
|
||||
@import './prebuilt/publication-layout/default.scss';
|
||||
/* Prebuilt End */
|
||||
|
|
Binary file not shown.
Before ![]() (image error) Size: 79 KiB |
|
@ -13,75 +13,82 @@ layout: page
|
|||
{% assign marketing_cards = all_cards | where_exp: "card", "card.projects contains 'Marketing'" %}
|
||||
{% assign backoffice_cards = all_cards | where_exp: "card", "card.projects contains 'Back Office'" %}
|
||||
|
||||
<section style="margin-top: 12rem; margin-bottom: 8rem;" class="mb-40">
|
||||
<div class="items-center h-full">
|
||||
<div class="relative max-w-screen-sm lg:max-w-screen-xl mx-auto px-4 sm:px-6 xl:px-0 lg:flex">
|
||||
<div class="pt-8">
|
||||
<div class="text-center lg:text-left">
|
||||
<span class="text-sm opacity-55 tracking-normal">{{ site.last_progress_update_on }}</span>
|
||||
<h2 id="influences" class="text-5xl tracking-tight font-extrabold leading-none pb-5 pt-2">
|
||||
Backlog
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg mx-auto">
|
||||
A big picture overview of our current mid- and long-term plans.
|
||||
</p>
|
||||
</div>
|
||||
<div class="pt-10 flex transform mx-auto justify-center lg:justify-start items-center">
|
||||
<span class="text-sm opacity-55 mr-4">
|
||||
Jump to:
|
||||
</span>
|
||||
<div class="flex">
|
||||
{% if portmaster_cards.size > 0 %}
|
||||
<header class="header-three-container mt-32">
|
||||
<div class="header-three-left">
|
||||
<span class="header-three-left-data">
|
||||
{{ site.last_progress_update_on }}
|
||||
</span>
|
||||
<h1 class="header-three-left-title">
|
||||
Backlog
|
||||
</h1>
|
||||
<p class="header-three-left-desc">
|
||||
A big picture overview of our current
|
||||
mid- and long-term plans.
|
||||
</p>
|
||||
<div class="header-three-left-jump space-x-3">
|
||||
<span class="title">Jump to:</span>
|
||||
<div class="tag-list">
|
||||
{% if portmaster_cards.size > 0 %}
|
||||
<a href="#portmaster" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Portmaster' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if spn_cards.size > 0 %}
|
||||
<a href="#spn" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='SPN' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if website_cards.size > 0 %}
|
||||
<a href="#website" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Website' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if community_cards.size > 0 %}
|
||||
<a href="#community" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Community' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if marketing_cards.size > 0 %}
|
||||
<a href="#marketing" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Marketing' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if backoffice_cards.size > 0 %}
|
||||
<a href="#backoffice" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Back Office' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% if spn_cards.size > 0 %}
|
||||
<a href="#spn" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='SPN' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if website_cards.size > 0 %}
|
||||
<a href="#website" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Website' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if community_cards.size > 0 %}
|
||||
<a href="#community" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Community' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if marketing_cards.size > 0 %}
|
||||
<a href="#marketing" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Marketing' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if backoffice_cards.size > 0 %}
|
||||
<a href="#backoffice" class="flex-1 pr-2" style="word-break: normal;">
|
||||
{% include tag.html tag='Back Office' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
<!-- <a class="tag-spn" href=""> SPN </a>
|
||||
<a class="tag-spn" href=""> SPN </a>
|
||||
<a class="tag-spn" href=""> SPN </a> -->
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-xs opacity-55 max-w-lg mx-auto pt-4">
|
||||
Disclaimer: Even if we'd love to accomplish everything listed below, some projects may turn out to be unfeasible.
|
||||
</p>
|
||||
</div>
|
||||
<div class="relative mt-24 lg:mt-0 lg:absolute lg:right-0 lg:mr-10">
|
||||
{% assign progress_posts = site.publications | reverse | where: "progress_update", "true" %}
|
||||
{% for post in progress_posts limit: 1 %}
|
||||
{% include thumbnail_blog.html pre_header="BLOG" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<p class="header-three-left-extra">
|
||||
Disclaimer: Even if we'd love to accomplish everything
|
||||
listed below, some projects may turn out to be unfeasible.
|
||||
</p>
|
||||
</div>
|
||||
<div class="header-three-right">
|
||||
{% assign progress_posts = site.publications | reverse | where: "progress_update", "true" %}
|
||||
{% for post in progress_posts limit: 1 %}
|
||||
{% include thumbnail_blog.html pre_header="BLOG" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</header>
|
||||
<section class="general-layout spacing-sm">
|
||||
{% if portmaster_cards.size > 0 %}
|
||||
<div class="pt-32">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50" id="portmaster">Portmaster</span>
|
||||
<strong class="pl-2 opacity-75">({{ portmaster_cards.size }})</strong>
|
||||
</div>
|
||||
<div class="collection-container" id="portmaster">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Portmaster
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ portmaster_cards.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in portmaster_cards %}
|
||||
{% include project_card.html state='backlog' project='portmaster' %}
|
||||
{% endfor %}
|
||||
|
@ -89,12 +96,18 @@ layout: page
|
|||
</div>
|
||||
{% endif %}
|
||||
{% if spn_cards.size > 0 %}
|
||||
<div class="pt-32">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50" id="spn">Safing Privacy Network</span>
|
||||
<strong class="pl-2 opacity-75">({{ spn_cards.size }})</strong>
|
||||
</div>
|
||||
<div class="collection-container" id="spn">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Safing Privacy Network
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ spn_cards.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in spn_cards %}
|
||||
{% include project_card.html state='backlog' project='spn' %}
|
||||
{% endfor %}
|
||||
|
@ -102,12 +115,18 @@ layout: page
|
|||
</div>
|
||||
{% endif %}
|
||||
{% if website_cards.size > 0 %}
|
||||
<div class="pt-32">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50" id="website">Website</span>
|
||||
<strong class="pl-2 opacity-75">({{ website_cards.size }})</strong>
|
||||
</div>
|
||||
<div class="collection-container" id="website">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Website
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ website_cards.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in website_cards %}
|
||||
{% include project_card.html state='backlog' project='website' %}
|
||||
{% endfor %}
|
||||
|
@ -115,12 +134,18 @@ layout: page
|
|||
</div>
|
||||
{% endif %}
|
||||
{% if community_cards.size > 0 %}
|
||||
<div class="pt-32">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50" id="community">Community</span>
|
||||
<strong class="pl-2 opacity-75">({{ community_cards.size }})</strong>
|
||||
</div>
|
||||
<div class="collection-container" id="community">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Community
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ community_cards.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in community_cards %}
|
||||
{% include project_card.html state='backlog' project='community' %}
|
||||
{% endfor %}
|
||||
|
@ -128,12 +153,18 @@ layout: page
|
|||
</div>
|
||||
{% endif %}
|
||||
{% if marketing_cards.size > 0 %}
|
||||
<div class="pt-32">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50" id="marketing">Marketing</span>
|
||||
<strong class="pl-2 opacity-75">({{ marketing_cards.size }})</strong>
|
||||
</div>
|
||||
<div class="collection-container" id="marketing">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Marketing
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ marketing_cards.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in marketing_cards %}
|
||||
{% include project_card.html state='backlog' project='marketing' %}
|
||||
{% endfor %}
|
||||
|
@ -141,12 +172,18 @@ layout: page
|
|||
</div>
|
||||
{% endif %}
|
||||
{% if backoffice_cards.size > 0 %}
|
||||
<div class="pt-32">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50" id="backoffice">Back Office</span>
|
||||
<strong class="pl-2 opacity-75">({{ backoffice_cards.size }})</strong>
|
||||
</div>
|
||||
<div class="collection-container" id="backoffice">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Back Office
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ backoffice_cards.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in backoffice_cards %}
|
||||
{% include project_card.html state='backlog' project='backoffice' %}
|
||||
{% endfor %}
|
||||
|
|
|
@ -3,34 +3,22 @@ title: Safing Blog
|
|||
layout: page
|
||||
---
|
||||
|
||||
<section class="pt-16 md:pt-32 lg:pt-64">
|
||||
<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">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="lg:text-center">
|
||||
<!-- hide the huge "Follow Us" in mobile & md devices for now, made width problems -->
|
||||
<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 hidden lg:block">Follow Us</span>
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-5 md:py-10 text-center">Blog</h2>
|
||||
<div class="flex mx-auto justify-center pt-5">
|
||||
<a href="{{ site.blog_feed_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
||||
<img style="height: 1.3rem; width: auto;" src="{{ site.img_url }}icons/rss.svg">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-8 md:mt-32">
|
||||
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10">
|
||||
{% assign sorted_blogs = site.publications | reverse | where:"category","blog" %}
|
||||
{% for post in sorted_blogs %}
|
||||
{% include thumbnail_blog.html %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<br class="mb-12">
|
||||
</div>
|
||||
<section class="general-layout">
|
||||
<div class="blogpod-container mt-80">
|
||||
<div class="blogpod-container-top">
|
||||
<span class="blogpod-container-top-bg-title">Follow Us</span>
|
||||
<h2 class="blogpod-container-top-title">
|
||||
Blog
|
||||
</h2>
|
||||
<div class="blogpod-container-top-extra">
|
||||
<a class="link-secondary" href="{{ site.blog_feed_url }}"><i class="icon-rss"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blogpod-container-bottom">
|
||||
{% assign sorted_blogs = site.publications | reverse | where:"category","blog" %}
|
||||
{% for post in sorted_blogs %}
|
||||
{% include thumbnail_blog.html %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -3,90 +3,74 @@ title: Business Model
|
|||
layout: page
|
||||
---
|
||||
|
||||
<section class="mt-20 lg:mt-48 mb-16 lg:mb-48">
|
||||
<div class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-16" style="max-width: 1700px;">
|
||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
||||
<h2 style="max-width: 404px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
||||
Provide Local Value for Free, Forever
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Everybody deserves privacy, not only the wealthy. That is why all local privacy features are free, and will remain so forever. This fits perfectly into the Freemium business model as well as into FOSS, free and open source software.
|
||||
</p>
|
||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
||||
<a href="{{ site.portmaster_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">
|
||||
Discover the Portmaster
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<section class="general-layout">
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 1050px;">
|
||||
<img src="{{ site.img_url }}page-specific/business-model/provide-local-value-for-free-forever.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Provide Local Value for Free, Forever
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Everybody deserves privacy, not only the wealthy. That is why
|
||||
all local privacy features are free, and will remain so forever.
|
||||
This fits perfectly into the Freemium business model as well as
|
||||
into FOSS, free and open source software.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/business-model/provide-local-value-for-free-forever.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:pt-20" style="max-width: 1700px;">
|
||||
<div class="row-start-2 lg:row-start-1 lg:col-start-2 mx-auto lg:ml-0 lg:mr-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:ml-32">
|
||||
<h2 style="max-width: 343px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10">
|
||||
Sell Protection in Transit
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
||||
There is privacy that comes with a cost because it requires additional server bandwidth. Naturally, this is where we charge for our powerful VPN alternative. You get an extra service, we get to finance ourselves.
|
||||
</p>
|
||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
||||
<a href="{{ site.spn_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">
|
||||
Discover the SPN
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/business-model/only-pay-for-protection-in-transit.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Sell Protection in Transit
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
There is privacy that comes with a cost because it requires
|
||||
additional server bandwidth. Naturally, this is where we charge
|
||||
for our powerful VPN alternative. You get an extra service,
|
||||
we get to finance ourselves.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.spn_url }}">Discover the SPN</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/business-model/only-pay-for-protection-in-transit.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:pt-20" style="max-width: 1700px;">
|
||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
||||
Reinvest Earnings into Privacy
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
All our income is invested into the privacy cycle: Finance amazing talent. Develop great, open source software - both free and paid. Delight users so more people join and support the cycle.
|
||||
</p>
|
||||
<br>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Repeat endlessly to spread privacy to the masses; strengthening the Freedom of our societies.
|
||||
</p>
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Reinvest Earnings into Privacy
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
All our income is invested into the privacy cycle: Finance amazing
|
||||
talent. Develop great, open source software - both free and paid.
|
||||
Delight users so more people join and support the cycle.
|
||||
<br>
|
||||
<br>
|
||||
Repeat endlessly to spread privacy to the masses; strengthening
|
||||
the Freedom of our societies.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:pt-20" style="max-width: 1700px;">
|
||||
<div class="row-start-2 lg:row-start-1 lg:col-start-2 mx-auto lg:ml-0 lg:mr-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:ml-32">
|
||||
<h2 style="max-width: 473px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10">
|
||||
Clear Ownership & Transparent Funding
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
||||
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 financed our journey so far.
|
||||
</p>
|
||||
<div class="py-10 sm:py-10 text-center sm: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 class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Clear Ownership & Transparent Funding
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
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
|
||||
financed our journey so far.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.ownership_url }}">Explore our influences</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
layout: page_container
|
||||
layout: exception_container
|
||||
title: Legal Disclosure - Impressum
|
||||
heading: Contact
|
||||
container_class: imprint
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
layout: page_container
|
||||
layout: exception_container
|
||||
title: ESA Business Incubation
|
||||
heading: ESA Business Incubation
|
||||
---
|
||||
|
|
200
index.html
200
index.html
|
@ -5,142 +5,94 @@ title: Safing - Love Freedom
|
|||
|
||||
{% include header.html %}
|
||||
|
||||
<section id="features" class="my-32 md:mt-16 md:mb-40">
|
||||
|
||||
<div class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col" style="max-width: 2000px;">
|
||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
<section class="general-layout">
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 1050px;">
|
||||
<img src="{{ site.img_url }}/page-specific/portmaster/monitor-network-activity.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
Monitor All Network Activity
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Discover everything that is happening on your computer. Expose every connection your applications make and detect evil ones. Finally get the power to act accordingly.
|
||||
<p class="showcase-right-desc">
|
||||
Discover everything that is happening on your computer. Expose every
|
||||
connection your applications make and detect evil ones. Finally get
|
||||
the power to act accordingly.
|
||||
</p>
|
||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
||||
<a href="{{ site.portmaster_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">
|
||||
Discover the Portmaster
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lg:-mr-20 ml-auto row-start-1 self-end md:self-start ">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/monitor-network-activity.png" alt="">
|
||||
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-64 lg:pt-20" style="max-width: 1700px;">
|
||||
<div class="row-start-2 lg:row-start-1 lg:col-start-2 mx-auto lg:ml-0 lg:mr-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:ml-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
</div>
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10">
|
||||
Block Trackers System-Wide
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
||||
Protect your whole computer, not just your browser. Block all advertisements and trackers for every application. Easily add your own rules and block individual domains.
|
||||
</p>
|
||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
||||
<a href="{{ site.portmaster_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">
|
||||
Discover the Portmaster
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}/page-specific/portmaster/block-trackers-system-wide.png" alt="">
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/block-trackers-system-wide.png" alt="">
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
Block Trackers System-Wide
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Protect your whole computer, not just your browser. Block all
|
||||
advertisements and trackers for every application. Easily add
|
||||
your own rules and block individual domains.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-64 lg:pt-20" style="max-width: 1700px;">
|
||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}/page-specific/portmaster/Set-global-and-per-app-configureation.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
||||
Set Global & per‑App Settings
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
Set Global & per‑App Settings
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Make your own rules. Completely cut off applications from the Internet. Or block all p2p connections except for certain apps. Or never connect to specific countries. The Portmaster has you covered.
|
||||
<p class="showcase-right-desc">
|
||||
Make your own rules. Completely cut off applications from the
|
||||
Internet. Or block all p2p connections except for certain apps.
|
||||
Or never connect to specific countries. The Portmaster has you
|
||||
covered.
|
||||
</p>
|
||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
||||
<a href="{{ site.portmaster_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">
|
||||
Discover the Portmaster
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blogpod-container">
|
||||
<div class="blogpod-container-top">
|
||||
<span class="blogpod-container-top-bg-title">Follow Us</span>
|
||||
<h2 class="blogpod-container-top-title">
|
||||
Blog, Podcast & Videos
|
||||
</h2>
|
||||
</div>
|
||||
<div class="blogpod-container-bottom">
|
||||
{% assign all_publications = site.publications | sort: "date" | reverse %}
|
||||
{% for publication in all_publications limit: 6 %}
|
||||
{% if publication.category == "blog" %}
|
||||
{% assign post = publication %}
|
||||
{% include thumbnail_blog.html pre_header="BLOG" %}
|
||||
{% elsif publication.category == "video" %}
|
||||
{% assign video = publication %}
|
||||
{% include thumbnail_video.html pre_header="VIDEO" %}
|
||||
{% elsif publication.category == "podcast" %}
|
||||
{% assign episode = publication %}
|
||||
{% include thumbnail_podcast.html pre_header="PODCAST" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="col-container-center pt-20 w-full md:w-max text-center md:text-left">
|
||||
<a class="btn-secondary" href="{{ site.blog_url }}">Blogs</a>
|
||||
<a class="btn-secondary" href="{{ site.podcast_url }}">Podcast</a>
|
||||
<a class="btn-secondary" href="{{ site.video_url }}">Videos</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/Set-global-and-per-app-configureation.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<div class="items-center h-full pb-8 lg:pb-24 mt-8 md:mt-32 lg: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">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="lg:text-center">
|
||||
<!-- hide the huge "Follow Us" in mobile & md devices for now, made width problems -->
|
||||
<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 hidden lg:block">Follow Us</span>
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none md:py-10 text-center" style="position: relative;">
|
||||
Blog, Podcast & Videos
|
||||
</h2>
|
||||
</div>
|
||||
<div class="mt-8 lg:mt-32">
|
||||
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10 max-w-sm mx-auto md:max-w-full">
|
||||
{% assign all_publications = site.publications | sort: "date" | reverse %}
|
||||
|
||||
{% for publication in all_publications limit: 6 %}
|
||||
{% if publication.category == "blog" %}
|
||||
{% assign post = publication %}
|
||||
{% include thumbnail_blog.html pre_header="BLOG" %}
|
||||
{% elsif publication.category == "video" %}
|
||||
{% assign video = publication %}
|
||||
{% include thumbnail_video.html pre_header="VIDEO" %}
|
||||
{% elsif publication.category == "podcast" %}
|
||||
{% assign episode = publication %}
|
||||
{% include thumbnail_podcast.html pre_header="PODCAST" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<div class="pt-20 flex w-full">
|
||||
<div class="mx-auto grid md:block">
|
||||
<a class="mx-auto" href="{{ site.blog_url }}">
|
||||
<button type="button" style="background-color: #000;" class="scale-110 md:scale-100 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">
|
||||
Blogs
|
||||
</button>
|
||||
</a>
|
||||
<a class="mx-auto" href="{{ site.podcast_url }}">
|
||||
<button type="button" style="background-color: #000;" class="mt-8 mb-8 md:mt-0 md:mb-0 md:ml-4 md:mr-4 scale-110 md:scale-100 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">
|
||||
Podcast
|
||||
</button>
|
||||
</a>
|
||||
<a class="mx-auto" href="{{ site.video_url }}">
|
||||
<button type="button" style="background-color: #000;" class="scale-110 md:scale-100 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">
|
||||
Videos
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
layout: page_container
|
||||
layout: exception_container
|
||||
title: Golang (or C/C++) Developer
|
||||
heading: Golang (or C/C++) Developer
|
||||
---
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
layout: page_container
|
||||
layout: exception_container
|
||||
title: Join Safing
|
||||
heading: Join Safing
|
||||
---
|
||||
|
|
221
next/index.html
221
next/index.html
|
@ -3,119 +3,124 @@ title: What's Next at Safing
|
|||
layout: page
|
||||
---
|
||||
|
||||
<section class="mb-40 mt-32">
|
||||
<div class="items-center h-full">
|
||||
<div class="relative max-w-screen-sm lg:max-w-screen-xl mx-auto px-4 sm:px-6 xl:px-0 lg:flex">
|
||||
<div class="pt-8">
|
||||
<div class="text-center lg:text-left">
|
||||
<span class="text-sm opacity-55 tracking-normal">{{ site.last_progress_update_on }}</span>
|
||||
<h2 id="influences" class="text-5xl tracking-tight font-extrabold leading-none pb-10 pt-2">
|
||||
<header class="header-three-container mt-32">
|
||||
<div class="header-three-left">
|
||||
<span class="header-three-left-data">
|
||||
{{ site.last_progress_update_on }}
|
||||
</span>
|
||||
<h1 class="header-three-left-title">
|
||||
Progress Overview
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg mx-auto">
|
||||
Find out what the Safing team is currently working on. This is a compact overview of bigger tasks grouped by projects.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative mt-24 lg:mt-0 lg:absolute lg:right-0 lg:mr-10">
|
||||
<span class="text-sm opacity-55 tracking-normal absolute w-full text-center lg:text-left " style="margin-top: -1.8rem;">Latest</span>
|
||||
{% assign progress_posts = site.publications | reverse | where: "progress_update", "true" %}
|
||||
{% for post in progress_posts limit: 1 %}
|
||||
{% include thumbnail_blog.html pre_header="BLOG" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% if site.data.next.cards.done.size > 0 %}
|
||||
<div class="pt-48">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50">Recently Completed</span>
|
||||
<strong class="pl-2 opacity-75">({{ site.data.next.cards.done.size }})</strong>
|
||||
</div>
|
||||
{% for card in site.data.next.cards.done %}
|
||||
{% include project_card.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if site.data.next.cards.in_progress.size > 0 %}
|
||||
<div class="pt-64">
|
||||
<div class="nextwrapper">
|
||||
<div class="absolute pl-8 -mt-48 sm:-mt-32">
|
||||
<div >
|
||||
<span class="opacity-50">In Progress</span>
|
||||
<strong class="pl-2 opacity-75">({{ site.data.next.cards.in_progress.size }})</strong>
|
||||
</div>
|
||||
<p class="opacity-50 pt-5 max-w-4xl">
|
||||
Being in progress does not imply the project will be
|
||||
completed soon. Plenty will take a while a few
|
||||
might even get discarded. Read the monthly blog updates
|
||||
to follow the progress and conclusion of every project.
|
||||
</p>
|
||||
</div>
|
||||
{% for card in site.data.next.cards.in_progress %}
|
||||
{% include project_card.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if site.data.next.cards.discarded.size > 0 %}
|
||||
<div class="pt-48">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50">Recently Discarded</span>
|
||||
<strong class="pl-2 opacity-75">({{ site.data.next.cards.discarded.size }})</strong>
|
||||
</div>
|
||||
|
||||
{% for card in site.data.next.cards.discarded %}
|
||||
{% include project_card.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if site.data.next.cards.postponed.size > 0 %}
|
||||
<div class="pt-48">
|
||||
<div class="nextwrapper">
|
||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
||||
<span class="opacity-50">Postponed</span>
|
||||
<strong class="pl-2 opacity-75">({{ site.data.next.cards.postponed.size }})</strong>
|
||||
</div>
|
||||
|
||||
{% for card in site.data.next.cards.postponed %}
|
||||
{% include project_card.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</section>
|
||||
<section class="mt-20 lg:mt-40 mb-16 lg:mb-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">
|
||||
<div class="pb-16 lg:pb-0 ml-0 lg:ml-32 lg:hidden self-center">
|
||||
<img src="{{ site.img_url }}page-specific/next/files.png" alt="">
|
||||
</div>
|
||||
<div class="inline-block max-w-lg">
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 lg:w-auto">
|
||||
There is More. <br/> A Lot More.
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
We have plans and ideas for years to come. We will never be "done" but always evolve and progress. I'm sure you have cool ideas for us too!
|
||||
Take a look what we already plan on doing in the longer run.
|
||||
</h1>
|
||||
<p class="header-three-left-desc">
|
||||
Without privacy there is no freedom of press, no
|
||||
freedom of speech, not even freedom of thought.
|
||||
</p>
|
||||
<div class="py-10 flex">
|
||||
<a href="{{ site.backlog_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 the Backlog
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<div class="header-three-right">
|
||||
{% assign progress_posts = site.publications | reverse | where: "progress_update", "true" %}
|
||||
{% for post in progress_posts limit: 1 %}
|
||||
{% include thumbnail_blog.html pre_header="BLOG" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</header>
|
||||
<section class="general-layout spacing-sm">
|
||||
{% if site.data.next.cards.done.size > 0 %}
|
||||
<div class="collection-container">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Recently Completed
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ site.data.next.cards.done.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in site.data.next.cards.done %}
|
||||
{% include project_card.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="hidden pt-16 lg:pt-0 ml-0 lg:ml-32 lg:block self-center">
|
||||
{% endif %}
|
||||
{% if site.data.next.cards.in_progress.size > 0 %}
|
||||
<div class="collection-container">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
In Progress
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ site.data.next.cards.in_progress.size }})
|
||||
</span>
|
||||
</div>
|
||||
<p class="collection-container-top-desc">
|
||||
Being in progress does not imply the project will be
|
||||
completed soon. Plenty will take a while a few
|
||||
might even get discarded. Read the monthly blog updates
|
||||
to follow the progress and conclusion of every project.
|
||||
</p>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in site.data.next.cards.in_progress %}
|
||||
{% include project_card.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if site.data.next.cards.discarded.size > 0 %}
|
||||
<div class="collection-container">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Recently Discarded
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ site.data.next.cards.discarded.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in site.data.next.cards.discarded %}
|
||||
{% include project_card.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if site.data.next.cards.postponed.size > 0 %}
|
||||
<div class="collection-container">
|
||||
<div class="collection-container-top">
|
||||
<div class="collection-container-top-title-counter items-center">
|
||||
<span class="collection-container-top-title">
|
||||
Postponed
|
||||
</span>
|
||||
<span class="text-sm collection-container-top-counter">
|
||||
({{ site.data.next.cards.postponed.size }})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection-container-bottom">
|
||||
{% for card in site.data.next.cards.postponed %}
|
||||
{% include project_card.html state = 'postponed' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="showcase-container-reverse mt-32">
|
||||
<div class="showcase-left" style="max-width: 1050px;">
|
||||
<img src="{{ site.img_url }}page-specific/next/files.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 299px;">
|
||||
There is More. A Lot More.
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
We have plans and ideas for years to come. We will
|
||||
never be "done" but always evolve and progress. I'm
|
||||
sure you have cool ideas for us too! Take a look what
|
||||
we already plan on doing in the longer run.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.backlog_url }}">Explore the bacllog</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
|
@ -5,248 +5,103 @@ redirect_from:
|
|||
- /donate/
|
||||
---
|
||||
|
||||
<section class="mt-20 md:mt-40">
|
||||
<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">
|
||||
<div class="lg:pb-0 m0-0 lg:mr-32 self-center">
|
||||
<img src="{{ site.img_url }}page-specific/ownership/ownership.png" alt="">
|
||||
</div>
|
||||
<div class="inline-block max-w-lg">
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none py-10">
|
||||
<section class="general-layout">
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 1050px;">
|
||||
<img src="{{ site.img_url }}page-specific/ownership/ownership.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h1 class="showcase-right-title" style="max-width: 450px;">
|
||||
We own Safing
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
We do not want parties to gain influence which do not or might not stand behind our values. That is why in the initial funding phase we took more personal risks instead of selling parts of our company for easy money.
|
||||
</p>
|
||||
<p class="text-md opacity-55 max-w-lg pt-4">
|
||||
</h1>
|
||||
<p class="showcase-right-desc">
|
||||
We do not want parties to gain influence which do not or might not stand
|
||||
behind our values. That is why in the initial funding phase we took more
|
||||
personal risks instead of selling parts of our company for easy money.
|
||||
<br>
|
||||
<br>
|
||||
The legal entity behind Safing is <i>Safing ICS Technologies GmbH</i>, a private company registered in Austria.
|
||||
</p>
|
||||
<div class="py-10 md:flex text-center md:text-left inline-block">
|
||||
<a href="{{ site.company_agreement_url }}">
|
||||
<button type="button" style="background-color: #000;" class="mb-5 md:mb-0 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 public registry
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<a class="btn-secondary" href="{{ site.company_agreement_url }}">View public registry</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="items-center h-full mt-8 md:mt-32 lg: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 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/ownership/influences.png" alt="">
|
||||
</div>
|
||||
<div class="inline-block max-w-lg">
|
||||
<h2 id="finances" style="line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none py-10">
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/ownership/influences.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Financed by Grants, Loans and <span style="color: #6188ff;">You</span>
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
We are thankful for all the partnerships & possibilities that are emerging from our R&D heavy years in which we are exploring new privacy frontiers.
|
||||
<p class="showcase-right-desc">
|
||||
We are thankful for all the partnerships & possibilities that are emerging
|
||||
from our R&D heavy years in which we are exploring new privacy frontiers.
|
||||
<br>
|
||||
<br>
|
||||
Slowly but surely we are migrating into our dream scenario where we only
|
||||
have to rely on the support and trust of our users. Help us get there by
|
||||
using the Portmaster and later down the road, purchasing the SPN.
|
||||
</p>
|
||||
<p class="text-md opacity-55 max-w-lg pt-4">
|
||||
Slowly but surely we are migrating into our dream scenario where we only have to rely on the support and trust of our users. Help us get there by using the Portmaster and later down the road, purchasing the SPN.
|
||||
|
||||
</p>
|
||||
<div class="py-10 flex">
|
||||
<a href="#influences">
|
||||
<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 the details
|
||||
</button>
|
||||
</a>
|
||||
<a href="{{ site.spn_url }}#pricing" class="inline-flex pl-8 transition duration-150 ease-in-out hover:opacity-100 self-center uppercase opacity-55 text-xs font-bold">
|
||||
Support with a purchase
|
||||
</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/ownership/influences.png" alt="">
|
||||
</div>
|
||||
<a class="btn-secondary" href="#influences">Explore the Details</a>
|
||||
<a class="btn-tertiary hover-opacity-out" href="{{ site.spn_url }}#pricing">Support with a Purchase</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section style="margin-top: 6rem; margin-bottom: 8rem;" class="mb-40">
|
||||
<div class="items-center h-full">
|
||||
<div class="">
|
||||
<div class="m">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-0">
|
||||
<div class="pl-8 text-left">
|
||||
<h2 id="influences" class="text-5xl tracking-tight font-extrabold leading-none py-10">
|
||||
Influences
|
||||
<span class="text-sm opacity-55 tracking-normal">updated {{ site.last_finances_update_on }}</span>
|
||||
<div class="influence-container" id="influences">
|
||||
<div class="influence-container-top">
|
||||
<div class="influence-container-top-title-date">
|
||||
<h2 class="influence-container-top-title">
|
||||
Influences
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Through these partnerships we are not only receiving funding, but much needed support, advice, training, encouragement and helpful criticism.
|
||||
</p>
|
||||
<p class="text-md opacity-55 max-w-lg pt-4">
|
||||
To everyone involved - you know who you are: Thank you so much, we would not be here without you!
|
||||
</p>
|
||||
<span class="influence-container-top-data">updated November 2021</span>
|
||||
</div>
|
||||
<p class="influence-container-top-desc">
|
||||
Through these partnerships we are not only receiving funding, but
|
||||
much needed support, advice, training, encouragement and helpful
|
||||
criticism.
|
||||
<br>
|
||||
<br>
|
||||
To everyone involved - you know who you are: Thank you so much, we
|
||||
would not be here without you!
|
||||
</p>
|
||||
</div>
|
||||
<div class="influence-container-bottom">
|
||||
{% for influence in site.data.finances %}
|
||||
<div class="card-influence">
|
||||
<div class="card-influence-top ">
|
||||
<div class="card-influence-title-date">
|
||||
<span class="card-influence-top-title">{{ influence.name }}</span>
|
||||
<span class="card-influence-top-date">{{ influence.timespan }}</span>
|
||||
</div>
|
||||
<p class="card-influence-top-desc">
|
||||
<div class="markdown-container px-0">
|
||||
{{ influence.description | markdownify }}
|
||||
</div>
|
||||
</p>
|
||||
</div>
|
||||
<div class="mt-24">
|
||||
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10 mr-auto ml-auto">
|
||||
<li class="text-center md:text-left">
|
||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover p-8 rounded-lg">
|
||||
<div>
|
||||
<h1 class="text-2xl uppercase transition hover:opacity-55 ease-in-out duration-150">FFG</h1>
|
||||
<span class="pt-4 opacity-55 font-extrabold">{{ site.data.finances.source.ffg.timespan }}</span>
|
||||
<p class="pt-4 opacity-75">
|
||||
The FFG is the national funding institution for Research & Development of Austria. Their goal is to strengthen innovation and the economy.
|
||||
</p>
|
||||
<p class="pt-4 opacity-75">
|
||||
We got accepted into the FFG Basisprogramm in 2019 continuing until 2021. The included funding and loan enabled us to hire our first employees and further progress our products.
|
||||
</p>
|
||||
</div>
|
||||
{% for year in site.data.finances.source.ffg.years %}
|
||||
<ul class="text-sm pt-4">
|
||||
<span class="font-medium opacity-55">{{ year.year }}</span>
|
||||
{% for item in year.items %}
|
||||
<li class="opacity-75 font-medium">
|
||||
{% if item.status == "completed" %}
|
||||
Received
|
||||
{% endif %}
|
||||
<span class="font-extrabold">{{ item.amount }}€ {{ item.type }}</span>
|
||||
{% if item.status == "open" %}
|
||||
<small>held out in prospect</small>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</li>
|
||||
<li class="text-center md:text-left pt-16 md:pt-0">
|
||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover p-8 rounded-lg">
|
||||
<div>
|
||||
<h1 class="text-2xl uppercase transition hover:opacity-55 ease-in-out duration-150">Netidee</h1>
|
||||
<span class="pt-4 opacity-55 font-extrabold">{{ site.data.finances.source.netidee.timespan }}</span>
|
||||
<p class="pt-4 opacity-75">
|
||||
Netidee funding from 2017 helped us to kickstart all this.
|
||||
In late 2019 and 2020, they granted follow-up fundings for the years
|
||||
2019/20 and 2020/21 respectively.
|
||||
</p>
|
||||
</div>
|
||||
{% for year in site.data.finances.source.netidee.years %}
|
||||
<ul class="text-sm pt-4">
|
||||
<span class="font-medium opacity-55">{{ year.year }}</span>
|
||||
{% for item in year.items %}
|
||||
<li class="opacity-75 font-medium">
|
||||
{% if item.status == "completed" %}
|
||||
Received
|
||||
{% endif %}
|
||||
<span class="font-extrabold">{{ item.amount }}€ {{ item.type }}</span>
|
||||
{% if item.status == "open" %}
|
||||
<small>held out in prospect</small>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</li>
|
||||
<li class="text-center md:text-left pt-16 md:pt-0">
|
||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover p-8 rounded-lg">
|
||||
<div>
|
||||
<h1 class="text-2xl uppercase transition hover:opacity-55 ease-in-out duration-150">Kickstarter</h1>
|
||||
<span class="pt-4 opacity-55 font-extrabold">{{ site.data.finances.source.kickstarter.timespan }}</span>
|
||||
<p class="pt-4 opacity-75">
|
||||
Through our
|
||||
<a href="{{ site.kickstarter_url }}">
|
||||
<u>crowdfunding campaign</u>,
|
||||
</a>
|
||||
we received our first supporters who also backed us financially. Thanks to every one of you for giving us your trust and money even before we had any software to show for!
|
||||
</p>
|
||||
</div>
|
||||
{% for year in site.data.finances.source.kickstarter.years %}
|
||||
<ul class="text-sm pt-4">
|
||||
<span class="font-medium opacity-55">{{ year.year }}</span>
|
||||
{% for item in year.items %}
|
||||
<li class="opacity-75 font-medium">
|
||||
{% if item.status == "completed" %}
|
||||
Received
|
||||
{% endif %}
|
||||
<span class="font-extrabold">{{ item.amount }}€ {{ item.type }}</span>
|
||||
{% if item.status == "open" %}
|
||||
<small>held out in prospect</small>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</li>
|
||||
<li class="text-center md:text-left pt-16 md:pt-0">
|
||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover p-8 rounded-lg">
|
||||
<div>
|
||||
<h1 class="text-2xl uppercase transition hover:opacity-55 ease-in-out duration">ESA-BIC Austria</h1>
|
||||
<span class="pt-4 opacity-55 font-extrabold">{{ site.data.finances.source.esa.timespan }}</span>
|
||||
<p class="pt-4 opacity-75">
|
||||
Safing ICS Technologies GmbH is participating in the
|
||||
<a href="{{ site.esa_bic_url }}">
|
||||
<u>ESA Business Incubation Centre Austria.</u>
|
||||
</a>
|
||||
We are incubated by Accent, with SPG
|
||||
and the Lower Austrian State as the contractual partners.
|
||||
</p>
|
||||
</div>
|
||||
{% for year in site.data.finances.source.esa.years %}
|
||||
<ul class="text-sm pt-4">
|
||||
<span class="font-medium opacity-55">{{ year.year }}</span>
|
||||
{% for item in year.items %}
|
||||
<li class="opacity-75 font-medium">
|
||||
{% if item.status == "completed" %}
|
||||
Received
|
||||
{% endif %}
|
||||
<span class="font-extrabold">{{ item.amount }}€ {{ item.type }}</span>
|
||||
{% if item.status == "open" %}
|
||||
<small>held out in prospect</small>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</li>
|
||||
<li class="text-center md:text-left pt-16 md:pt-0">
|
||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover p-8 rounded-lg">
|
||||
<div>
|
||||
<h1 class="text-2xl uppercase transition hover:opacity-55 ease-in-out duration-150">Fund of Excellence</h1>
|
||||
<span class="pt-4 opacity-55 font-extrabold">2018-2019</span>
|
||||
<p class="pt-4 opacity-75">
|
||||
The Fund of Excellence is an investment fund by the Erste Group, that invests in people, rather than companies. They were investing in one of Safing's founders.
|
||||
</p>
|
||||
</div>
|
||||
<ul class="text-sm pt-6">
|
||||
<span class="font-medium opacity-55">2018-2019</span>
|
||||
<li class="opacity-75 font-medium">Received continuous personal funding</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="text-center md:text-left pt-16 md:pt-0">
|
||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover p-8 rounded-lg">
|
||||
<div>
|
||||
<h1 class="text-2xl uppercase transition hover:opacity-55 ease-in-out duration-150">Personal Investment</h1>
|
||||
<span class="pt-4 opacity-55 font-extrabold">2017-2021</span>
|
||||
<p class="pt-4 opacity-75">
|
||||
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.
|
||||
</p>
|
||||
</div>
|
||||
<ul class="text-sm pt-6">
|
||||
<span class="font-medium opacity-55">2019</span>
|
||||
<li class="opacity-75 font-medium">Invested over <span class="font-extrabold">200.000€</span> in value</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="card-influence-bottom">
|
||||
{% for year in influence.years %}
|
||||
<div class="card-influence-bottom-funding">
|
||||
<span class="card-influence-bottom-funding-date">{{ year.year }}</span>
|
||||
{% for item in year.items %}
|
||||
<span class="card-influence-bottom-funding-amount">
|
||||
{% if item.custom != null %}
|
||||
<span>{{ item.custom }}</span>
|
||||
{% else %}
|
||||
{% if item.status == "completed" %}
|
||||
<span>Received</span>
|
||||
{% endif %}
|
||||
<span class="font-extrabold">{{ item.amount }}€ {{ item.type }}</span>
|
||||
{% if item.status == "open" %}
|
||||
<small>held out in prospect</small>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</span>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -3,37 +3,23 @@ title: The Safing Podcast
|
|||
layout: page
|
||||
---
|
||||
|
||||
<section class="pt-16 md:pt-32 lg:pt-64">
|
||||
<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">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="lg:text-center">
|
||||
<!-- hide the huge "Follow Us" in mobile & md devices for now, made width problems -->
|
||||
<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 hidden lg:block">Follow Us</span>
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-5 md:py-10 text-center">Podcast</h2>
|
||||
<div class="flex mx-auto justify-center pt-5">
|
||||
<a href="{{ site.podcast_itunes_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
||||
<img style="height: 1.3rem; width: auto;" src="{{ site.img_url }}icons/podcast.svg">
|
||||
</a>
|
||||
<a href="{{ site.podcast_feed_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
||||
<img style="height: 1.3rem; width: auto;" src="{{ site.img_url }}icons/rss.svg">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-8 md:mt-16 lg:mt-32">
|
||||
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10">
|
||||
{% assign sorted_podcasts = site.publications | reverse | where:"category","podcast" %}
|
||||
{% for episode in sorted_podcasts %}
|
||||
{% include thumbnail_podcast.html %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<br class="mb-12">
|
||||
</div>
|
||||
<section class="general-layout">
|
||||
<div class="blogpod-container mt-80">
|
||||
<div class="blogpod-container-top">
|
||||
<span class="blogpod-container-top-bg-title">Follow Us</span>
|
||||
<h2 class="blogpod-container-top-title">
|
||||
Podcast
|
||||
</h2>
|
||||
<div class="blogpod-container-top-extra">
|
||||
<a class="link-secondary" href="{{ site.podcast_itunes_url }}"><i class="icon-podcast"></i></a>
|
||||
<a class="link-secondary" href="{{ site.podcast_feed_url }}"><i class="icon-rss"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blogpod-container-bottom">
|
||||
{% assign sorted_podcasts = site.publications | reverse | where:"category","podcast" %}
|
||||
{% for episode in sorted_podcasts %}
|
||||
{% include thumbnail_podcast.html %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -6,304 +6,242 @@ redirect_from:
|
|||
- /download/
|
||||
---
|
||||
|
||||
<div class="notification w-full text-center text-white p-2" style="background-color: #6188ff;">
|
||||
<div class="mx-auto flex">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="ml-auto h-4 w-4 self-center mr-2">
|
||||
<span class="w-auto text-sm mr-auto">Portmaster is Alpha Software - expect hiccups here and there</span>
|
||||
</div>
|
||||
<div class="alert-primary rounded-none text-md">
|
||||
<i class="icon-info"></i>
|
||||
<span>Portmaster is Alpha Software - expect hiccups here and there</span>
|
||||
</div>
|
||||
<header class="h-full my-20 md:my-40">
|
||||
<div class="flex items-center h-ful">
|
||||
<div class="h-full mx-auto ">
|
||||
<div class="text-center">
|
||||
<h2 class="text-5xl sm:text-6xl tracking-tight font-extrabold leading-none py-10">
|
||||
<header class="header-two-container mb-64">
|
||||
<div class="header-two-top">
|
||||
<h1 class="header-two-top-title">
|
||||
Take Back Control of Your Computer
|
||||
</h2>
|
||||
<div class="self-center">
|
||||
<p class="text-md opacity-55 max-w-lg mx-auto">
|
||||
Portmaster is a free and open-source application that puts you back in charge over all your computer's network connections.
|
||||
</p>
|
||||
<div class="py-10 sm:py-10 block mx-auto">
|
||||
<a href="#downloads">
|
||||
<button type="button" style="background-color: #000;" class="mb-5 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 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 active:bg-indigo-700 transition duration-150 ease-in-out uppercase">
|
||||
download for free
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-6">
|
||||
<img src="{{ site.img_url }}page-specific/portmaster/full-interface.png" class="z-30 rounded-md mx-auto transform " style="box-shadow: 0 0px 90px 0 rgba(59, 93, 199, 0.3), 0 0px 5px 0 rgba(0, 0, 0, 0.05);" alt="">
|
||||
</div>
|
||||
<span style="margin-top: -45rem; margin-left: -8rem; z-index: -1;" class="absolute transform scale-50 lg:scale-105 xl:scale-150 bg-cover opacity-75 hidden lg:block">
|
||||
<img src="{{ site.img_url }}page-specific/portmaster/wave.png" alt="">
|
||||
</span>
|
||||
</div>
|
||||
</h1>
|
||||
<p class="header-two-top-desc">
|
||||
Portmaster is a free and open-source application that puts
|
||||
you back in charge over all your computer's network
|
||||
connections.
|
||||
</p>
|
||||
<a class="btn-secondary" href="#download">Download for free</a>
|
||||
</div>
|
||||
<div class="header-two-bottom">
|
||||
<img src="{{ site.img_url }}page-specific/portmaster/full-interface.png" alt="">
|
||||
</div>
|
||||
<div class="header-bg">
|
||||
<svg viewBox="0 0 862.55555573 533">
|
||||
<rect width="100%" height="100%" fill="transparent" />
|
||||
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
<stop offset="45%" style="stop-color:rgb(255,255,255);stop-opacity:1" />
|
||||
<stop offset="100%" style="stop-color:rgb(203, 216, 255);stop-opacity:1" />
|
||||
</linearGradient>
|
||||
<linearGradient id="grad2" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
<stop offset="0%" style="stop-color:rgb(255,255,255);stop-opacity:1" />
|
||||
<stop offset="30%" style="stop-color:rgb(166, 188, 252);stop-opacity:1" />
|
||||
</linearGradient>
|
||||
<g class="currentLayer">
|
||||
<path fill="url(#grad1)" d="M-343.9671309 341.87524268l928.98694302 42.12820593c.01883766.20463406 61.2696979-105.77288342-213.41085192-190.63207383C96.92841038 108.51218436 51.68872214 129.12144353-5.83818882 99.75368848" color="#000" />
|
||||
<path fill="url(#grad2)" d="M-204.43749658 535.31278382l.52971601-372.32431132c-.529716.43478124 321.632442 179.35134083 582.17297919 146.37836828C638.8057358 276.39386824 866.37330043 414.2317043 866.3624897 413.79928331c.01081073.43242099 4.335135 129.08106798 4.32432433 128.64864865" color="#000" />
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
</header>
|
||||
<section id="features" class="my-32 md:pt-32 md:mb-40 ">
|
||||
<div id="network-all-network-activity" class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col" style="max-width: 2000px;">
|
||||
<div class=" mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
</div>
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
||||
Monitor All Network Activity
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Discover everything that is happening on your computer. Expose every connection your applications make and detect evil ones. Finally get the power to act accordingly.
|
||||
</p>
|
||||
<section class="general-layout">
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 1050px;">
|
||||
<img src="{{ site.img_url }}page-specific/portmaster/monitor-network-activity.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
Monitor All Network Activity
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Discover everything that is happening on your computer. Expose every
|
||||
connection your applications make and detect evil ones. Finally get
|
||||
the power to act accordingly.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lg:-mr-20 ml-auto row-start-1 self-end md:self-start ">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/monitor-network-activity.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div id="manually-allow-or-block-connections" class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-64" style="max-width: 1700px;">
|
||||
<div class="row-start-2 lg:row-start-1 lg:col-start-2 mx-auto lg:ml-0 lg:mr-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:mr-4 inline-block max-w-lg lg:ml-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/portmaster/manually-allow-ord-block-connections.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10">
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
Block Unwanted Connections
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
||||
Many programs connect to the Internet without your knowledge. When you find unwanted connections, you can now simply block them.
|
||||
<p class="showcase-right-desc">
|
||||
Many programs connect to the Internet without your knowledge. When you
|
||||
find unwanted connections, you can now simply block them.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/manually-allow-ord-block-connections.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div id="auto-block-via-selected-filter-lists" class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-64 lg:pt-12" style="max-width: 1700px;">
|
||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
</div>
|
||||
<h2 style="max-width: 403px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
||||
Auto-Block via Selected Filter Lists
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Automatically block ads, trackers and malware hosts via trusted domain-lists, which are also used by Ad-Blockers, etc. Easily change the defaults to fit your needs.
|
||||
</p>
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}/page-specific/portmaster/block-trackers-system-wide.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Auto-Block via Selected Filter Lists
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Automatically block ads, trackers and malware hosts via trusted domain-lists,
|
||||
which are also used by Ad-Blockers, etc. Easily change the defaults to fit
|
||||
your needs.
|
||||
</p>
|
||||
</div>
|
||||
<!-- <div class="py-10 sm:py-10 text-center sm:flex">
|
||||
<a href="{{ site.docs_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">
|
||||
Checkout our Docs
|
||||
</button>
|
||||
</a>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/block-trackers-system-wide.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div id="enforce-dns-over-tls" class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-64 lg:pt-20" style="max-width: 1700px;">
|
||||
<div class="row-start-2 lg:row-start-1 lg:col-start-2 mx-auto lg:ml-0 lg:mr-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:mr-4 inline-block max-w-lg lg:ml-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/portmaster/enforce-dns-over-tls.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 style="max-width: 384px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10">
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
Enforce Secure DNS
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
||||
Even with invasive connections gone, you do not want to share your dns requests out in the open. With the Portmaster, you can easily re-route all your dns queries to a DNS-over-TLS provider of your choice.
|
||||
<p class="showcase-right-desc">
|
||||
Even with invasive connections gone, you do not want to share your dns requests
|
||||
out in the open. With the Portmaster, you can easily re-route all your dns
|
||||
queries to a DNS-over-TLS provider of your choice.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/enforce-dns-over-tls.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div id="explore-the-docs-and-source-code" class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-64" style="max-width: 1700px;">
|
||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/portmaster/explore-the-docs-and-source-code.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
Explore the Docs and Source Code
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
In the age of Mass Surveillance, what good is a service when you cannot see what it is really doing? We believe in open source. We also document everything as good as we can.
|
||||
<p class="showcase-right-desc">
|
||||
In the age of Mass Surveillance, what good is a service when you cannot see what
|
||||
it is really doing? We believe in open source. We also document everything
|
||||
as good as we can.
|
||||
</p>
|
||||
</div>
|
||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
||||
<a href="{{ site.docs_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">
|
||||
Check out the Docs
|
||||
</button>
|
||||
</a>
|
||||
<br>
|
||||
<a href="{{ site.github_url }}/portmaster" class="sm:pl-8 transition duration-150 ease-in-out hover:opacity-100 self-center uppercase opacity-55 text-xs font-bold">
|
||||
Inspect Source Code
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/explore-the-docs-and-source-code.png" alt="">
|
||||
<div class="col-container w-full text-left md:text-center lg:w-max lg:text-left">
|
||||
<a class="btn-secondary" href="{{ site.docs_url }}">Checkout the docs</a>
|
||||
<a class="btn-tertiary hover-opacity-out" href="{{ site.github_url }}/portmaster"><i class="icon-github text-md mr-2"></i>Inspect source code</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="configure-settings-for-different-networks" class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-64" style="max-width: 1700px;">
|
||||
<div class="row-start-2 lg:row-start-1 lg:col-start-2 mx-auto lg:ml-0 lg:mr-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:mr-4 inline-block max-w-lg lg:ml-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/portmaster/configure-settings-for-different-networks.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10">
|
||||
<h2 class="showcase-right-title" style="max-width: 550px;">
|
||||
Configure Settings for Different Networks
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
||||
The Wi-Fi in your local coffee shop is riskier than yours at home. Set up your settings for different networks and then simply press a button when changing location. All settings will adjust immediately.
|
||||
<p class="showcase-right-desc">
|
||||
The Wi-Fi in your local coffee shop is riskier than yours at home. Set up your
|
||||
settings for different networks and then simply press a button when changing
|
||||
location. All settings will adjust immediately
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/configure-settings-for-different-networks.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div id="set-global-and-app-settings" class="mx-auto grid grid-rows-auto grid-cols-1 grid-row-col lg:grid-cols-2 lg:grid-flow-col mt-32 lg:mt-64 lg:pt-20" style="max-width: 1700px;">
|
||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: Portmaster is in active development
|
||||
</div>
|
||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
||||
Set Global & per‑App Settings
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Make your own rules. Completely cut off applications from the Internet. Or block all p2p connections except for certain apps. Or never connect to specific countries. The Portmaster has you covered.
|
||||
</p>
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}/page-specific/portmaster/Set-global-and-per-app-configureation.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/Set-global-and-per-app-configureation.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="mt-16 lg:mt-48">
|
||||
<div class="items-center h-full">
|
||||
<div class="">
|
||||
<div class="max-w-full mx-auto px-4 sm:px-6">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center">
|
||||
<h2 id="downloads" class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
||||
Download
|
||||
</h2>
|
||||
<div class="mx-auto p-5 pl-5 rounded-md text-white flex break-words" style="font-size: .85rem; background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Portmaster is Alpha Software, treat as such; expect bugs here and there. Early Adopters welcome.
|
||||
</div>
|
||||
</div>
|
||||
<div class="py-10">
|
||||
<div class="pb-6 pt-2 block grid lg:flex lg:grid-cols-3 gap-10 justify-center">
|
||||
<a href="{{ site.download_windows_url }}" class="flex items-center">
|
||||
<button type="button" style="background-color: #000;" class="mx-auto 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">
|
||||
<svg class="h-4 w-4 mr-3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 88 88">
|
||||
<path fill="#fff" d="m0 12.402 35.687-4.8602.0156 34.423-35.67.20313zm35.67 33.529.0277 34.453-35.67-4.9041-.002-29.78zm4.3261-39.025 47.318-6.906v41.527l-47.318.37565zm47.329 39.349-.0111 41.34-47.318-6.6784-.0663-34.739z" />
|
||||
</svg>
|
||||
Windows 10 + 11
|
||||
</button>
|
||||
</a>
|
||||
<a href="{{ site.download_linux_deb_url }}" class="flex items-center">
|
||||
<button type="button" style="background-color: #000;" class="mx-auto lg:ml-3 lg:mr-3 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">
|
||||
<svg class="h-5 w-5 mr-3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100">
|
||||
<circle fill="#fff" cy="50" cx="50" r="45" />
|
||||
<circle fill="none" stroke="#000" stroke-width="8.55" cx="50" cy="50" r="21.825" />
|
||||
<g id="friend">
|
||||
<circle fill="#fff" cx="19.4" cy="50" r="8.4376" />
|
||||
<path stroke="#fff" stroke-width="3.2378" d="M67,50H77" />
|
||||
<circle fill="#000" cx="19.4" cy="50" r="6.00745" />
|
||||
</g>
|
||||
<use xlink:href="#friend" transform="rotate(120,50,50)" />
|
||||
<use xlink:href="#friend" transform="rotate(240,50,50)" />
|
||||
</svg>
|
||||
Ubuntu
|
||||
</button>
|
||||
</a>
|
||||
<a href="{{ site.download_linux_rpm_url }}" class="flex items-center">
|
||||
<button type="button" style="background-color: #000;" class="mx-auto lg:ml-3 lg:mr-3 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">
|
||||
<svg class="h-5 w-5 mr-3" viewBox="0 0 204.7 200.9" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="m102.7 1.987c-55.41 0-100.3 44.21-100.4 98.79h-0.01773v76.47h0.01773c0.02659 12.38 10.22 22.4 22.8 22.4h77.58c55.42-0.0349 100.3-44.24 100.3-98.79 8e-5 -54.58-44.91-98.79-100.4-98.79zm20.39 40.68c16.85 0 32.76 12.7 32.76 30.23 0 1.625 0.01 3.252-0.26 5.095-0.4668 4.662-4.794 8.012-9.505 7.355-4.711-0.6649-7.909-5.07-7.037-9.679 0.0799-0.526 0.1083-1.352 0.1083-2.772 0-9.938-8.257-13.77-16.06-13.77-7.805 0-14.84 6.462-14.85 13.77 0.1349 8.455 0 16.84 0 25.29l14.49-0.1067c11.31-0.2306 11.44 16.54 0.1305 16.46l-14.61 0.1067c-0.0354 6.801 0.0532 5.571 0.0178 8.996 0 0 0.1225 8.318-0.1296 14.62-1.749 18.52-17.76 33.32-37 33.32-20.4 0-37.2-16.41-37.2-36.54 0.6124-20.7 17.38-36.99 38.5-36.8l11.78-0.08737v16.43l-11.78 0.1066h-0.06216c-11.6 0.3382-21.55 8.1-21.74 20.34 0 11.15 9.148 20.08 20.5 20.08 11.34 0 20.42-8.124 20.42-20.06l-0.01772-62.23c0.0058-1.155 0.04435-2.073 0.1731-3.347 1.914-15.22 15.74-26.82 31.39-26.82z" style="fill:#fff;stroke-width:.982"/>
|
||||
</svg>
|
||||
Fedora
|
||||
</button>
|
||||
</a>
|
||||
<a class="not-allowed flex items-center">
|
||||
<button type="button" style="background-color: #000;" class="mx-auto not-allowed opacity-55 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">
|
||||
<svg class="h-5 w-5 mr-3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1187.198">
|
||||
<path fill="#fff" d="M979.04184 925.18785c-17.95397 41.47737-39.20563 79.65705-63.82824 114.75895-33.56298 47.8528-61.04356 80.9761-82.22194 99.3698-32.83013 30.192-68.00529 45.6544-105.67203 46.5338-27.04089 0-59.6512-7.6946-97.61105-23.3035-38.08442-15.5358-73.08371-23.2303-105.08578-23.2303-33.56296 0-69.55888 7.6945-108.06101 23.2303-38.5608 15.6089-69.62484 23.7432-93.37541 24.5493-36.12049 1.5389-72.1237-14.3632-108.06101-47.7796-22.93711-20.0059-51.62684-54.3017-85.99592-102.8874-36.875274-51.88328-67.191862-112.04745-90.942422-180.639C12.750995 781.70252 0 709.95986 0 640.50361c0-79.5618 17.191859-148.18267 51.626869-205.68673 27.062885-46.18935 63.066121-82.62496 108.126941-109.37275 45.06086-26.74775 93.74914-40.37812 146.18212-41.25019 28.68971 0 66.3125 8.8744 113.06613 26.31542 46.62174 17.49964 76.55727 26.37404 89.68198 26.37404 9.8124 0 43.06758-10.37669 99.4431-31.06405 53.31237-19.18512 98.30724-27.12887 135.16787-23.99975 99.8828 8.06098 174.92313 47.43518 224.82789 118.37174-89.33023 54.12578-133.51903 129.93556-132.63966 227.18753.8061 75.75115 28.28668 138.78795 82.2952 188.8393 24.47603 23.23022 51.81008 41.18421 82.22186 53.93522-6.59525 19.12648-13.557 37.44688-20.95846 55.03446zM749.96366 23.751237c0 59.37343-21.69138 114.810233-64.92748 166.121963-52.17652 60.99961-115.28658 96.24803-183.72426 90.68597-.87204-7.12298-1.37769-14.61967-1.37769-22.49743 0-56.99843 24.81315-117.99801 68.87738-167.873453 21.99909-25.25281 49.978-46.25018 83.90738-63.00018 33.85608-16.50008 65.88014-25.6249796 95.99884-27.18757966.87944 7.93730006 1.24583 15.87509966 1.24583 23.74993966z" />
|
||||
</svg>
|
||||
MacOS (not supported)
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<p style="color: #727272;" class="pt-6 max-w-lg mx-auto text-center font-medium text-sm">
|
||||
View guide and status for <a class="link" href="{{ site.docs_install_windows_url }}">Windows 7, 8</a> or <a class="link" href="{{ site.docs_install_linux_url }}">other Linux 2.4+ distributions</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: Portmaster is in active development</span>
|
||||
</div>
|
||||
</div>
|
||||
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||
Set Global & per‑App Settings
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Make your own rules. Completely cut off applications from the
|
||||
Internet. Or block all p2p connections except for certain apps.
|
||||
Or never connect to specific countries. The Portmaster has you
|
||||
covered.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="mb-16 lg:pb-32" id="faq">
|
||||
<div class="bg-white">
|
||||
<div class="max-w-screen-xl mx-auto pt-12 pb-16 sm:pt-16 sm:pb-20 px-4 sm:px-6 lg:pt-20 lg:pb-28 lg:px-8">
|
||||
<div class="text-center pb-12">
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
||||
FAQ
|
||||
<div class="download-container" id="download">
|
||||
<h2 class="download-container-title" id="downloads">
|
||||
Download
|
||||
</h2>
|
||||
<div class="alert-primary max-w-3xl mx-auto">
|
||||
<i class="icon-twitter text-xs"></i>
|
||||
<span>Portmaster is Alpha Software, treat as such; expect bugs here and there. Early Adopters welcome.</span>
|
||||
</div>
|
||||
<div class="col-container-center w-full md:w-max text-center md:text-left">
|
||||
<a class="btn-secondary" href="{{ site.download_windows_url }}"><i class="icon-windows text-md mr-2"></i>Windows 10 + 11</a>
|
||||
<a class="btn-secondary" href="{{ site.download_linux_deb_url }}"><i class="icon-ubuntu text-md mr-2"></i>Ubuntu</a>
|
||||
<a class="btn-secondary" href="{{ site.download_linux_rpm_url }}"><i class="icon-fedora text-md mr-2"></i>Fedora</a>
|
||||
<a disabled class="btn"><i class="icon-mac text-md mr-2"></i>Macos (Not supported)</a>
|
||||
</div>
|
||||
<p class="download-container-extra">
|
||||
View guide and status for <a class="link-primary" href="{{ site.docs_install_windows_url }}">Windows 7, 8</a> or <a class="link-primary" href="{{ site.docs_install_linux_url }}">other Linux 2.4+ distributions</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="faq-container">
|
||||
<div class="faq-container-top">
|
||||
<h2 class="faq-container-top-title">
|
||||
FAQ
|
||||
</h2>
|
||||
<p class="text-md opacity-55">
|
||||
You have a question? We answered some already, but you can always contact us at <a href="mailto:hello@safing.io">hello@safing.io</a>
|
||||
<p class="faq-container-top-desc">
|
||||
You have a question? We answered some already, but you
|
||||
can always contact us at <a class="link-primary" href="mailto:hello@safing.io">hello@safing.io</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="mt-6 pt-10 text-center md:text-left">
|
||||
<dl class="md:grid md:grid-cols-2 md:gap-8">
|
||||
{% for faq in site.data.faq.portmaster %}
|
||||
<div>
|
||||
<h1 class="text-xl pb-4">
|
||||
{{ faq.q }}
|
||||
</h1>
|
||||
<dd class="mt-2">
|
||||
<p class="text-md opacity-55">
|
||||
{{ faq.a }}
|
||||
</p>
|
||||
</dd>
|
||||
{% if faq.link %}
|
||||
<p class="text-md pt-4" style="color: #727272;">
|
||||
<a class="link" href="{{ faq.link.url }}">
|
||||
{{ faq.link.text }}
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div>
|
||||
<h1 class="text-xl pb-4">Where can I find your source code?</h1>
|
||||
<dd class="mt-2">
|
||||
<p class="text-md" style="color: #727272;">
|
||||
You can find our code on <a href="{{ site.github_url }}" class="link">Github</a>. <a href="{{ site.github_url }}/portmaster/" class="link">The Portmaster</a>, the <a href="{{ site.github_url }}/portmaster-ui/" class="link">Portmaster UI</a>, the <a href="{{ site.github_url }}/spn/" class="link">SPN</a>, the <a href="{{ site.github_url }}/docs/" class="link">docs</a> and <a href="{{ site.github_url }}/web/" class="link">this website</a> have their respective repositories. <a href="{{ site.github_url }}/jess/" class="link">Jess</a>, the heart of the SPN, which got <a href="https://cure53.de/pentest-report_safing-jess.pdf">audited by Cure53</a>, can also be found online.
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-container-bottom">
|
||||
{% for faq in site.data.faq.portmaster %}
|
||||
<div class="faq-container-bottom-question">
|
||||
<div class="card-faq hover-scale-out">
|
||||
<label class="card-label" for="card-toggle-anchor-{{ forloop.index }}">
|
||||
<div class="wrapper-left">
|
||||
<div class="card-title">
|
||||
<h3 class="title">
|
||||
{{ faq.q }}
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wrapper-right">
|
||||
<i class="icon-arrow"></i>
|
||||
</div>
|
||||
</label>
|
||||
<input class="card-input-toggle" id="card-toggle-anchor-{{ forloop.index }}" type="checkbox">
|
||||
<div class="card-dropdown-toggle">
|
||||
<div class="card-dropdown-content">
|
||||
<div class="text-safing-gray-500">
|
||||
{{ faq.a }}
|
||||
</div>
|
||||
{% if faq.link %}
|
||||
<br>
|
||||
<br>
|
||||
<a class="link-primary" href="{{ faq.link.url }}">{{ faq.link.text }}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% include source_code_faq.html %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
layout: page_container
|
||||
layout: legal_container
|
||||
title: Privacy Policy
|
||||
heading: Privacy Policy
|
||||
---
|
||||
|
|
|
@ -1,76 +0,0 @@
|
|||
---
|
||||
title: Safing Ownership
|
||||
layout: page
|
||||
---
|
||||
|
||||
<section id="page-container" class="pb-8 lg:pb-24 pt-16 lg:pt-40 ">
|
||||
<div class="items-center h-full">
|
||||
<div class="container mx-auto px-0 sm:px-0 flex">
|
||||
<div class="max-w-screen-lg mx-auto px-0 sm:px-6 lg:flex">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-2 sm:px-6 lg:px-8">
|
||||
<content>
|
||||
<div class="text-center">
|
||||
<h1 class="text-5xl tracking-tight font-extrabold leading-none pb-5 pt-10 text-center">Community Progress Update</h1>
|
||||
<p>July 7, 2020</p>
|
||||
<div class="flex mx-auto justify-center pt-5">
|
||||
<a href="https://twitter.com/SafingIO" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
||||
<img style="height: 1.1rem; width: auto;" src="/assets/img/icons/twitter.svg">
|
||||
</a>
|
||||
<a href="https://github.com/safing" 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="/assets/img/icons/github.svg">
|
||||
</a>
|
||||
<a href="https://reddit.com/r/safing" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
||||
<img style="height: 1.18rem; width: auto;" src="/assets/img/icons/reddit.svg">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-24">
|
||||
{% if site.data.next.cards.done.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Completed</h3>
|
||||
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
||||
</div>
|
||||
<div class="pt-10 blogwrapper">
|
||||
{% for card in site.data.next.cards.done %}
|
||||
{% include project_tablecard.html state = 'done' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if site.data.next.cards.in_progress.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >In Progress</h3>
|
||||
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
||||
</div>
|
||||
<div class="pt-10">
|
||||
{% for card in site.data.next.cards.in_progress %}
|
||||
{% include project_tablecard.html state = 'in_progress' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if site.data.next.cards.discarded.size > 0 %}
|
||||
<div class="pt-12">
|
||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||
<h3 >Discarded</h3>
|
||||
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
||||
</div>
|
||||
<div class="pt-10">
|
||||
{% for card in site.data.next.cards.discarded %}
|
||||
{% include project_tablecard.html state = 'discarded' %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</content>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
521
spn/index.html
521
spn/index.html
|
@ -3,315 +3,258 @@ title: Safing Privacy Network
|
|||
layout: page
|
||||
---
|
||||
|
||||
<div class="notification w-full text-center text-white p-2" style="background-color: #6188ff;">
|
||||
<div class="mx-auto flex">
|
||||
<!-- use this disclaimer after the free month
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="ml-auto h-4 w-4 self-center mr-2">
|
||||
<div class="mr-auto">
|
||||
<span class="w-auto text-sm">SPN is in Alpha - expect hiccups here and there, even as a customer.</span>
|
||||
</div>
|
||||
-->
|
||||
<div class="mx-auto">
|
||||
<a data-method="get" href="{{ site.spn_alpha_status_page_url }}">
|
||||
<span class="w-auto text-sm">
|
||||
SPN is in "Alpha". View
|
||||
<span class="underline">what to expect</span>
|
||||
from current speeds and features
|
||||
<div class="alert-primary rounded-none text-md">
|
||||
<i class="icon-info text-md"></i>
|
||||
<a data-method="get" href="https://docs.safing.io/spn/alpha/status">
|
||||
<span>
|
||||
SPN is in "Alpha". View
|
||||
<span class="underline">what to expect</span>
|
||||
from current speeds and features
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<header class="h-full">
|
||||
<div class="flex items-center h-full pt-20 md:pt-32 md:pb-40">
|
||||
<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:flex">
|
||||
<div class="lg:pb-0 m0-0 lg:mr-40 self-center">
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -5rem; margin-left: 6rem; z-index: -1;" class="absolute transform scale-50 lg:scale-125">
|
||||
<img src="{{ site.img_url }}shapes/circle-md.png" alt="">
|
||||
</span>
|
||||
<video style="box-shadow: 0 0px 90px 0 rgba(59, 93, 199, 0.3), 0 0px 5px 0 rgba(0, 0, 0, 0.05);" class="z-30 rounded-md max-w-full max-h-auto transform scale-70" height="1220" width="1220" playsinline="" preload="auto" src="{{ site.assets_server_url }}spn/feature-tour.mp4" poster="{{ site.assets_server_url }}spn/feature-tour-poster.png"
|
||||
controls></video>
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -4.5rem; margin-left: -3rem; z-index: -1;" class="absolute transform scale-50 lg:scale-125">
|
||||
<img src="{{ site.img_url }}shapes/circle-sm.png" alt="">
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div class="inline-block text-center md:text-left">
|
||||
<h2 class="text-6xl tracking-tight font-extrabold leading-none py-10 lg:w-3/4">
|
||||
<!-- the is super nice for bigger screens, but breaks stuff on mobile -->
|
||||
<!-- hence, we only have the header with on md+ devices -->
|
||||
<span class="block md:hidden">Safing Privacy Network</span>
|
||||
<span class="hidden md:block">Safing Privacy Network</span>
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-4xl">
|
||||
With the SPN you protect all your connections from mass surveillance. Prevent all Internet Service Providers from collecting and selling your private activities.
|
||||
</p>
|
||||
<div class="py-10 sm:py-10 md:flex text-center">
|
||||
<a href="#pricing">
|
||||
<button type="button" style="background-color: #6188ff;" class="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 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 active:bg-indigo-700 transition duration-150 ease-in-out uppercase">
|
||||
Get Started
|
||||
</button>
|
||||
</a>
|
||||
<br>
|
||||
<a href="{{ site.portmaster_url }}" class="transition duration-150 ease-in-out hover:opacity-100 self-center md:pl-8 uppercase opacity-55 text-xs font-bold">Built into the Portmaster</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<header class="header-one-container-reverse mb-64 mt-36">
|
||||
<div class="header-one-left pl-12">
|
||||
<h1 class="header-one-left-title lg:max-w-md">
|
||||
Safing Privacy Network
|
||||
</h1>
|
||||
<p class="header-one-left-desc">
|
||||
With the SPN you protect all your connections from mass
|
||||
surveillance. Prevent all Internet Service Providers
|
||||
from collecting and selling your private activities.
|
||||
</p>
|
||||
<div class="col-container w-full text-center lg:w-max lg:text-left">
|
||||
<a class="btn-primary" href="#pricing">Get started</a>
|
||||
<a class="btn-tertiary" href="{{ site.portmaster_url }}">Built into the Portmaster</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-one-right">
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -5rem; margin-left: 6rem; z-index: -1;" class="absolute transform scale-50 lg:scale-125">
|
||||
<img src="{{ site.img_url }}shapes/circle-md.png" alt="">
|
||||
</span>
|
||||
<div class="card">
|
||||
<div class="rounded-2xl overflow-hidden">
|
||||
<video class="max-w-2xl" preload="auto"
|
||||
src="{{ site.assets_server_url }}spn/feature-tour.mp4"
|
||||
poster="{{ site.assets_server_url }}spn/feature-tour-poster.png"
|
||||
controls>
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -4.5rem; margin-left: -3rem; z-index: -1;" class="absolute transform scale-50 lg:scale-125">
|
||||
<img src="{{ site.img_url }}shapes/circle-sm.png" alt="">
|
||||
</span>
|
||||
</div>
|
||||
</header>
|
||||
<section style="margin-top: 3rem;">
|
||||
<div class="text-center pb-24 lg:pb-48">
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 mr-auto ml-auto">
|
||||
Protect Your Meta‑Data
|
||||
</h2>
|
||||
<p class="text-md opacity-55 w-auto mx-auto max-w-lg">
|
||||
Seek true privacy. Do not overlook meta-data: which websites you visit and how frequently tell more about you than knowing what you actually do on them.
|
||||
</p>
|
||||
</div>
|
||||
<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 items-center">
|
||||
<div class="lg:pb-0 m0-0 lg:mr-48 self-center">
|
||||
<img src="{{ site.img_url }}page-specific/spn/layers.gif" alt="">
|
||||
</div>
|
||||
<div class="inline-block max-w-lg">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: the SPN is in active development
|
||||
</div>
|
||||
<h2 style="max-width: 470px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none py-10 lg:w-2/3">
|
||||
Onion Layer Encryption
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Re-route all your connections through our multi-hop network to decouple your identity from the destination. With onion-encryption, no single party knows who you are and where you are going to. Inspired by Tor.
|
||||
</p>
|
||||
<div class="py-10 flex">
|
||||
<a href="{{ site.blog_url }}2020/01/22/how-the-spn-compares-to-tor/">
|
||||
<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">
|
||||
Compare the SPN to TOR
|
||||
</button>
|
||||
<a href="{{ site.img_url }}spn-labeled/spn-core.png" class="transition duration-150 ease-in-out hover:opacity-100 self-center md:pl-8 uppercase opacity-55 text-xs font-bold">
|
||||
View explainer-image
|
||||
</a>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="general-layout">
|
||||
<div class="intro-container mt-32">
|
||||
<h2 class="intro-container-title">
|
||||
Protect Your Meta‑Data
|
||||
</h2>
|
||||
<p class="intro-container-desc">
|
||||
Seek true privacy. Do not overlook meta-data: which websites
|
||||
you visit and how frequently tell more about you than knowing
|
||||
what you actually do on them.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="items-center h-full mt-32 lg: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="ml-0 lg:ml-32 lg:hidden self-center">
|
||||
<img src="{{ site.img_url }}page-specific/spn/metadata.gif" alt="">
|
||||
<div class="space-y-80">
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/spn/layers.gif" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: the SPN is in active development </span>
|
||||
</div>
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Onion Layer Encryption
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Re-route all your connections through our multi-hop network
|
||||
to decouple your identity from the destination. With onion-
|
||||
encryption, no single party knows who you are and where you
|
||||
are going to. Inspired by Tor.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.blog_url }}2020/01/22/how-the-spn-compares-to-tor/">Compare the SPN to Tor</a>
|
||||
<a class="btn-tertiary hover-opacity-out" href="{{ site.img_url }}spn-labeled/spn-core.png">
|
||||
View explainer-image
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="inline-block max-w-lg">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: the SPN is in active development
|
||||
</div>
|
||||
<h2 style="max-width: 470px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold py-10 lg:w-auto">
|
||||
Minimize Your Meta‑Data
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
With the SPN, your meta-data is stripped to a minimum. Abstracting even the size of outgoing packets to diminish what information third parties, like your ISP or the Wi-Fi operator of your local coffee place, can gather about you.
|
||||
</p>
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/spn/metadata.gif" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: the SPN is in active development </span>
|
||||
</div>
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Minimize Your Meta‑Data
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
With the SPN, your meta-data is stripped to a minimum.
|
||||
Abstracting even the size of outgoing packets to diminish
|
||||
what information third parties, like your ISP or the Wi-Fi
|
||||
operator of your local coffee place, can gather about you.
|
||||
</p>
|
||||
</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/spn/metadata.gif" alt="">
|
||||
<div class="showcase-container-reverse">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/spn/network.png" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: the SPN is in active development </span>
|
||||
</div>
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
Distributed Multi Identity Network
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Instead of exiting all your traffic at one place, route every
|
||||
connection individually to spread your connections across the
|
||||
globe. Use vast amounts of identities (IP addresses) and limit
|
||||
your visibility in the "open" web.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.blog_url }}2020/01/22/how-the-spn-compares-to-vpns/">
|
||||
Compare the SPN to VPNs
|
||||
</a>
|
||||
<a class="btn-tertiary hover-opacity-out" href="{{ site.img_url }}spn-labeled/spn-community.png">
|
||||
View explainer-image
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="items-center h-full mt-32 lg: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 items-center">
|
||||
<div class="ml-0 lg:ml-32 lg:hidden self-center">
|
||||
<img src="{{ site.img_url }}page-specific/spn/network.png" alt="">
|
||||
<div class="showcase-container">
|
||||
<div class="showcase-left" style="max-width: 850px;">
|
||||
<img src="{{ site.img_url }}page-specific/spn/switch.gif" alt="">
|
||||
</div>
|
||||
<div class="showcase-right">
|
||||
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>Alpha Software: the SPN is in active development </span>
|
||||
</div>
|
||||
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||
No Kill Switch Needed
|
||||
</h2>
|
||||
<p class="showcase-right-desc">
|
||||
Get peace of mind instead of fearing data-leakage.
|
||||
<br>
|
||||
<br>
|
||||
With the open source Portmaster, all your network connections are
|
||||
intercepted at the kernel-level, putting an end to accidental data
|
||||
exposure.
|
||||
</p>
|
||||
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="inline-block max-w-lg">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: the SPN is in active development
|
||||
</div>
|
||||
<h2 style="max-width: 470px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none py-10">
|
||||
Distributed Multi Identity Network
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Instead of exiting all your traffic at one place, route every connection individually to spread your connections across the globe. Use vast amounts of identities (IP addresses) and limit your visibility in the "open" web.
|
||||
</p>
|
||||
<div class="py-10 flex">
|
||||
<a href="{{ site.blog_url }}2020/01/22/how-the-spn-compares-to-vpns/">
|
||||
<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">
|
||||
Compare the SPN to VPNs
|
||||
</button>
|
||||
<a href="{{ site.img_url }}spn-labeled/spn-community.png" class="transition duration-150 ease-in-out hover:opacity-100 self-center md:pl-8 uppercase opacity-55 text-xs font-bold">
|
||||
View explainer-image
|
||||
</a>
|
||||
</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/spn/network.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="items-center h-full mt-32 lg: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 items-center">
|
||||
<div class="lg:pb-0 m0-0 lg:mr-48 self-center">
|
||||
<img src="{{ site.img_url }}page-specific/spn/switch.gif" alt="">
|
||||
</div>
|
||||
<div class="inline-block max-w-lg">
|
||||
<div class="pt-1 pb-1 pr-4 pl-2 rounded-full text-white text-xs flex break-words" style="background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Alpha Software: the SPN is in active development
|
||||
</div>
|
||||
<h2 style="max-width: 470px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none py-10 lg:w-2/3">
|
||||
No Kill Switch Needed
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-lg">
|
||||
Get peace of mind instead of fearing data-leakage.
|
||||
</p>
|
||||
<p class="text-md opacity-55 max-w-lg pt-4">
|
||||
With the open source Portmaster, all your network connections are intercepted at the kernel-level, putting an end to accidental data exposure.
|
||||
</p>
|
||||
<div class="py-10 flex">
|
||||
<a href="{{ site.portmaster_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">
|
||||
Discover the Portmaster
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="mt-16 lg:mt-48">
|
||||
<div class="items-center h-full">
|
||||
<div>
|
||||
<div class="max-w-full mx-auto px-4 sm:px-6" id="pricing">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center">
|
||||
<div class="packages-container" id="pricing">
|
||||
<div class="alert-primary mb-20">
|
||||
<a data-method="get" href="{{ site.spn_alpha_status_page_url }}">
|
||||
<button class="w-full h-auto md:h-12 text-sm md:text-md rounded-lg text-center p-3 transform hover:scale-105 duration-150 ease-in-out text-white pointer-cursor" style="background-color: #436ded; margin-bottom: 4em;">
|
||||
<span>
|
||||
SPN is in "Alpha". View
|
||||
<span class="underline">what to expect</span>
|
||||
from current speeds and features
|
||||
</button>
|
||||
</span>
|
||||
</a>
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none px-10 py-6 text-center">
|
||||
Protect Your Connections Today
|
||||
</h2>
|
||||
<p class="text-md opacity-55 pb-8">
|
||||
Subscribe to the SPN and lock in the lower Alpha prices forever.
|
||||
</p>
|
||||
</div>
|
||||
<div class="">
|
||||
<ul class="md:grid md:grid-cols-2 lg:grid-cols-2 md:col-gap-8 md:row-gap-10 max-w-4xl mr-auto ml-auto">
|
||||
<li class="text-center md:text-left">
|
||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover px-16 py-10 rounded-lg">
|
||||
<span class="text-2xl">Early Adopter Monthly</span>
|
||||
<div class="block pb-6">
|
||||
<h1 style="font-size: 3.5rem;" class="font-extrabold pt-6">9.90€ <span class="opacity-55" style="font-size: 1.1rem; font-weight: 500;">/ per month</span></h1>
|
||||
<span class="text-xl pl-1 opacity-55 line-through">11.90€</span>
|
||||
</div>
|
||||
<span class="font-extrabold pt-10 text-md">Includes:</span>
|
||||
<ul class="">
|
||||
<li class="pt-4 opacity-55">Access to the SPN</li>
|
||||
<li class="pt-4 opacity-55">Unlimited Bandwidth</li>
|
||||
<li class="pt-4 opacity-55">Use on up to 5 devices</li>
|
||||
<li class="pt-4 opacity-55">17% off compared to Beta-Prices</li>
|
||||
</ul>
|
||||
<div class="pt-16">
|
||||
<a href="{{ site.account_server_url }}plans/1/subscribe">
|
||||
<button type="button" style="background-color: #000;" class="w-full text-center items-center px-10 py-3 border border-transparent text-xs leading-5 font-extrabold rounded-full text-white transition duration-150 ease-in-out uppercase">
|
||||
Subscribe
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="mt-10 md:mt-0 text-center md:text-left">
|
||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover px-16 py-10 rounded-lg">
|
||||
<span class="text-2xl">Early Adopter Yearly</span>
|
||||
<div class="block pb-6">
|
||||
<h1 style="font-size: 3.5rem;" class="font-extrabold pt-6">99.00€ <span class="opacity-55" style="font-size: 1.1rem; font-weight: 500;">/ per year</span></h1>
|
||||
<span class="text-xl pl-1 opacity-55 line-through">142.80€</span>
|
||||
</div>
|
||||
<span class="font-extrabold pt-10 text-md">Includes:</span>
|
||||
<ul>
|
||||
<li class="pt-4 opacity-55">Access to the SPN</li>
|
||||
<li class="pt-4 opacity-55">Unlimited Bandwidth</li>
|
||||
<li class="pt-4 opacity-55">Use on up to 5 devices</li>
|
||||
<li class="pt-4 opacity-55">30% off compared to Beta-Prices</li>
|
||||
</ul>
|
||||
<div class="pt-16">
|
||||
<a href="{{ site.account_server_url }}plans/2/subscribe">
|
||||
<button type="button" style="background-color: #000;" class="w-full text-center items-center px-10 py-3 border border-transparent text-xs leading-5 font-extrabold rounded-full text-white transition duration-150 ease-in-out uppercase">
|
||||
Subscribe
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="packages-container-top">
|
||||
<h2 class="packages-container-top-title">
|
||||
Protect Your Connections Today
|
||||
</h2>
|
||||
<p class="packages-container-top-desc">
|
||||
Subscribe to the SPN and lock in the lower Alpha prices forever.
|
||||
</p>
|
||||
</div>
|
||||
<div class="packages-container-bottom">
|
||||
<div class="card-package">
|
||||
<div class="card-package-top">
|
||||
<span class="card-package-top-title">Early Adopter Monthly</span>
|
||||
<span class="card-package-top-amount">
|
||||
9.90€ <span class="billing">/ per month</span>
|
||||
</span>
|
||||
<span class="card-package-top-offer">11.90€</span>
|
||||
</div>
|
||||
<div class="card-package-middle space-y-4">
|
||||
<span class="card-package-middle-includes"> Includes: </span>
|
||||
<span class="card-package-middle-includes-feature"> Access to the SPN </span>
|
||||
<span class="card-package-middle-includes-feature"> Unlimited Bandwidth </span>
|
||||
<span class="card-package-middle-includes-feature"> Use on up to 5 devices </span>
|
||||
<span class="card-package-middle-includes-feature"> 17% off compared to Beta-Prices </span>
|
||||
</div>
|
||||
<div class="card-package-bottom">
|
||||
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/1/subscribe">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-package">
|
||||
<div class="card-package-top">
|
||||
<span class="card-package-top-title">Early Adopter Yearly</span>
|
||||
<span class="card-package-top-amount">
|
||||
99.00€ <span class="billing">/ per year</span>
|
||||
</span>
|
||||
<span class="card-package-top-offer">142.80</span>
|
||||
</div>
|
||||
<div class="card-package-middle space-y-4">
|
||||
<span class="card-package-middle-includes"> Includes: </span>
|
||||
<span class="card-package-middle-includes-feature"> Access to the SPN </span>
|
||||
<span class="card-package-middle-includes-feature"> Unlimited Bandwidth </span>
|
||||
<span class="card-package-middle-includes-feature"> Use on up to 5 devices </span>
|
||||
<span class="card-package-middle-includes-feature"> 30% off compared to Beta-Prices </span>
|
||||
</div>
|
||||
<div class="card-package-bottom">
|
||||
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/2/subscribe">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="mb-16 lg:pb-32" id="faq">
|
||||
<div class="bg-white">
|
||||
<div class="max-w-screen-xl mx-auto pt-12 pb-16 sm:pt-16 sm:pb-20 px-4 sm:px-6 lg:pt-20 lg:pb-28 lg:px-8">
|
||||
<div class="text-center pb-12">
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
||||
FAQ
|
||||
</h2>
|
||||
<p class="text-md opacity-55">
|
||||
You have a question? We answered some already, but you can always contact us at <a href="mailto:hello@safing.io">hello@safing.io</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="mt-6 pt-10 text-center md:text-left">
|
||||
<dl class="md:grid md:grid-cols-2 md:gap-8">
|
||||
{% for faq in site.data.faq.spn %}
|
||||
<div>
|
||||
<h1 class="text-xl pb-4">
|
||||
{{ faq.q }}
|
||||
</h1>
|
||||
<dd class="mt-2">
|
||||
<p class="text-md opacity-55">
|
||||
{{ faq.a }}
|
||||
<div class="faq-container">
|
||||
<div class="faq-container-top">
|
||||
<h2 class="faq-container-top-title">
|
||||
FAQ
|
||||
</h2>
|
||||
<p class="faq-container-top-desc">
|
||||
You have a question? We answered some already, but you
|
||||
can always contact us at <a class="link-primary" href="mailto:hello@safing.io">hello@safing.io</a>
|
||||
</p>
|
||||
</dd>
|
||||
{% if faq.link %}
|
||||
<p class="text-md pt-4" style="color: #727272;">
|
||||
<a class="link" href="{{ faq.link.url }}">
|
||||
{{ faq.link.text }}
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div>
|
||||
<h1 class="text-xl pb-4">Where can I find your source code?</h1>
|
||||
<dd class="mt-2">
|
||||
<p class="text-md" style="color: #727272;">
|
||||
You can find our code on <a href="{{ site.github_url }}" class="link">Github</a>. <a href="{{ site.github_url }}/portmaster/" class="link">The Portmaster</a>, the <a href="{{ site.github_url }}/portmaster-ui/" class="link">Portmaster UI</a>, the <a href="{{ site.github_url }}/spn/" class="link">SPN</a>, the <a href="{{ site.github_url }}/docs/" class="link">docs</a> and <a href="{{ site.github_url }}/web/" class="link">this website</a> have their respective repositories. <a href="{{ site.github_url }}/jess/" class="link">Jess</a>, the heart of the SPN, which got <a href="https://cure53.de/pentest-report_safing-jess.pdf">audited by Cure53</a>, can also be found online.
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="faq-container-bottom">
|
||||
{% for faq in site.data.faq.spn %}
|
||||
<div class="faq-container-bottom-question">
|
||||
<div class="card-faq hover-scale-out">
|
||||
<label class="card-label" for="card-toggle-anchor-{{ forloop.index }}">
|
||||
<div class="wrapper-left">
|
||||
<div class="card-title">
|
||||
<h3 class="title">
|
||||
{{ faq.q }}
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wrapper-right">
|
||||
<i class="icon-arrow"></i>
|
||||
</div>
|
||||
</label>
|
||||
<input class="card-input-toggle" id="card-toggle-anchor-{{ forloop.index }}" type="checkbox">
|
||||
<div class="card-dropdown-toggle">
|
||||
<div class="card-dropdown-content">
|
||||
<div class="text-safing-gray-500">
|
||||
{{ faq.a }}
|
||||
</div>
|
||||
{% if faq.link %}
|
||||
<br>
|
||||
<br>
|
||||
<a class="link-primary" href="{{ faq.link.url }}">{{ faq.link.text }}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% include source_code_faq.html %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -3,219 +3,159 @@ title: Get Help
|
|||
layout: page
|
||||
---
|
||||
|
||||
<header class="h-full py-40">
|
||||
<div class="flex items-center">
|
||||
<div class="container mx-auto px-8 sm:px-0">
|
||||
<div class="text-center">
|
||||
<h2 class="text-5xl sm:text-6xl tracking-tight font-extrabold leading-none py-10">
|
||||
Support
|
||||
|
||||
<section class="general-layout">
|
||||
<div class="download-container">
|
||||
<h1 class="download-container-title">Support</h1>
|
||||
<p class="download-container-extra">
|
||||
What do you need help with?
|
||||
</p>
|
||||
<div class="col-container-center w-full md:w-max text-center md:text-left">
|
||||
<a class="btn-secondary" href="#portmaster">Portmaster</a>
|
||||
<a class="btn-secondary" href="#spn">SPN</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="space-y-36" id="portmaster">
|
||||
<div class="download-container">
|
||||
<h2 class="download-container-title">
|
||||
Portmaster
|
||||
</h2>
|
||||
<div class="self-center">
|
||||
<p class="text-md opacity-55 max-w-lg mx-auto">
|
||||
What do you need help with?
|
||||
<div class="space-y-8 max-w-3xl mx-auto">
|
||||
<p class="download-container-extra">
|
||||
For common problems check out our documentation with extensive guides on
|
||||
installation, DNS Configuration and the Settings Handbook, describing every
|
||||
Portmaster setting in detail. Report issues and bugs on GitHub while you can
|
||||
always ask for more help on our subreddit or via mail.
|
||||
</p>
|
||||
<div class="py-10 sm:py-16 block ">
|
||||
<a href="#portmaster">
|
||||
<button type="button" style="background-color: #000;" class=" mb-5 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">
|
||||
Portmaster
|
||||
</button>
|
||||
</a>
|
||||
<br>
|
||||
<a href="#spn">
|
||||
<button type="button" style="background-color: #000;" class="mb-5 transform hover:scale-95 inline-flex items-center px-16 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">
|
||||
Spn
|
||||
</button>
|
||||
</a>
|
||||
<div class="alert-primary">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span> Portmaster is Alpha Software, thanks for being an Early Adopter. Bug reports are appreciated.</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-container-center w-full md:w-max text-center md:text-left">
|
||||
<a class="btn-secondary" href="{{ site.docs_url }}"">
|
||||
View Documentation
|
||||
</a>
|
||||
<a href="{{ site.docs_url }}portmaster/guides/contribute#report-bugs-suggest-features-and-improvements" class="btn-secondary"">
|
||||
Report Issue
|
||||
</a>
|
||||
<a class="btn-secondary" href="{{ site.reddit_url }}"">
|
||||
Ask On Reddit
|
||||
</a>
|
||||
<a class="btn-secondary" href="mailto:support@safing.io"">
|
||||
Contact us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="mb-10 md:mb-20 lg:mb-40" id="portmaster">
|
||||
<div class="items-center h-full">
|
||||
<div class="max-w-full mx-auto px-4 sm:px-6">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center">
|
||||
<h2 id="downloads" class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
||||
Portmaster
|
||||
<div class="faq-container">
|
||||
<div class="faq-container-top">
|
||||
<h2 class="faq-container-top-title">
|
||||
FAQ
|
||||
</h2>
|
||||
<p class="text-md opacity-55 max-w-screen-sm mx-auto">
|
||||
For common problems check out our documentation with extensive guides on installation, DNS Configuration and the Settings Handbook, describing every Portmaster setting in detail. Report issues and bugs on GitHub while you can always ask for more help on our subreddit or via mail.
|
||||
<p class="faq-container-top-desc">
|
||||
Have a question? Check out some we already answered below. You can always reach out to us to find out more or just to say hi.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<div class="mx-auto p-5 pl-5 rounded-md text-white flex break-words items-center mt-16 mb-16" style="font-size: .85rem; background-color: #5c85ff; width: fit-content; width: -moz-fit-content;">
|
||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
||||
Portmaster is Alpha Software, thanks for being an Early Adopter. Bug reports are appreciated.
|
||||
</div>
|
||||
<div class="py-5 block grid lg:flex lg:grid-cols-3 gap-10 justify-center ">
|
||||
<a href="{{ site.docs_url }}" class="flex items-center mx-auto text-center">
|
||||
<button type="button" style="background-color: #000;" class="transform hover:scale-95 hover:opacity-100 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 Documentation
|
||||
</button>
|
||||
</a>
|
||||
<a href="{{ site.docs_url }}portmaster/guides/contribute#report-bugs-suggest-features-and-improvements" class="flex items-center mx-auto text-center">
|
||||
<button type="button" style="background-color: #000;" class="transform hover:scale-95 hover:opacity-100 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">
|
||||
Report Issue
|
||||
</button>
|
||||
</a>
|
||||
<a href="{{ site.reddit_url }}" class="flex items-center mx-auto text-center">
|
||||
<button type="button" style="background-color: #000;" class="lg:ml-3 lg:mr-3 transform hover:scale-95 hover:opacity-100 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">
|
||||
Ask On Reddit
|
||||
</button>
|
||||
</a>
|
||||
<a href="mailto:support@safing.io" class="flex items-center mx-auto text-center">
|
||||
<button type="button" style="background-color: #000;" class="lg:ml-3 lg:mr-3 transform hover:scale-95 hover:opacity-100 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">
|
||||
Contact us
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white" id="portmaster-faq">
|
||||
<div class="max-w-screen-xl mx-auto md:pt-12 lg:pt-20 pb-16 sm:pb-20 px-4 sm:px-6 lg:pb-28 lg:px-8">
|
||||
<div class="text-center pb-12">
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
||||
FAQ
|
||||
</h2>
|
||||
<p class="text-md opacity-55">
|
||||
Have a question? Check out some we already answered below. You can always reach out to us to find out more or just to say hi.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mt-6 pt-10 text-center md:text-left">
|
||||
<dl class="md:grid md:grid-cols-2 md:gap-8">
|
||||
<div class="faq-container-bottom">
|
||||
{% for faq in site.data.faq.portmaster %}
|
||||
<div>
|
||||
<h1 class="text-xl pb-4">
|
||||
{{ faq.q }}
|
||||
</h1>
|
||||
<dd class="mt-2">
|
||||
<p class="text-md opacity-55">
|
||||
{{ faq.a }}
|
||||
</p>
|
||||
</dd>
|
||||
{% if faq.link %}
|
||||
<p class="text-md pt-4" style="color: #727272;">
|
||||
<a class="link" href="{{ faq.link.url }}">
|
||||
{{ faq.link.text }}
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
<div class="faq-container-bottom-question">
|
||||
<div class="card-faq hover-scale-out">
|
||||
<label class="card-label" for="card-toggle-anchor-portmaster-{{ forloop.index }}">
|
||||
<div class="wrapper-left">
|
||||
<div class="card-title">
|
||||
<h3 class="title">
|
||||
{{ faq.q }}
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wrapper-right">
|
||||
<i class="icon-arrow"></i>
|
||||
</div>
|
||||
</label>
|
||||
<input class="card-input-toggle" id="card-toggle-anchor-portmaster-{{ forloop.index }}" type="checkbox">
|
||||
<div class="card-dropdown-toggle">
|
||||
<div class="card-dropdown-content">
|
||||
<div class="text-safing-gray-500">
|
||||
{{ faq.a }}
|
||||
</div>
|
||||
{% if faq.link %}
|
||||
<br>
|
||||
<br>
|
||||
<a class="link-primary" href="{{ faq.link.url }}">{{ faq.link.text }}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div>
|
||||
<h1 class="text-xl pb-4">Where can I find your source code?</h1>
|
||||
<dd class="mt-2">
|
||||
<p class="text-md" style="color: #727272;">
|
||||
You can find our code on <a href="{{ site.github_url }}" class="link">Github</a>. <a href="{{ site.github_url }}/portmaster/" class="link">The Portmaster</a>, the <a href="{{ site.github_url }}/portmaster-ui/" class="link">Portmaster UI</a>, the <a href="{{ site.github_url }}/spn/" class="link">SPN</a> and <a href="{{ site.github_url }}/web/" class="link">this website</a> have their respective repositories. <a href="{{ site.github_url }}/jess/" class="link">Jess</a>, the heart of the SPN, which got <a href="https://cure53.de/pentest-report_safing-jess.pdf">audited by Cure53</a>, can also be found online.
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
</dl>
|
||||
{% include source_code_faq.html %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="space-y-36" id="spn">
|
||||
<div class="download-container">
|
||||
<h2 class="download-container-title">
|
||||
Safing Privacy Network
|
||||
</h2>
|
||||
<div class="alert-primary max-w-3xl mx-auto">
|
||||
<i class="icon-info text-md"></i>
|
||||
<span>
|
||||
The SPN is Alpha Software, thanks for being an Early Supporter. Always feel free to reach out.
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-container-center w-full md:w-max text-center md:text-left">
|
||||
<a class="btn-secondary" href="{{ site.github_url }}/spn">
|
||||
View SPN Repository
|
||||
</a>
|
||||
<a class="btn-secondary" href="{{ site.reddit_url }}">
|
||||
Ask on Reddit
|
||||
</a>
|
||||
<a class="btn-secondary" href="mailto:support@safing.io">
|
||||
Contact us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="my-20" id="spn">
|
||||
<div class="items-center h-full">
|
||||
<div class="max-w-full mx-auto px-4 sm:px-6">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center">
|
||||
<h2 id="downloads" class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
||||
Safing Privacy Network
|
||||
</h2>
|
||||
</div>
|
||||
<div class="mx-auto text-center">
|
||||
<div class="text-center lg:text-left lg:inline-flex items-center mt-16 mb-16 spn-shadow p-10 rounded-lg">
|
||||
<div class="flex items-center justify-center pl-2 md:pl-0 h-12 md:w-12 w-auto mr-auto ml-auto">
|
||||
<svg class="h-8 w-8" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<g fill="none">
|
||||
<path d="M0 0h24v24H0z" />
|
||||
<path stroke="#ddae7b" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M12 21v0c-4.971 0-9-4.029-9-9v0c0-4.971 4.029-9 9-9v0c4.971 0 9 4.029 9 9v0c0 4.971-4.029 9-9 9z" />
|
||||
<path stroke="#ddae7b" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M12 17v-5h-1M11.749 8c-.138 0-.25.112-.249.25 0 .138.112.25.25.25s.25-.112.25-.25-.112-.25-.251-.25" />
|
||||
</g>
|
||||
</svg>
|
||||
<div class="faq-container">
|
||||
<div class="faq-container-top">
|
||||
<h2 class="faq-container-top-title">
|
||||
FAQ
|
||||
</h2>
|
||||
<p class="faq-container-top-desc">
|
||||
Have a question? Check out some we already answered below. You can always reach out to us to find out more or just to say hi.
|
||||
</p>
|
||||
</div>
|
||||
<div class="faq-container-bottom">
|
||||
{% for faq in site.data.faq.spn %}
|
||||
<div class="faq-container-bottom-question">
|
||||
<div class="card-faq hover-scale-out">
|
||||
<label class="card-label" for="card-toggle-anchor-spn-{{ forloop.index }}">
|
||||
<div class="wrapper-left">
|
||||
<div class="card-title">
|
||||
<h3 class="title">
|
||||
{{ faq.q }}
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wrapper-right">
|
||||
<i class="icon-arrow"></i>
|
||||
</div>
|
||||
</label>
|
||||
<input class="card-input-toggle" id="card-toggle-anchor-spn-{{ forloop.index }}" type="checkbox">
|
||||
<div class="card-dropdown-toggle">
|
||||
<div class="card-dropdown-content">
|
||||
<div class="text-safing-gray-500">
|
||||
{{ faq.a }}
|
||||
</div>
|
||||
{% if faq.link %}
|
||||
<br>
|
||||
<br>
|
||||
<a class="link-primary" href="{{ faq.link.url }}">{{ faq.link.text }}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="pt-5 lg:pt-0 md:pl-10 md:pr-10 text-sm opacity-75">
|
||||
If you want to know more about the technology, visit <a href="{{ site.spn_url }}" class="link">the SPN page</a>, <a href="{{ site.kickstarter_url }}" class="link">the Kickstarter</a> or read <a href="{{ site.whitepaper_url }}" class="link">our Whitepaper</a>.
|
||||
<br/>
|
||||
<br/>
|
||||
Otherwise, feel free to contact us with any matter or request you might have.
|
||||
</p>
|
||||
</div>
|
||||
<div class="py-5 block grid lg:flex lg:grid-cols-3 gap-10 justify-center">
|
||||
<a href="{{ site.github_url }}/spn" class="flex items-center mx-auto text-center">
|
||||
<button type="button" style="background-color: #000;" class="transform hover:scale-95 hover:opacity-100 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 SPN Repository
|
||||
</button>
|
||||
</a>
|
||||
<a href="{{ site.reddit_url }}" class="flex items-center mx-auto text-center">
|
||||
<button type="button" style="background-color: #000;" class="lg:ml-3 lg:mr-3 transform hover:scale-95 hover:opacity-100 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">
|
||||
Ask on Reddit
|
||||
</button>
|
||||
</a>
|
||||
<a href="mailto:support@safing.io" class="flex items-center mx-auto text-center">
|
||||
<button type="button" style="background-color: #000;" class="lg:ml-3 lg:mr-3 transform hover:scale-95 hover:opacity-100 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">
|
||||
Contact us
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white" id="spn-faq">
|
||||
<div class="max-w-screen-xl mx-auto md:pt-12 pb-16 sm:pt-16 sm:pb-20 px-4 sm:px-6 lg:pt-20 lg:pb-28 lg:px-8">
|
||||
<div class="text-center pb-12">
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
||||
FAQ
|
||||
</h2>
|
||||
<p class="text-md opacity-55">
|
||||
Have a question? Check out some we already answered below. You can always reach out to us to find out more or just to say hi.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mt-6 pt-10 text-center md:text-left">
|
||||
<dl class="md:grid md:grid-cols-2 md:gap-8">
|
||||
{% for faq in site.data.faq.spn %}
|
||||
<div>
|
||||
<h1 class="text-xl pb-4">
|
||||
{{ faq.q }}
|
||||
</h1>
|
||||
<dd class="mt-2">
|
||||
<p class="text-md opacity-55">
|
||||
{{ faq.a }}
|
||||
</p>
|
||||
</dd>
|
||||
{% if faq.link %}
|
||||
<p class="text-md pt-4" style="color: #727272;">
|
||||
<a class="link" href="{{ faq.link.url }}">
|
||||
{{ faq.link.text }}
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div>
|
||||
<h1 class="text-xl pb-4">Where can I find your source code?</h1>
|
||||
<dd class="mt-2">
|
||||
<p class="text-md" style="color: #727272;">
|
||||
You can find our code on <a href="{{ site.github_url }}" class="link">Github</a>. <a href="{{ site.github_url }}/portmaster/" class="link">The Portmaster</a>, the <a href="{{ site.github_url }}/portmaster-ui/" class="link">Portmaster UI</a>, the <a href="{{ site.github_url }}/spn/" class="link">SPN</a> and <a href="{{ site.github_url }}/web/" class="link">this website</a> have their respective repositories. <a href="{{ site.github_url }}/jess/" class="link">Jess</a>, the heart of the SPN, which got <a href="https://cure53.de/pentest-report_safing-jess.pdf">audited by Cure53</a>, can also be found online.
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% include source_code_faq.html faq_id='spn-0'%}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
143
team/index.html
143
team/index.html
|
@ -3,89 +3,72 @@ title: Team Overview
|
|||
layout: page
|
||||
---
|
||||
|
||||
<section class="my-40">
|
||||
<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">
|
||||
<div class="py-12">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="lg:text-center">
|
||||
<!-- fix this text size once we have customizable tailwind -->
|
||||
<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 overflow-x-hidden">Team</span>
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">Who We Are</h2>
|
||||
</div>
|
||||
<div class="mt-32">
|
||||
<ul class="grid grid-cols-1">
|
||||
|
||||
{% for member in site.data.team.members %}
|
||||
<li class="pb-40 lg:pb-24" id="{{ member.name | slugify }}">
|
||||
<div class="text-center lg:text-left lg:flex items-center">
|
||||
<div class="pb-8 lg:-mb-10">
|
||||
<img class="mx-auto" src="{{ site.img_url }}profiles/{{ member.name | slugify }}.png" alt="{{ member.name }}">
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -9.5rem; margin-left: 6rem; z-index: -1;" class="hidden lg:block absolute transform scale-50 lg:scale-125">
|
||||
<img src="{{ site.img_url }}shapes/square.png" alt="">
|
||||
</span>
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -9.8rem; margin-left: 2.5rem; z-index: -1;" class="lg:hidden absolute transform scale-70 lg:scale-125">
|
||||
<img src="{{ site.img_url }}shapes/square.png" alt="">
|
||||
</span>
|
||||
<div class="flex mx-auto justify-center pt-5">
|
||||
{% for handle in member.handles %}
|
||||
<a href="{{ handle.external_url }}" target="_blank" class="opacity-55 hover:opacity-100 ease-in-out duration-150 mr-4">
|
||||
<img style="height: 1.1rem; width: auto;" src="{{ site.img_url }}icons/{{ handle.icon }}.svg" />
|
||||
</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="lg:pl-16">
|
||||
<span style="color: #6188ff;" class="uppercase text-sm">{{ member.title }}</span>
|
||||
<p class="pt-1 pb-3 font-extrabold text-2xl">{{ member.name }}</p>
|
||||
<span class="opacity-55">Joined {{ member.joined }}</span>
|
||||
<p class="pt-3 text-md opacity-55 max-w-2xl">
|
||||
{{ member.description }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<div class="header-four-container mt-48">
|
||||
<span class="header-four-container-counter">Team</span>
|
||||
<h1 class="header-four-container-title">Who We Are</h1>
|
||||
</div>
|
||||
<section class="general-layout">
|
||||
<div class="space-y-28">
|
||||
<div class="space-y-40">
|
||||
{% for member in site.data.team.members %}
|
||||
<div class="team-member" id="{{ member.name | slugify }}">
|
||||
<div class="team-member-left">
|
||||
<div class="team-member-left-profile relative">
|
||||
<img src="{{ site.img_url }}profiles/{{ member.name | slugify }}.png" alt="{{ member.name }}">
|
||||
</div>
|
||||
<div class="team-member-left-scoial">
|
||||
{% for handle in member.handles %}
|
||||
<a href="{{ handle.external_url }}" target="_blank"><i class="icon-{{ handle.icon }} text-md"></i></a>
|
||||
{% endfor %}
|
||||
|
||||
<li class="mb-40 lg:mb-24 bg-black opacity-25" style="height: 2px;"></li>
|
||||
|
||||
{% for external in site.data.team.externals %}
|
||||
<li class="pb-40 lg:pb-24" id="{{ external.name | slugify }}">
|
||||
<div class="text-center lg:text-left lg:flex items-center">
|
||||
<div class="pb-8 lg:-mb-10">
|
||||
<img class="mx-auto" src="{{ site.img_url }}profiles/{{ external.name | slugify }}.png" alt="{{ external.name }}">
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -9.5rem; margin-left: 6rem; z-index: -1;" class="hidden lg:block absolute transform scale-50 lg:scale-125">
|
||||
<img src="{{ site.img_url }}shapes/square.png" alt="">
|
||||
</span>
|
||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -9.8rem; margin-left: 2.5rem; z-index: -1;" class="lg:hidden absolute transform scale-70 lg:scale-125">
|
||||
<img src="{{ site.img_url }}shapes/square.png" alt="">
|
||||
</span>
|
||||
<div class="flex mx-auto justify-center pt-5">
|
||||
{% for handle in external.handles %}
|
||||
<a href="{{ handle.external_url }}" target="_blank" class="opacity-55 hover:opacity-100 ease-in-out duration-150 mr-4">
|
||||
<img style="height: 1.1rem; width: auto;" src="{{ site.img_url }}icons/{{ handle.icon }}.svg" />
|
||||
</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="lg:pl-16">
|
||||
<span style="color: #6188ff;" class="uppercase text-sm">{{ external.title }}</span>
|
||||
<p class="pt-1 pb-3 font-extrabold text-2xl">{{ external.name }}</p>
|
||||
<span class="opacity-55">Joined {{ external.joined }}</span>
|
||||
<p class="pt-3 text-md opacity-55 max-w-2xl">
|
||||
{{ external.description }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="team-member-right">
|
||||
<span class="team-member-right-postion">
|
||||
{{ member.title }}
|
||||
</span>
|
||||
<span class="team-member-right-name">
|
||||
{{ member.name }}
|
||||
</span>
|
||||
<span class="team-member-right-date">
|
||||
Joined {{ member.joined }}
|
||||
</span>
|
||||
<p class="team-member-right-desc">
|
||||
{{ member.description }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="horizontal-line max-w-5xl mx-auto"></div>
|
||||
<div class="space-y-40">
|
||||
{% for external in site.data.team.externals %}
|
||||
<div class="team-member" id="{{ external.name | slugify }}">
|
||||
<div class="team-member-left">
|
||||
<div class="team-member-left-profile relative">
|
||||
<img src="{{ site.img_url }}profiles/{{ external.name | slugify }}.png" alt="{{ external.name }}">
|
||||
</div>
|
||||
<div class="team-member-left-scoial">
|
||||
{% for handle in external.handles %}
|
||||
<a href="{{ handle.external_url }}" target="_blank"><i class="icon-{{ handle.icon }} text-md"></i></a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="team-member-right">
|
||||
<span class="team-member-right-postion">
|
||||
{{ external.title }}
|
||||
</span>
|
||||
<span class="team-member-right-name">
|
||||
{{ external.name }}
|
||||
</span>
|
||||
<span class="team-member-right-date">
|
||||
Joined {{ external.joined }}
|
||||
</span>
|
||||
<p class="team-member-right-desc">
|
||||
{{ external.description }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
layout: page_container
|
||||
layout: legal_container
|
||||
title: Terms of Service
|
||||
heading: Terms of Service
|
||||
---
|
||||
|
|
1
vendor/css/tailwind.min.css
vendored
1
vendor/css/tailwind.min.css
vendored
File diff suppressed because one or more lines are too long
BIN
vendor/safingTailwind-1.5.zip
vendored
Normal file
BIN
vendor/safingTailwind-1.5.zip
vendored
Normal file
Binary file not shown.
9
vendor/safingTailwind/docs/css/highlight.min.css
vendored
Normal file
9
vendor/safingTailwind/docs/css/highlight.min.css
vendored
Normal file
|
@ -0,0 +1,9 @@
|
|||
/*!
|
||||
Theme: Default
|
||||
Description: Original highlight.js style
|
||||
Author: (c) Ivan Sagalaev <maniac@softwaremaniacs.org>
|
||||
Maintainer: @highlightjs/core-team
|
||||
Website: https://highlightjs.org/
|
||||
License: see project LICENSE
|
||||
Touched: 2021
|
||||
*/pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{background:#f0f0f0;color:#444}.hljs-comment{color:#888}.hljs-punctuation,.hljs-tag{color:#444a}.hljs-tag .hljs-attr,.hljs-tag .hljs-name{color:#444}.hljs-attribute,.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-name,.hljs-selector-tag{font-weight:700}.hljs-deletion,.hljs-number,.hljs-quote,.hljs-selector-class,.hljs-selector-id,.hljs-string,.hljs-template-tag,.hljs-type{color:#800}.hljs-section,.hljs-title{color:#800;font-weight:700}.hljs-link,.hljs-operator,.hljs-regexp,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-symbol,.hljs-template-variable,.hljs-variable{color:#bc6060}.hljs-literal{color:#78a960}.hljs-addition,.hljs-built_in,.hljs-bullet,.hljs-code{color:#397300}.hljs-meta{color:#1f7199}.hljs-meta .hljs-string{color:#4d99bf}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}
|
42
vendor/safingTailwind/docs/css/style.css
vendored
Normal file
42
vendor/safingTailwind/docs/css/style.css
vendored
Normal file
|
@ -0,0 +1,42 @@
|
|||
.tabs-content{
|
||||
border: 1px solid rgba(229,231,235,1);
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
background: rgb(243, 244, 246);
|
||||
}
|
||||
.tabs-content > li{
|
||||
display: none;
|
||||
}
|
||||
.tabs-content .active{
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.preview-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow: hidden;
|
||||
background-color: rgb(107, 114, 128);
|
||||
}
|
||||
.preview-panel-left {
|
||||
flex: 0 0 auto;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 200px;
|
||||
min-width: 150px;
|
||||
max-width: 78.8rem;
|
||||
background: rgb(243, 244, 246);
|
||||
color: white;
|
||||
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 3rem;
|
||||
}
|
||||
.preview-panel-splitter {
|
||||
flex: 0 0 auto;
|
||||
width: 18px;
|
||||
background: url(../docs/img/vsizegrip.png) center center no-repeat #535353;
|
||||
min-height: 200px;
|
||||
cursor: col-resize;
|
||||
}
|
3806
vendor/safingTailwind/docs/docs.html
vendored
Normal file
3806
vendor/safingTailwind/docs/docs.html
vendored
Normal file
File diff suppressed because it is too large
Load diff
BIN
vendor/safingTailwind/docs/img/vsizegrip.png
vendored
Normal file
BIN
vendor/safingTailwind/docs/img/vsizegrip.png
vendored
Normal file
Binary file not shown.
After ![]() (image error) Size: 91 B |
28
vendor/safingTailwind/docs/js/internal/iframeRefresher.js
vendored
Normal file
28
vendor/safingTailwind/docs/js/internal/iframeRefresher.js
vendored
Normal file
|
@ -0,0 +1,28 @@
|
|||
window.onload = function () {
|
||||
SetUpIframeData()
|
||||
};
|
||||
|
||||
function SetUpIframeData() {
|
||||
$('.preview-panel-left').each(function(){
|
||||
iframe = $(this).find( ".iframe" );
|
||||
data = $(this).find( ".data" );
|
||||
iframeContents = iframe.contents()
|
||||
innerHtml = iframeContents.find('html');
|
||||
innerBody = iframeContents.find('body');
|
||||
innerHead = iframeContents.find('head');
|
||||
innerHead.append('<link rel="stylesheet" href="../safingTailwind-1.5.css">');
|
||||
innerBody.append(data)
|
||||
});
|
||||
setTimeout(function(){
|
||||
SetUpIframeHeight()
|
||||
}, 500);
|
||||
}
|
||||
|
||||
function SetUpIframeHeight() {
|
||||
$('.preview-panel-left').each(function(){
|
||||
iframe = $(this).find( ".iframe" );
|
||||
iframeContents = iframe.contents()
|
||||
innerHtml = iframeContents.find('html');
|
||||
iframe.height((innerHtml.height()) + 'px')
|
||||
});
|
||||
}
|
15
vendor/safingTailwind/docs/js/internal/preview.js
vendored
Normal file
15
vendor/safingTailwind/docs/js/internal/preview.js
vendored
Normal file
|
@ -0,0 +1,15 @@
|
|||
$(".preview-panel-left").resizable({
|
||||
handleSelector: ".preview-panel-splitter",
|
||||
resizeHeight: false,
|
||||
});
|
||||
|
||||
var i = 0, timeOut = 0;
|
||||
|
||||
$(".preview-container").hover(function () {
|
||||
iframe = $(this).parent().find( ".iframe" );
|
||||
timeOut = setInterval(function(){
|
||||
iframe.height((iframe.contents().find('html').height()) + 'px')
|
||||
}, 10);
|
||||
}, function () {
|
||||
clearInterval(timeOut);
|
||||
});
|
15
vendor/safingTailwind/docs/js/internal/tabs.js
vendored
Normal file
15
vendor/safingTailwind/docs/js/internal/tabs.js
vendored
Normal file
|
@ -0,0 +1,15 @@
|
|||
$(document).ready(function() {
|
||||
var tabs = $('ul.tabs');
|
||||
tabs.each(function(i) {
|
||||
var tab = $(this).find('> li > a');
|
||||
tab.click(function(e) {
|
||||
var contentLocation = $(this).attr('href');
|
||||
if(contentLocation.charAt(0)=="#") {
|
||||
e.preventDefault();
|
||||
tab.removeClass('active');
|
||||
$(this).addClass('active');
|
||||
$(contentLocation).show().addClass('active').siblings().hide().removeClass('active');
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
1149
vendor/safingTailwind/docs/js/vendor/highlight.min.js
vendored
Normal file
1149
vendor/safingTailwind/docs/js/vendor/highlight.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
197
vendor/safingTailwind/docs/js/vendor/jquery-resizable.js
vendored
Normal file
197
vendor/safingTailwind/docs/js/vendor/jquery-resizable.js
vendored
Normal file
|
@ -0,0 +1,197 @@
|
|||
// <reference path="../bower_components/jquery/dist/jquery.js" />
|
||||
/*
|
||||
jquery-resizable
|
||||
Version 0.35 - 11/18/2019
|
||||
© 2015-2019 Rick Strahl, West Wind Technologies
|
||||
www.west-wind.com
|
||||
Licensed under MIT License
|
||||
*/
|
||||
(function(factory, undefined) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// AMD
|
||||
define(['jquery'], factory);
|
||||
} else if (typeof module === 'object' && typeof module.exports === 'object') {
|
||||
// CommonJS
|
||||
module.exports = factory(require('jquery'));
|
||||
} else {
|
||||
// Global jQuery
|
||||
factory(jQuery);
|
||||
}
|
||||
}(function($, undefined) {
|
||||
|
||||
if ($.fn.resizableSafe)
|
||||
return;
|
||||
|
||||
$.fn.resizableSafe = function fnResizable(options) {
|
||||
var defaultOptions = {
|
||||
// selector for handle that starts dragging
|
||||
handleSelector: null,
|
||||
// resize the width
|
||||
resizeWidth: true,
|
||||
// resize the height
|
||||
resizeHeight: true,
|
||||
// the side that the width resizing is relative to
|
||||
resizeWidthFrom: 'right',
|
||||
// the side that the height resizing is relative to
|
||||
resizeHeightFrom: 'bottom',
|
||||
// hook into start drag operation (event passed)
|
||||
onDragStart: null,
|
||||
// hook into stop drag operation (event passed)
|
||||
onDragEnd: null,
|
||||
// hook into each drag operation (event passed)
|
||||
onDrag: null,
|
||||
// disable touch-action on $handle
|
||||
// prevents browser level actions like forward back gestures
|
||||
touchActionNone: true,
|
||||
// instance id
|
||||
instanceId: null
|
||||
};
|
||||
if (typeof options == "object")
|
||||
defaultOptions = $.extend(defaultOptions, options);
|
||||
|
||||
return this.each(function () {
|
||||
var opt = $.extend({}, defaultOptions);
|
||||
if (!opt.instanceId)
|
||||
opt.instanceId = "rsz_" + new Date().getTime();
|
||||
|
||||
var startPos, startTransition;
|
||||
|
||||
// get the element to resize
|
||||
var $el = $(this);
|
||||
var $handle;
|
||||
|
||||
if (options === 'destroy') {
|
||||
opt = $el.data('resizable');
|
||||
if (!opt)
|
||||
return;
|
||||
|
||||
$handle = getHandle(opt.handleSelector, $el);
|
||||
$handle.off("mousedown." + opt.instanceId + " touchstart." + opt.instanceId);
|
||||
if (opt.touchActionNone)
|
||||
$handle.css("touch-action", "");
|
||||
$el.removeClass("resizable");
|
||||
return;
|
||||
}
|
||||
|
||||
$el.data('resizable', opt);
|
||||
|
||||
// get the drag handle
|
||||
|
||||
$handle = getHandle(opt.handleSelector, $el);
|
||||
|
||||
if (opt.touchActionNone)
|
||||
$handle.css("touch-action", "none");
|
||||
|
||||
$el.addClass("resizable");
|
||||
$handle.on("mousedown." + opt.instanceId + " touchstart." + opt.instanceId, startDragging);
|
||||
|
||||
function noop(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
};
|
||||
|
||||
function startDragging(e) {
|
||||
// Prevent dragging a ghost image in HTML5 / Firefox and maybe others
|
||||
if ( e.preventDefault ) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
startPos = getMousePos(e);
|
||||
startPos.width = parseInt($el.width(), 10);
|
||||
startPos.height = parseInt($el.height(), 10);
|
||||
|
||||
startTransition = $el.css("transition");
|
||||
$el.css("transition", "none");
|
||||
|
||||
if (opt.onDragStart) {
|
||||
if (opt.onDragStart(e, $el, opt) === false)
|
||||
return;
|
||||
}
|
||||
|
||||
$(document).on('mousemove.' + opt.instanceId, doDrag);
|
||||
$(document).on('mouseup.' + opt.instanceId, stopDragging);
|
||||
if (window.Touch || navigator.maxTouchPoints) {
|
||||
$(document).on('touchmove.' + opt.instanceId, doDrag);
|
||||
$(document).on('touchend.' + opt.instanceId, stopDragging);
|
||||
}
|
||||
$(document).on('selectstart.' + opt.instanceId, noop); // disable selection
|
||||
$("iframe").css("pointer-events","none");
|
||||
}
|
||||
|
||||
function doDrag(e) {
|
||||
|
||||
var pos = getMousePos(e), newWidth, newHeight;
|
||||
|
||||
if (opt.resizeWidthFrom === 'left')
|
||||
newWidth = startPos.width - pos.x + startPos.x;
|
||||
else
|
||||
newWidth = startPos.width + pos.x - startPos.x;
|
||||
|
||||
if (opt.resizeHeightFrom === 'top')
|
||||
newHeight = startPos.height - pos.y + startPos.y;
|
||||
else
|
||||
newHeight = startPos.height + pos.y - startPos.y;
|
||||
|
||||
if (!opt.onDrag || opt.onDrag(e, $el, newWidth, newHeight, opt) !== false) {
|
||||
if (opt.resizeHeight)
|
||||
$el.height(newHeight);
|
||||
|
||||
if (opt.resizeWidth)
|
||||
$el.width(newWidth);
|
||||
}
|
||||
}
|
||||
|
||||
function stopDragging(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
|
||||
$(document).off('mousemove.' + opt.instanceId);
|
||||
$(document).off('mouseup.' + opt.instanceId);
|
||||
|
||||
if (window.Touch || navigator.maxTouchPoints) {
|
||||
$(document).off('touchmove.' + opt.instanceId);
|
||||
$(document).off('touchend.' + opt.instanceId);
|
||||
}
|
||||
$(document).off('selectstart.' + opt.instanceId, noop);
|
||||
|
||||
// reset changed values
|
||||
$el.css("transition", startTransition);
|
||||
$("iframe").css("pointer-events","auto");
|
||||
|
||||
if (opt.onDragEnd)
|
||||
opt.onDragEnd(e, $el, opt);
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function getMousePos(e) {
|
||||
var pos = { x: 0, y: 0, width: 0, height: 0 };
|
||||
if (typeof e.clientX === "number") {
|
||||
pos.x = e.clientX;
|
||||
pos.y = e.clientY;
|
||||
} else if (e.originalEvent.touches) {
|
||||
pos.x = e.originalEvent.touches[0].clientX;
|
||||
pos.y = e.originalEvent.touches[0].clientY;
|
||||
} else
|
||||
return null;
|
||||
|
||||
return pos;
|
||||
}
|
||||
|
||||
function getHandle(selector, $el) {
|
||||
if (selector && selector.trim()[0] === ">") {
|
||||
selector = selector.trim().replace(/^>\s*/, "");
|
||||
return $el.find(selector);
|
||||
}
|
||||
|
||||
// Search for the selector, but only in the parent element to limit the scope
|
||||
// This works for multiple objects on a page (using .class syntax most likely)
|
||||
// as long as each has a separate parent container.
|
||||
return selector ? $el.parent().find(selector) : $el;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
if (!$.fn.resizable)
|
||||
$.fn.resizable = $.fn.resizableSafe;
|
||||
}));
|
2
vendor/safingTailwind/docs/js/vendor/jquery.min.js
vendored
Normal file
2
vendor/safingTailwind/docs/js/vendor/jquery.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
BIN
vendor/safingTailwind/fonts/safing-icons.ttf
vendored
Normal file
BIN
vendor/safingTailwind/fonts/safing-icons.ttf
vendored
Normal file
Binary file not shown.
BIN
vendor/safingTailwind/fonts/safing-icons.woff
vendored
Normal file
BIN
vendor/safingTailwind/fonts/safing-icons.woff
vendored
Normal file
Binary file not shown.
265447
vendor/safingTailwind/safingTailwind-1.5.css
vendored
Normal file
265447
vendor/safingTailwind/safingTailwind-1.5.css
vendored
Normal file
File diff suppressed because it is too large
Load diff
|
@ -3,37 +3,23 @@ title: Safing Video Updates
|
|||
layout: page
|
||||
---
|
||||
|
||||
<section class="pt-16 md:pt-32 lg:pt-64">
|
||||
<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">
|
||||
<div class="py-12 bg-white">
|
||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="lg:text-center">
|
||||
<!-- hide the huge "Follow Us" in mobile & md devices for now, made width problems -->
|
||||
<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 hidden lg:block">Follow Us</span>
|
||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-5 md:py-10 text-center">Video Updates</h2>
|
||||
<div class="flex mx-auto justify-center pt-5">
|
||||
<a href="{{ site.youtube_channel_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
||||
YouTube
|
||||
</a>
|
||||
<a href="{{ site.invidious_channel_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
||||
Invidious
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-8 md:mt-16 lg:mt-32">
|
||||
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10">
|
||||
{% assign sorted_videos = site.publications | reverse | where:"category","video" %}
|
||||
{% for video in sorted_videos %}
|
||||
{% include thumbnail_video.html %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<br class="mb-12">
|
||||
</div>
|
||||
<section class="general-layout">
|
||||
<div class="blogpod-container mt-80">
|
||||
<div class="blogpod-container-top">
|
||||
<span class="blogpod-container-top-bg-title">Follow Us</span>
|
||||
<h2 class="blogpod-container-top-title">
|
||||
Video Updates
|
||||
</h2>
|
||||
<div class="blogpod-container-top-extra">
|
||||
<a class="link-secondary" href="{{ site.youtube_channel_url }}">YouTube</a>
|
||||
<a class="link-secondary" href="{{ site.invidious_channel_url }}">Invidious</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blogpod-container-bottom">
|
||||
{% assign sorted_videos = site.publications | reverse | where:"category","video" %}
|
||||
{% for video in sorted_videos %}
|
||||
{% include thumbnail_video.html %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
Loading…
Add table
Reference in a new issue