mirror of
https://github.com/safing/web
synced 2025-04-16 17:09: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.
|
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:
|
link:
|
||||||
text: Read our comparison blog to find out more.
|
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?
|
- 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.
|
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:
|
link:
|
||||||
|
|
|
@ -1,95 +1,125 @@
|
||||||
source:
|
- name: FFG
|
||||||
ffg:
|
description: |
|
||||||
timespan: "2019-2021"
|
The FFG is the national funding institution for Research & Development of Austria. Their goal is to strengthen innovation and the economy.
|
||||||
# FFG Total:
|
|
||||||
# - Received Funding: 278.421€
|
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.
|
||||||
# - Received Loans: 263.025€
|
timespan: "2019-2021"
|
||||||
# - Funding In Prospect: 32.720€
|
# FFG Total:
|
||||||
# - Loans In Prospect: 30.920€
|
# - Received Funding: 278.421€
|
||||||
years:
|
# - Received Loans: 263.025€
|
||||||
- year: 2021
|
# - Funding In Prospect: 32.720€
|
||||||
items:
|
# - Loans In Prospect: 30.920€
|
||||||
- type: funding
|
years:
|
||||||
amount: "32.720"
|
- year: 2021
|
||||||
status: open
|
items:
|
||||||
- type: loan
|
- type: funding
|
||||||
amount: "30.920"
|
amount: "32.720"
|
||||||
status: open
|
status: open
|
||||||
- year: 2021
|
- type: loan
|
||||||
items:
|
amount: "30.920"
|
||||||
- type: funding
|
status: open
|
||||||
amount: "49.080"
|
- year: 2021
|
||||||
status: completed
|
items:
|
||||||
- type: loan
|
- type: funding
|
||||||
amount: "46.380"
|
amount: "49.080"
|
||||||
status: completed
|
status: completed
|
||||||
- year: 2020
|
- type: loan
|
||||||
items:
|
amount: "46.380"
|
||||||
- type: funding
|
status: completed
|
||||||
amount: "146.541"
|
- year: 2020
|
||||||
status: completed
|
items:
|
||||||
- type: loan
|
- type: funding
|
||||||
amount: "138.445"
|
amount: "146.541"
|
||||||
status: completed
|
status: completed
|
||||||
- year: 2019
|
- type: loan
|
||||||
items:
|
amount: "138.445"
|
||||||
- type: funding
|
status: completed
|
||||||
amount: "82.800"
|
- year: 2019
|
||||||
status: completed
|
items:
|
||||||
- type: loan
|
- type: funding
|
||||||
amount: "78.200"
|
amount: "82.800"
|
||||||
status: completed
|
status: completed
|
||||||
# Netidee Total:
|
- type: loan
|
||||||
# - Received Funding: 117.839€
|
amount: "78.200"
|
||||||
# - Funding In Prospect: 5.000€
|
status: completed
|
||||||
netidee:
|
# Netidee Total:
|
||||||
timespan: "2017-2021"
|
# - Received Funding: 117.839€
|
||||||
years:
|
# - Funding In Prospect: 5.000€
|
||||||
- year: 2021
|
- name: Netidee
|
||||||
items:
|
description: |
|
||||||
- type: funding
|
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.
|
||||||
amount: "5.000"
|
timespan: "2017-2021"
|
||||||
status: open
|
years:
|
||||||
- year: 2021
|
- year: 2021
|
||||||
items:
|
items:
|
||||||
- type: funding
|
- type: funding
|
||||||
amount: "20.000"
|
amount: "5.000"
|
||||||
status: completed
|
status: open
|
||||||
- year: 2020
|
- year: 2021
|
||||||
items:
|
items:
|
||||||
- type: funding
|
- type: funding
|
||||||
amount: "20.012"
|
amount: "20.000"
|
||||||
status: completed
|
status: completed
|
||||||
- year: 2019
|
- year: 2020
|
||||||
items:
|
items:
|
||||||
- type: funding
|
- type: funding
|
||||||
amount: "30.048"
|
amount: "20.012"
|
||||||
status: completed
|
status: completed
|
||||||
- year: 2017
|
- year: 2019
|
||||||
items:
|
items:
|
||||||
- type: funding
|
- type: funding
|
||||||
amount: "47.779"
|
amount: "30.048"
|
||||||
status: completed
|
status: completed
|
||||||
# Kickstarter is not counted towards the grants chart
|
- year: 2017
|
||||||
# since backers receive(d) SPN access in return
|
items:
|
||||||
kickstarter:
|
- type: funding
|
||||||
timespan: "February 2020"
|
amount: "47.779"
|
||||||
years:
|
status: completed
|
||||||
- year: 2020
|
# Kickstarter is not counted towards the grants chart
|
||||||
items:
|
# since backers receive(d) SPN access in return
|
||||||
- type: funding
|
- name: Kickstarter
|
||||||
amount: "11.755"
|
description: |
|
||||||
status: completed
|
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!
|
||||||
# ESA Total:
|
timespan: "February 2020"
|
||||||
# - Received Funding: 40.000€
|
years:
|
||||||
esa:
|
- year: 2020
|
||||||
timespan: "2018-2020"
|
items:
|
||||||
years:
|
- type: funding
|
||||||
- year: 2019
|
amount: "11.755"
|
||||||
items:
|
status: completed
|
||||||
- type: funding
|
# ESA Total:
|
||||||
amount: "40.000"
|
# - Received Funding: 40.000€
|
||||||
status: completed
|
- 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
|
# Total Numbers of Grants/Loans Image
|
||||||
#
|
#
|
||||||
|
@ -100,4 +130,4 @@ source:
|
||||||
# Investors: 0€ => 0€
|
# Investors: 0€ => 0€
|
||||||
|
|
||||||
# the previous image had a higher count since
|
# 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">
|
<footer class="footer" 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">
|
<div class="footer-form-wrapper">
|
||||||
<span class="text-white text-xl font-bold">Stay Connected via Newsletter</span>
|
<span class="footer-form-title">Stay Connected via Newsletter</span>
|
||||||
<form action="https://t80607841.emailsys1a.net/184/1387/c70759e794/subscribe/form.html" method="post">
|
<form class="footer-form" action="https://t80607841.emailsys1a.net/184/1387/c70759e794/subscribe/form.html" method="post">
|
||||||
<div class="block lg:flex items-center py-5">
|
<div class="footer-form-subscribe">
|
||||||
<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">
|
<input class="input-rounded-primary w-full" type="email" name="email" required placeholder="email">
|
||||||
<div class="pt-5 lg:pt-0 lg:pl-5 ">
|
<input class="btn-primary" type="submit" value="Subscribe">
|
||||||
<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="footer-form-legal">
|
||||||
</div>
|
<input class="toggle" type="checkbox" id="consent_text" name="consent_text" value="yes" required="">
|
||||||
<div class="mx-auto lg:mx-0 max-w-lg lg:max-w-md lg:flex">
|
<div>
|
||||||
<input type="checkbox" id="consent_text" name="consent_text" value="yes" required />
|
<label class="consent cursor-pointer text-safing-gray-500" for="consent_text">
|
||||||
<div class="ml-3">
|
I agree that Safing &
|
||||||
<label class="consent opacity-55 text-white" for='consent_text'>
|
<a class="link-primary-external" href="https://rapidmail.de" target="_blank">rapidmail.de</a>
|
||||||
I agree that Safing &
|
may process and use the email for newsletter purposes.
|
||||||
<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">
|
</label>
|
||||||
rapidmail.de
|
</div>
|
||||||
</a>
|
</div>
|
||||||
may process and use the email for newsletter purposes.
|
</form>
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
</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="footer-wrapper">
|
||||||
<div class="flex" style="width: max-content;">
|
<div class="footer-category">
|
||||||
<div>
|
<div class="footer-category-title">
|
||||||
<p class="text-white text-xl mb-6">Company</p>
|
<span>Company</span>
|
||||||
<ul class="list-reset">
|
</div>
|
||||||
<li class="block mr-0">
|
<div class="footer-links">
|
||||||
<a href="{{ site.about_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">About Us</a>
|
<div class="footer-links-left">
|
||||||
</li>
|
<a href="{{ site.about_url }}" class="footer-link"> About Us </a>
|
||||||
<li class="mt-3 block mr-0">
|
<a href="{{ site.business_model_url }}" class="footer-link"> Business Model </a>
|
||||||
<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>
|
<a href="{{ site.ownership_url }}" class="footer-link"> Ownership </a>
|
||||||
</li>
|
<div class="flex items-center">
|
||||||
<li class="mt-3 block mr-0">
|
<span class="dot absolute -ml-5"></span>
|
||||||
<a href="{{ site.ownership_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Ownership</a>
|
<a href="{{ site.jobs_url }}" class="footer-link"> We're Hiring </a>
|
||||||
</li>
|
</div>
|
||||||
<li class="mt-3 block mr-0 relative">
|
<a href="{{ site.help_url }}" class="footer-link"> Get Help </a>
|
||||||
<a href="{{ site.jobs_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">
|
</div>
|
||||||
We're Hiring
|
</div>
|
||||||
</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>
|
</div>
|
||||||
</div>
|
<div class="vertical-line"></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="footer-category">
|
||||||
<div class="flex relative">
|
<div class="footer-category-title">
|
||||||
<div>
|
<span>Community</span>
|
||||||
<p class="text-white text-xl mb-6">Community</p>
|
</div>
|
||||||
<div class="flex" style="width: max-content;">
|
<div class="footer-links">
|
||||||
<ul class="list-reset">
|
<div class="footer-links-left">
|
||||||
<li class="block mr-0">
|
<a href="{{ site.next_page_url }}" class="footer-link"> What's Next? </a>
|
||||||
<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>
|
<div class="flex items-center space-x-2">
|
||||||
</li>
|
<a href="{{ site.blog_url }}" class="footer-link"> Blog </a>
|
||||||
<li class="mt-3 flex items-center mr-0">
|
<a href="{{ site.blog_feed_url }}" class="footer-link"><i class="icon-rss text-xs"></i></a>
|
||||||
<a href="{{ site.blog_url }}"
|
</div>
|
||||||
class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Blog</a>
|
<div class="flex items-center space-x-2">
|
||||||
<a href="{{ site.blog_feed_url }}" style="transform: scale(0.8); margin-top: 2px; margin-left: 3px;"
|
<a href="{{ site.podcast_url }}" class="footer-link"> Podcast </a>
|
||||||
class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">
|
<a href="{{ site.podcast_feed_url }}" class="footer-link"><i class="icon-rss text-xs"></i></a>
|
||||||
<img style="height: 1.3rem; width: auto;" src="{{ site.img_url }}icons/rss-white.svg">
|
</div>
|
||||||
</a>
|
<a href="{{ site.video_url }}" class="footer-link"> Videos </a>
|
||||||
</li>
|
</div>
|
||||||
<li class="mt-3 flex items-center mr-0">
|
<div class="footer-links-right">
|
||||||
<a href="{{ site.podcast_url }}"
|
<a href="{{ site.docs_code_of_conduct_url }}" class="footer-link"> Code of Conduct </a>
|
||||||
class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Podcast</a>
|
<a href="{{ site.github_url }}" class="footer-link"> Github </a>
|
||||||
<a href="{{ site.podcast_feed_url }}" style="transform: scale(0.8); margin-top: 2px; margin-left: 3px;"
|
<a href="{{ site.reddit_url }}" class="footer-link"> Reddit </a>
|
||||||
class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">
|
<a href="{{ site.twitter_url }}" class="footer-link"> Twitter </a>
|
||||||
<img style="height: 1.3rem; width: auto;" src="{{ site.img_url }}icons/rss-white.svg">
|
</div>
|
||||||
</a>
|
</div>
|
||||||
</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>
|
</div>
|
||||||
</div>
|
<div class="vertical-line"></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="footer-category">
|
||||||
<div class="flex-1">
|
<div class="footer-category-title">
|
||||||
<div class="flex items-center">
|
<span>Portmaster</span>
|
||||||
<p class="text-white text-xl mb-6 pr-10">Portmaster</p>
|
<div class="horizontal-line"></div>
|
||||||
<div class="border-t-2 border-white w-full" style="opacity: .1; height: 20px;"></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>
|
||||||
<div class="flex">
|
<div class="footer-category">
|
||||||
<ul class="list-reset mb-6">
|
<div class="footer-category-title">
|
||||||
<li class="block mr-0">
|
<span>SPN</span>
|
||||||
<a href="{{ site.portmaster_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Discover</a>
|
<div class="horizontal-line"></div>
|
||||||
</li>
|
</div>
|
||||||
<li class="mt-3 block mr-0">
|
<div class="footer-links">
|
||||||
<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>
|
<div class="footer-links-left">
|
||||||
</li>
|
<a href="{{ site.spn_url }}" class="footer-link"> Discover </a>
|
||||||
<li class="mt-3 block mr-0">
|
<a href="{{ site.whitepaper_url }}" class="footer-link"> Whitepaper </a>
|
||||||
<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>
|
<a href="{{ site.github_url }}/spn/" class="footer-link"> Source Code </a>
|
||||||
</li>
|
<a href="{{ site.backlog_url }}#spn" class="footer-link"> Backlog </a>
|
||||||
<li class="mt-3 block mr-0">
|
</div>
|
||||||
<a href="{{ site.backlog_url }}#portmaster" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Backlog</a>
|
<div class="footer-links-right">
|
||||||
</li>
|
<a href="{{ site.tor_comparison_url }}" class="footer-link"> vs Tor </a>
|
||||||
</ul>
|
<a href="{{ site.vpn_comparison_url }}" class="footer-link"> vs VPNs </a>
|
||||||
<ul class="list-reset mb-6 pl-12">
|
</div>
|
||||||
<li class=" block mr-0">
|
</div>
|
||||||
<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>
|
</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>
|
||||||
<div class="text-sm pt-20 pb-4">
|
<div class="footer-legal">
|
||||||
<div class="lg:flex md:mx-auto" style="width: max-content;">
|
<div class="footer-legal-wrapper">
|
||||||
<p class="md:text-center leading-6 text-white opacity-25">
|
<span class="footer-legal-copyright">
|
||||||
© {{ site.time | date: '%Y' }} Safing ICS Technologies GmbH
|
© {{ site.time | date: '%Y' }} Safing ICS Technologies GmbH
|
||||||
</p>
|
</span>
|
||||||
<ul class=" pt-5 lg:pt-0 md:flex">
|
<div class="footer-legal-links">
|
||||||
<li class="lg:pl-16">
|
<a href="{{ site.terms_url }}" class="footer-legal-link"> Terms of Service </a>
|
||||||
<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>
|
<a href="{{ site.privacy_url }}" class="footer-legal-link"> Privacy Policy </a>
|
||||||
</li>
|
<a href="{{ site.contact_url }}" class="footer-legal-link"> Contact & Notice </a>
|
||||||
<li class="pt-4 md:py-0 md:pl-10">
|
</div>
|
||||||
<a href="{{ site.privacy_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Privacy Policy</a>
|
</div>
|
||||||
</li>
|
<span class="footer-legal-extra">
|
||||||
<li class="pt-4 md:py-0 md:pl-10">
|
Companies mentioned are by way of example and are an opinion only, not based on fact.
|
||||||
<a href="{{ site.contact_url }}" class="no-underline hover:opacity-100 opacity-55 text-white transition duration-150 ease-in-out">Contact & Notice</a>
|
</span>
|
||||||
</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>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
|
@ -39,5 +39,5 @@
|
||||||
<meta name="theme-color" content="#f7f7f7">
|
<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/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">
|
<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">
|
<header class="header-one-container mb-64">
|
||||||
<span class="bottom-0 left-0 absolute hidden lg:block">
|
<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="">
|
<img src="{{ site.img_url }}/shapes/corner-bl.png" alt="">
|
||||||
</span>
|
</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>
|
</header>
|
||||||
|
|
|
@ -1,88 +1,41 @@
|
||||||
<nav class="flex flex-wrap items-center bg-black px-10 py-6 w-full z-50">
|
<nav class="nav">
|
||||||
<div class="flex-1 flex justify-between items-center">
|
<div class="nav-left">
|
||||||
<a href="{{ site.base_url }}" class="flex items-center hover:opacity-55 transition duration-150 ease-in-out opacity-100">
|
<a href="{{ site.base_url }}" class="nav-logo-wrapper">
|
||||||
<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">
|
<!-- turn this into a font icon -->
|
||||||
<g data-name="Main" fill-rule="evenodd">
|
<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">
|
||||||
<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" />
|
<g data-name="Main" fill-rule="evenodd">
|
||||||
<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="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="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="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="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)" />
|
<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>
|
||||||
</g>
|
<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>
|
||||||
</svg>
|
</g>
|
||||||
<span class="text-white">Safing<span class="opacity-55 ">.io</span></span>
|
</svg>
|
||||||
</a>
|
<span>Safing<span>.io</span></span>
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<label for="menu-toggle" class="pointer-cursor lg:hidden block">
|
<label class="nav-right-burger" for="nav-toggle-visable">
|
||||||
<svg class="h-6 w-6 fill-current text-white" stroke="currentColor" fill="none" viewBox="0 0 24 24">
|
<!-- turn this into a font icon -->
|
||||||
<path :class="{'hidden': open, 'inline-flex': !open }" class="inline-flex" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
<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="hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
<path class="inline-flex" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
|
||||||
</svg>
|
<path class="hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
||||||
|
</svg>
|
||||||
</label>
|
</label>
|
||||||
<input class="hidden" type="checkbox" id="menu-toggle" />
|
<input class="nav-toggle-burger" id="nav-toggle-visable" type="checkbox">
|
||||||
<div class="hidden w-full text-center lg:flex lg:items-center lg:w-auto" id="menu">
|
<div class="nav-right">
|
||||||
<nav>
|
<div class="nav-right-links">
|
||||||
<ul class="lg:flex items-center justify-between text-base text-gray-700 pt-4 lg:pt-0 text-center ">
|
<a href="{{ site.portmaster_url }}" class="nav-link"> Portmaster </a>
|
||||||
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
|
<a href="{{ site.spn_url }}" class="nav-link"> SPN </a>
|
||||||
<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">
|
<a href="{{ site.docs_url }}" class="nav-link"> Docs </a>
|
||||||
Portmaster
|
<a href="{{ site.github_url }}/portmaster/" class="nav-link"> Source Code </a>
|
||||||
</a>
|
<a href="{{ site.about_url }}" class="nav-link"> About </a>
|
||||||
</li>
|
<a href="{{ site.next_page_url }}" class="nav-link"> What's Next </a>
|
||||||
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
|
<a href="{{ site.help_url }}" class="nav-link"> Get Help </a>
|
||||||
<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">
|
</div>
|
||||||
SPN
|
<div class="nav-right-actions">
|
||||||
</a>
|
<a href="{{ site.account_server_url }}account/sign_in" class="nav-link"> Sign In </a>
|
||||||
</li>
|
<a href="{{ site.account_server_url }}account/sign_up" class="btn-primary justify-center"> Sign Up </a>
|
||||||
<li class="p-3 lg:p-0 text-white text-lg lg:text-sm">
|
</div>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</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 %}
|
{% 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" %}
|
{% if page.next.category == "blog" %}
|
||||||
{% assign next_type = "Blog Post" %}
|
{% assign next_type = "Blog Post" %}
|
||||||
{% elsif page.next.category == "video" %}
|
{% elsif page.next.category == "video" %}
|
||||||
|
@ -8,12 +8,14 @@
|
||||||
{% elsif page.next.category == "podcast" %}
|
{% elsif page.next.category == "podcast" %}
|
||||||
{% assign next_type = "Podcast" %}
|
{% assign next_type = "Podcast" %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<div class="pb-4 text-md opacity-55">Next {{ next_type }}</div>
|
<span class="prev-next-container-next-title">
|
||||||
<a href="{{ page.next.url }}" class="text-3xl tracking-tight font-extrabold leading-none break-normal">{{ page.next.title }}</a>
|
Next {{ next_type }}
|
||||||
|
</span>
|
||||||
|
<a href="{{ page.next.url }}" class="link-primary">{{ page.next.title }}</a>
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if page.previous.url %}
|
{% 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" %}
|
{% if page.previous.category == "blog" %}
|
||||||
{% assign previous_type = "Blog Post" %}
|
{% assign previous_type = "Blog Post" %}
|
||||||
{% elsif page.previous.category == "video" %}
|
{% elsif page.previous.category == "video" %}
|
||||||
|
@ -21,8 +23,10 @@
|
||||||
{% elsif page.previous.category == "podcast" %}
|
{% elsif page.previous.category == "podcast" %}
|
||||||
{% assign previous_type = "Podcast" %}
|
{% assign previous_type = "Podcast" %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<div class="pb-4 text-md opacity-55">Previous {{ previous_type }}</div>
|
<span class="prev-next-container-next-title">
|
||||||
<a href="{{ page.previous.url }}" class="text-3xl tracking-tight font-extrabold leading-none break-normal">{{ page.previous.title }}</a>
|
Previous {{ previous_type }}
|
||||||
|
</span>
|
||||||
|
<a href="{{ page.previous.url }}" class="link-primary">{{ page.previous.title }}</a>
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,17 +1,11 @@
|
||||||
<a href="{{ site.portmaster_url }}" style="opacity: 1;" id="portmaster-plug">
|
<a class="advert-container" href="{{ site.portmaster_url }}">
|
||||||
<div class="w-full" style="height: 260px;">
|
<div class="advert-container-left">
|
||||||
<div class="absolute mx-auto right-0 left-0 rounded-md flex items-center" style="max-width: 950px; height: inherit;">
|
<span class="advert-container-left-title">Discover the Portmaster</span>
|
||||||
<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="">
|
<span class="advert-container-left-sub">Open Source. Free Forever.</span>
|
||||||
</div>
|
<div class="advert-container-left-button btn bg-black text-safing-blue-400">Take Back Control</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>
|
|
||||||
</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="card">
|
||||||
<div class="block cardshadow p-8 rounded-lg">
|
<label class="card-label" for="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}">
|
||||||
<div class="tabs">
|
<div class="wrapper-left">
|
||||||
<div class="tab">
|
<div class="flex">
|
||||||
<input class="dropinput" type="checkbox" id="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}">
|
{% for tag in card.projects %}
|
||||||
<label style="min-width: 90%; min-height: 150px; display: block;" class="absolute cursor-pointer" for="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}">
|
{% include tag.html tag=tag %}
|
||||||
<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 %}
|
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
|
||||||
{% if card.link %}
|
|
||||||
<br/>
|
|
||||||
<a href="{{ card.link.url }}">
|
|
||||||
{{ card.link.text }}
|
|
||||||
</a>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="card-title">
|
||||||
<div class="pt-3">
|
{% if include.state == 'done' %}
|
||||||
<div class="absolute top-0 right-0 mr-6 pt-1 overflow-visible mt-20 sm:mt-16 sm:mr-16">
|
<i class="icon-tick text-green-500"></i>
|
||||||
<div class="flex-shrink-0 mt-0">
|
{% elsif include.state == 'in_progress' %}
|
||||||
<div class="flex ">
|
<i class="icon-cog text-gray-500"></i>
|
||||||
{% for member in card.team %}
|
{% elsif include.state == 'discarded' %}
|
||||||
<span class="transform hover:scale-110 duration-150 ease-in-out" tooltip="{{ member | capitalize }}" >
|
<i class="icon-cross text-red-500"></i>
|
||||||
<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 }}">
|
{% elsif include.state == 'postponed' %}
|
||||||
</span>
|
<i class="icon-files text-gray-800"></i>
|
||||||
{% endfor %}
|
{% elsif include.state == 'backlog' %}
|
||||||
</div>
|
<i class="icon-files text-gray-800"></i>
|
||||||
</div>
|
{% endif %}
|
||||||
|
<h3 class="title">{{ card.title }}</h3>
|
||||||
</div>
|
</div>
|
||||||
</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>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -1,125 +1,81 @@
|
||||||
<div class="tablecard cardshadow text-left transform">
|
<div class="card-extended">
|
||||||
<div class="block px-8 py-6 rounded-lg">
|
<label class="card-label" for="tablecard-{{ include.state }}-{{ forloop.index }}">
|
||||||
<div class="absolute top-0 right-0 overflow-visible mr-16 mt-12 z-20">
|
<div class="wrapper-left">
|
||||||
<div class="flex-shrink-0 mt-0">
|
<div class="flex">
|
||||||
<div class="flex ">
|
{% for tag in card.projects %}
|
||||||
{% for member in card.team %}
|
{% include tag.html tag=tag %}
|
||||||
<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 %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="card-title">
|
||||||
</div>
|
{% if include.state == 'done' %}
|
||||||
<div class="tabs">
|
<i class="icon-tick text-green-500"></i>
|
||||||
<div class="tab relative">
|
{% elsif include.state == 'in_progress' %}
|
||||||
<input class="dropinput" type="checkbox" id="tablecard-{{ include.state }}-{{ forloop.index }}">
|
<i class="icon-cog text-gray-500"></i>
|
||||||
<label style="min-width: 100%; min-height: 115px; display: block;" class="z-10 absolute cursor-pointer" for="tablecard-{{ include.state }}-{{ forloop.index }}">
|
{% elsif include.state == 'discarded' %}
|
||||||
<img class="absolute right-0" style="margin-right: 1rem; margin-top: 1.2rem;" id="icon" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
<i class="icon-cross text-red-500"></i>
|
||||||
</label>
|
{% elsif include.state == 'postponed' %}
|
||||||
<div class="flex relative ">
|
<i class="icon-files text-gray-800"></i>
|
||||||
<div>
|
{% elsif include.state == 'backlog' %}
|
||||||
<div class="flex">
|
<i class="icon-files text-gray-800"></i>
|
||||||
{% for tag in card.projects %}
|
{% endif %}
|
||||||
{% assign tag_bg_strength = 100 %}
|
<h3 class="title">{{ card.title }}</h3>
|
||||||
|
|
||||||
{% 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>
|
</div>
|
||||||
<div style="padding-left: 0; padding-right: 0;" class="tab-content text-md">
|
</div>
|
||||||
<div class="block py-3">
|
<div class="wrapper-right">
|
||||||
<hr>
|
<div class="wrapper-right-profiles">
|
||||||
<div class="tab relative" id="tabtwo">
|
{% for member in card.team %}
|
||||||
<input class="dropinput" type="checkbox" id="tablecard-description-{{ include.state }}-{{ forloop.index }}">
|
<div class="circular-profile" tooltip="{{ member | capitalize }}">
|
||||||
<label style="min-width: 100%; min-height: 115px; display: block;" class="z-10 absolute cursor-pointer" for="tablecard-description-{{ include.state }}-{{ forloop.index }}">
|
<img src="{{ site.img_url }}profiles/{{ member | downcase }}.png" alt="{{ member | capitalize }}">
|
||||||
<img class="absolute right-0" style="margin-right: 1rem; margin-top: 0.5rem;" id="icontwo" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
</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>
|
</label>
|
||||||
<div class="flex relative">
|
<input class="card-input-toggle" id="tablecard-description-{{ include.state }}-{{ forloop.index }}" type="checkbox">
|
||||||
<div class="self-center -mt-5">
|
<div class="card-dropdown-toggle">
|
||||||
<div class="absolute right-0 mr-12 transform scale-110">
|
<div class="card-dropdown-content">
|
||||||
|
{% for paragraph in card.description %}
|
||||||
|
<p>{{ paragraph }}</p>
|
||||||
|
{% endfor %}
|
||||||
</div>
|
</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>
|
||||||
<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>
|
||||||
<div>
|
{% for tag in card.progress %}
|
||||||
{% for tag in card.progress %}
|
{% if tag.type == 'a' %}
|
||||||
{% if tag.type == 'a' %}
|
<p><{{ tag.type }} href='{{ tag.href }}'>{{ tag.text }}</{{tag.type}}></p>
|
||||||
<{{ tag.type }} href='{{ tag.href }}'>{{ tag.text }}</{{tag.type}}>
|
{% elsif tag.type == 'br' %}
|
||||||
{% elsif tag.type == 'br' %}
|
<br/>
|
||||||
<br/>
|
{% elsif tag.type == 'ol' %}
|
||||||
{% elsif tag.type == 'ol' %}
|
<ol>
|
||||||
<ol>
|
{% for li in tag.lis %}
|
||||||
{% for li in tag.lis %}
|
<li>{{ li }}</li>
|
||||||
<li>{{ li }}</li>
|
{% endfor %}
|
||||||
{% endfor %}
|
</ol>
|
||||||
</ol>
|
{% elsif tag.type == 'ul' %}
|
||||||
{% elsif tag.type == 'ul' %}
|
<ul>
|
||||||
<ul>
|
{% for li in tag.lis %}
|
||||||
{% for li in tag.lis %}
|
<li>{{ li }}</li>
|
||||||
<li>{{ li }}</li>
|
{% endfor %}
|
||||||
{% endfor %}
|
</ul>
|
||||||
</ul>
|
{% else %}
|
||||||
{% else %}
|
<{{ tag.type }}>{{ tag.text }}</{{tag.type}}>
|
||||||
<{{ tag.type }}>{{ tag.text }}</{{tag.type}}>
|
{% endif %}
|
||||||
{% endif %}
|
{% endfor %}
|
||||||
{% 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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</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' %}
|
{% if include.tag == 'Portmaster' %}
|
||||||
{% assign tag_color = 'blue' %}
|
<span class="tag-portmaster">Portmaster</span>
|
||||||
{% elsif include.tag == 'SPN' %}
|
{% elsif include.tag == 'SPN' %}
|
||||||
{% assign tag_color = 'green' %}
|
<span class="tag-spn">SPN</span>
|
||||||
{% elsif include.tag == 'Website' %}
|
{% elsif include.tag == 'Website' %}
|
||||||
{% assign tag_color = 'pink' %}
|
<span class="tag bg-pink-100 text-pink-800">Website</span>
|
||||||
{% elsif include.tag == 'Back Office' %}
|
{% elsif include.tag == 'Back Office' %}
|
||||||
{% assign tag_color = 'gray' %}
|
<span class="tag bg-gray-100 text-gray-800">Back Office</span>
|
||||||
{% assign tag_bg_strength = 200 %}
|
|
||||||
{% elsif include.tag == 'Community' %}
|
{% elsif include.tag == 'Community' %}
|
||||||
{% assign tag_color = 'purple' %}
|
<span class="tag-community">Community</span>
|
||||||
{% elsif include.tag == 'Marketing' %}
|
{% elsif include.tag == 'Marketing' %}
|
||||||
{% assign tag_color = 'orange' %}
|
<span class="tag-marketing">Marketing</span>
|
||||||
{% endif %}
|
{% 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">
|
<a class="card-blog" href="{{ post.url }}">
|
||||||
<div class="block transform hover:scale-95 duration-150 ease-in-out" style="max-width: 350px; justify-self: center;">
|
<div class="card-blog-thumbnail">
|
||||||
<a href="{{ post.url }}">
|
{% if post.custom_thumbnail_name == null %}
|
||||||
<div class="relative" style="max-width: 365px;">
|
<img
|
||||||
{% if post.custom_thumbnail_name == null %}
|
src="{{ site.img_url }}thumbnails/blog/placeholder.png"
|
||||||
<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">
|
{% else %}
|
||||||
{% endif %}
|
<img
|
||||||
{% if post.progress_update == true %}
|
src="{{ site.img_url }}thumbnails/blog/{{ post.custom_thumbnail_name }}.png"
|
||||||
<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>
|
style="max-width: 365px; max-height: 223px;"
|
||||||
{% endif %}
|
>
|
||||||
{% if post.portmaster_update == true %}
|
{% endif %}
|
||||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
|
{% if post.progress_update == true %}
|
||||||
<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">
|
<span class="counter">#{{ post.title | slice: 2, 2 }}</span>
|
||||||
<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">
|
{% endif %}
|
||||||
<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" />
|
{% if post.portmaster_update == true %}
|
||||||
<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" />
|
<span class="box-icon">
|
||||||
</svg>
|
<i class="icon-reload text-xl"></i>
|
||||||
</button>
|
|
||||||
</span>
|
</span>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
<div class="pt-6">
|
<div class="card-blog-content" style="max-width: 365px;">
|
||||||
<div class="flex w-full relative">
|
<div class="content-wrapper">
|
||||||
<span class="opacity-25">
|
<span class="w-full">
|
||||||
{% if include.pre_header %}
|
{% if include.pre_header %}
|
||||||
{{ include.pre_header }} -
|
{{ include.pre_header }} -
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{{ post.date | date: "%-d. %b %Y" }}
|
{{ post.date | date: "%-d. %b %Y" }}
|
||||||
</span>
|
</span>
|
||||||
<div class="flex-shrink-0 right-0 absolute right-0">
|
<div class="circular-profile" tooltip="{{ post.author | capitalize }}">
|
||||||
<div class="flex ">
|
<img src="{{ site.img_url }}profiles/{{ post.author | downcase }}.png" alt="{{ post.author | capitalize }}">
|
||||||
<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>
|
||||||
</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>
|
</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>
|
</div>
|
||||||
</li>
|
</a>
|
|
@ -1,44 +1,34 @@
|
||||||
<li class="mt-10 md:mt-0">
|
<a class="card-blog" href="{{ episode.url }}">
|
||||||
<div class="block transform hover:scale-95 duration-150 ease-in-out">
|
<div class="card-blog-thumbnail">
|
||||||
<a href="{{ episode.url }}">
|
{% if episode.custom_thumbnail_name == null %}
|
||||||
<div class="relative" style="max-width: 365px;">
|
<img
|
||||||
{% if episode.custom_thumbnail_name == null %}
|
src="{{ site.img_url }}thumbnails/podcast/placeholder.png"
|
||||||
<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">
|
{% else %}
|
||||||
{% endif %}
|
<img
|
||||||
<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>
|
src="{{ site.img_url }}thumbnails/podcast/{{ episode.custom_thumbnail_name }}.jpg"
|
||||||
</div>
|
style="max-width: 365px; max-height: 223px;"
|
||||||
<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">
|
{% endif %}
|
||||||
<svg class="h-8 w-auto lg:h-7" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
<span class="counter">#{{ episode.title | slice: 2, 2 }}</span>
|
||||||
<g fill="none">
|
<span class="box-icon">
|
||||||
<path d="M0 0h24v24H0z"/>
|
<i class="icon-mic text-xl"></i>
|
||||||
<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>
|
|
||||||
</span>
|
</span>
|
||||||
<div class="pt-6">
|
</div>
|
||||||
<div class="flex w-full relative">
|
<div class="card-blog-content" style="max-width: 365px;">
|
||||||
<span class="opacity-25">
|
<div class="content-wrapper">
|
||||||
|
<span class="w-full">
|
||||||
{% if include.pre_header %}
|
{% if include.pre_header %}
|
||||||
{{ include.pre_header }} -
|
{{ include.pre_header }} -
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{{ episode.date | date: "%-d. %b %Y" }}
|
{{ episode.date | date: "%-d. %b %Y" }}
|
||||||
</span>
|
</span>
|
||||||
<div class="flex-shrink-0 right-0 absolute right-0">
|
<div class="circular-profile" tooltip="{{ post.author | capitalize }}">
|
||||||
<div class="flex ">
|
<img src="{{ site.img_url }}profiles/{{ post.author | downcase }}.png" alt="{{ post.author | capitalize }}">
|
||||||
<span class="transform hover:scale-110 duration-150 ease-in-out" tooltip="{{ post.author | capitalize }}">
|
</div>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
</a>
|
{% assign title_length = episode.title | size %}
|
||||||
|
<span>{{ episode.title | slice: 7, title_length }} - #{{ episode.title | slice: 2, 2 }}</span>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</a>
|
||||||
|
|
|
@ -1,31 +1,38 @@
|
||||||
<li class="mt-10 md:mt-0">
|
<a class="card-blog" href="{{ video.url }}">
|
||||||
<div class="block transform hover:scale-95 duration-150 ease-in-out">
|
<div class="card-blog-thumbnail">
|
||||||
<a href="{{ video.url }}">
|
|
||||||
{% if video.custom_thumbnail_name == null %}.
|
{% 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 %}
|
{% 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 %}
|
{% endif %}
|
||||||
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
|
<span class="box-icon">
|
||||||
<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">
|
<i class="icon-play text-xl"></i>
|
||||||
<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>
|
</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>
|
</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">
|
<div class="header-four-container">
|
||||||
<h1 >{{ page.title }}</h1>
|
<h1 class="header-four-container-title">{{ page.title }}</h1>
|
||||||
{% if page.summary %}
|
{% 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>" }}
|
{{ page.summary | markdownify | remove: "<p>" | remove: "</p>" }}
|
||||||
</p>
|
</p>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<p>{{ page.date | date: "%B %-d, %Y" }} • Written by <a href="{{ site.team_url }}#{{ page.author | slugify }}">{{ page.author | capitalize }}</a></p>
|
<span class="header-four-container-title-author">
|
||||||
<div class="flex mx-auto justify-center pt-5">
|
{{ page.date | date: "%B %-d, %Y" }} • Written by <a class="link-primary" href="{{ site.team_url }}#{{ page.author | slugify }}">{{ page.author | capitalize }}</a>
|
||||||
<a href="{{ site.twitter_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
</span>
|
||||||
<img style="height: 1.1rem; width: auto;" src="{{ site.img_url }}icons/twitter.svg">
|
<div class="header-four-container-social">
|
||||||
</a>
|
<a class="link hover-opacity-in" href="{{ site.twitter_url }}"><i class="icon-twitter text-lg"></i></a>
|
||||||
<a href="{{ site.github_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
<a class="link hover-opacity-in" href="{{ site.github_url }}"><i class="icon-github text-xl"></i></a>
|
||||||
<img style="height: 1.19rem; width: auto;" src="{{ site.img_url }}icons/github.svg">
|
<a class="link hover-opacity-in" href="{{ site.reddit_url }}"><i class="icon-reddit text-xl"></i></a>
|
||||||
</a>
|
|
||||||
<a href="{{ site.reddit_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
|
||||||
<img style="height: 1.18rem; width: auto;" src="{{ site.img_url }}icons/reddit.svg">
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% if page.progress_update %}
|
<div class="markdown-container">
|
||||||
<div class="progress-update">
|
|
||||||
{% else %}
|
|
||||||
<div class="content" id="blog">
|
|
||||||
{% endif %}
|
|
||||||
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
|
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
|
||||||
{% if page.progress_update == null %}
|
{% 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>
|
<p>{{ page.date | date: "%B %-d, %Y" }} • Written by <a href="{{ site.team_url }}#{{ page.author | slugify }}">{{ page.author | capitalize }}</a></p>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<hr>
|
|
||||||
|
|
||||||
{% if page.portmaster_plug == true %}
|
|
||||||
{% include portmaster_plug.html %}
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% include next_previous_item.html %}
|
|
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
|
layout: publication_container
|
||||||
container_class: "podcast pt-40 lg:pt-40"
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="text-center">
|
<div class="header-four-container">
|
||||||
{% assign title_length = page.title | size %}
|
{% 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>
|
<span class="header-four-container-counter">#{{ page.title | slice: 2, 2 }}</span>
|
||||||
<h1 style="padding-top: 1.5em;">{{ page.title | slice: 7, title_length }}</h1>
|
<h1 class="header-four-container-title">{{ page.title | slice: 7, title_length }}</h1>
|
||||||
<p>{{ page.date | date: "%B %-d, %Y" }}</p>
|
<p class="header-four-container-desc">{{ page.date | date: "%B %-d, %Y" }}</p>
|
||||||
<div class="flex mx-auto justify-center pt-5">
|
<div class="header-four-container-social">
|
||||||
<a href="{{ site.twitter_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
<a class="link hover-opacity-in" href="{{ site.twitter_url }}"><i class="icon-twitter text-lg"></i></a>
|
||||||
<img style="height: 1.1rem; width: auto;" src="{{ site.img_url }}icons/twitter.svg">
|
<a class="link hover-opacity-in" href="{{ site.github_url }}"><i class="icon-github text-xl"></i></a>
|
||||||
</a>
|
<a class="link hover-opacity-in" href="{{ site.reddit_url }}"><i class="icon-reddit text-xl"></i></a>
|
||||||
<a href="{{ site.github_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
|
||||||
<img style="height: 1.19rem; width: auto;" src="{{ site.img_url }}icons/github.svg">
|
|
||||||
</a>
|
|
||||||
<a href="{{ site.reddit_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
|
||||||
<img style="height: 1.18rem; width: auto;" src="{{ site.img_url }}icons/reddit.svg">
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content">
|
|
||||||
|
<div class="markdown-container">
|
||||||
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
|
{{ content | replace: '<!--break-->', '<a class="anchor" id="continue"></a>' }}
|
||||||
<h3>Description</h3>
|
<h3>Description</h3>
|
||||||
{{ page.summary }}
|
{{ page.summary }}
|
||||||
|
</div>
|
||||||
{% include next_previous_item.html %}
|
|
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
|
layout: publication_container
|
||||||
container_class: "podcast pt-40 lg:pt-64"
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="text-center">
|
<div class="header-four-container">
|
||||||
{% if page.progress_update %}
|
{% if page.progress_update %}
|
||||||
{% assign title_length = page.title | size %}
|
{% 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>
|
<span class="header-four-container-counter">#{{ page.title | slice: 2, 2 }}</span>
|
||||||
<h1 style="padding-top: 1.5em;">{{ page.title | slice: 7, title_length }}</h1>
|
<h1 class="header-four-container-title">{{ page.title | slice: 7, title_length }}</h1>
|
||||||
{% else %}
|
{% else %}
|
||||||
<h1>{{ page.title }}</h1>
|
<h1 class="header-four-container-title">{{ page.title }}</h1>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<p class="opacity-55">{{ page.date | date: "%B %-d, %Y" }}</p>
|
{% if page.summary %}
|
||||||
<div class="flex mx-auto justify-center pt-5">
|
<p class="header-four-container-desc">
|
||||||
<a href="{{ site.twitter_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
{{ page.summary | markdownify | remove: "<p>" | remove: "</p>" }}
|
||||||
<img style="height: 1.1rem; width: auto;" src="{{ site.img_url }}icons/twitter.svg">
|
</p>
|
||||||
</a>
|
{% endif %}
|
||||||
<a href="{{ site.github_url }}" class="pl-4 pr-4 opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
<span class="header-four-container-title-author">
|
||||||
<img style="height: 1.19rem; width: auto;" src="{{ site.img_url }}icons/github.svg">
|
{{ page.date | date: "%B %-d, %Y" }}
|
||||||
</a>
|
</span>
|
||||||
<a href="{{ site.reddit_url }}" class="opacity-55 hover:opacity-100 ease-in-out duration-150" target="_blank">
|
<div class="header-four-container-social">
|
||||||
<img style="height: 1.18rem; width: auto;" src="{{ site.img_url }}icons/reddit.svg">
|
<a class="link hover-opacity-in" href="{{ site.twitter_url }}"><i class="icon-twitter text-lg"></i></a>
|
||||||
</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>
|
</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
|
### Then Luke Appeared on the Scene
|
||||||
|
|
||||||
<div class="notification-podcast">
|
<div class="alert-primary">
|
||||||
<img src="{{ site.img_url }}icons/mic.svg">
|
<i class="icon-mic text-lg"></i>
|
||||||
<a href="/podcast/2019/11/29/hiring-a-designer-from-the-privacy-community/">
|
<a class="underline hover-opacity-in" 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
|
||||||
Listen to the accompanying podcast where Luke talks about his side of the story
|
|
||||||
</p>
|
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -268,47 +268,4 @@ cards:
|
||||||
discarded:
|
discarded:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
{% include progress-update-tablecards.html %}
|
||||||
<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>
|
|
|
@ -254,47 +254,4 @@ cards:
|
||||||
discarded:
|
discarded:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
{% include progress-update-tablecards.html %}
|
||||||
<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>
|
|
|
@ -214,61 +214,4 @@ cards:
|
||||||
discarded:
|
discarded:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
{% include progress-update-tablecards.html %}
|
||||||
<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>
|
|
|
@ -165,60 +165,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -166,60 +166,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -131,60 +131,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -193,60 +193,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -156,60 +156,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -182,60 +182,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
||||||
|
|
|
@ -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
|
## How To Evaluate A Healthy Privacy Company
|
||||||
|
|
||||||
<div class="notification-podcast">
|
<div class="alert-primary">
|
||||||
<img src="{{ site.img_url }}icons/mic.svg">
|
<i class="icon-mic text-lg"></i>
|
||||||
<a href="/podcast/2021/05/06/how-weak-business-models-corrupt-privacy-projects/">
|
<a class="underline hover-opacity-in" 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.
|
||||||
Enjoy Podcasts? Privacy YouTuber "TheHatedOne" and I got together to discuss this topic in-depth.
|
|
||||||
</p>
|
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</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.
|
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">
|
<div class="alert-primary">
|
||||||
<img src="{{ site.img_url }}icons/mic.svg">
|
<i class="icon-mic text-lg"></i>
|
||||||
<a href="/podcast/2021/05/06/how-weak-business-models-corrupt-privacy-projects/">
|
<a class="underline hover-opacity-in" 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
|
||||||
Privacy YouTuber "TheHatedOne" and I talk extensively about the MobileCoin situation. Tune into that episode for more details
|
|
||||||
</p>
|
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -145,60 +145,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -169,60 +169,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -127,60 +127,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -106,60 +106,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -126,60 +126,4 @@ cards:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div>
|
{% include progress-update-tablecards.html %}
|
||||||
{% 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>
|
|
|
@ -174,61 +174,4 @@ cards:
|
||||||
discarded:
|
discarded:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
{% include progress-update-tablecards.html %}
|
||||||
<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>
|
|
|
@ -202,61 +202,4 @@ cards:
|
||||||
discarded:
|
discarded:
|
||||||
---
|
---
|
||||||
|
|
||||||
|
{% include progress-update-tablecards.html %}
|
||||||
<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>
|
|
|
@ -12,90 +12,103 @@ summary: Both Portmaster and Pi-hole are free and open source privacy tools. The
|
||||||
|
|
||||||
## Overview Chart
|
## Overview Chart
|
||||||
|
|
||||||
<div class="table">
|
<div class="card-table">
|
||||||
<table>
|
<table>
|
||||||
<colgroup>
|
<colgroup class="card-table-colgroup">
|
||||||
<col>
|
<col class="card-table-colgroup-col">
|
||||||
<col class="highlight">
|
<col class="card-table-colgroup-col-highlight">
|
||||||
<col>
|
<col class="card-table-colgroup-col">
|
||||||
</colgroup>
|
</colgroup>
|
||||||
<thead>
|
<thead class="card-table-header">
|
||||||
<tr>
|
<tr class="card-table-header-row">
|
||||||
<th></th>
|
<th class="card-table-header-row-cell"></th>
|
||||||
<th>Portmaster</th>
|
<th class="card-table-header-row-cell">Portmaster</th>
|
||||||
<th>Pi-hole</th>
|
<th class="card-table-header-row-cell">Pi-hole</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody class="card-table-body">
|
||||||
<tr>
|
<tr class="card-table-body-row">
|
||||||
<td>Open Source</td>
|
<td class="card-table-body-row-cell-title">Open Source</td>
|
||||||
<td class="link">
|
<td class="card-table-body-row-cell">
|
||||||
<a href="{{ site.github_url }}/portmaster" class="exclude-external-icon">
|
<a class="card-table-body-row-cell-link" href="{{ site.github_url }}/portmaster">
|
||||||
<div>
|
<i class="icon-tick text-2xl text-green-500"></i>
|
||||||
<img src="{{ site.img_url }}icons/tick.svg">
|
</a>
|
||||||
</div>
|
</td>
|
||||||
<img src="{{ site.img_url }}icons/external-black.svg">
|
<td class="card-table-body-row-cell">
|
||||||
</a>
|
<a class="card-table-body-row-cell-link" href="https://github.com/pi-hole/pi-hole/">
|
||||||
</td>
|
<i class="icon-tick text-2xl text-green-500"></i>
|
||||||
<td class="link">
|
</a>
|
||||||
<a href="https://github.com/pi-hole/pi-hole/" class="exclude-external-icon">
|
</td>
|
||||||
<div>
|
</tr>
|
||||||
<img src="{{ site.img_url }}icons/tick.svg">
|
<tr class="card-table-body-row">
|
||||||
</div>
|
<td class="card-table-body-row-cell-title">Setup</td>
|
||||||
<img src="{{ site.img_url }}icons/external-black.svg">
|
<td class="card-table-body-row-cell">
|
||||||
</a>
|
Easy
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
<td class="card-table-body-row-cell">
|
||||||
<tr>
|
Advanced
|
||||||
<td>Setup</td>
|
</td>
|
||||||
<td><strong>Easy</strong></td>
|
</tr>
|
||||||
<td><strong>Advanced</strong></td>
|
<tr class="card-table-body-row">
|
||||||
</tr>
|
<td class="card-table-body-row-cell-title">Protection Type</td>
|
||||||
<tr>
|
<td class="card-table-body-row-cell">
|
||||||
<td>Protection Type</td>
|
Device
|
||||||
<td><strong>Device</strong></td>
|
</td>
|
||||||
<td><strong>Network</strong></td>
|
<td class="card-table-body-row-cell">
|
||||||
</tr>
|
Network
|
||||||
<tr>
|
</td>
|
||||||
<td>Availabilty</td>
|
</tr>
|
||||||
<td class="link">
|
<tr class="card-table-body-row">
|
||||||
<a href="{{ site.portmaster_url }}#downloads">
|
<td class="card-table-body-row-cell-title">Availabilty</td>
|
||||||
<div>
|
<td class="card-table-body-row-cell">
|
||||||
<img src="{{ site.img_url }}icons/windows.svg">
|
<a class="card-table-body-row-cell-link" href="{{ site.portmaster_url }}#downloads">
|
||||||
<img src="{{ site.img_url }}icons/linux.svg">
|
<div class="md:space-x-2">
|
||||||
</div>
|
<i class="icon-windows text-2xl text-safing-blue-500"></i>
|
||||||
<img src="{{ site.img_url }}icons/external-black.svg">
|
<i class="icon-linux text-2xl"></i>
|
||||||
</a>
|
</div>
|
||||||
</td>
|
</a>
|
||||||
<td class="link">
|
</td>
|
||||||
<a href="https://docs.pi-hole.net/main/prerequisites/#supported-operating-systems" class="exclude-external-icon">
|
<td class="card-table-body-row-cell">
|
||||||
<div>
|
<a class="card-table-body-row-cell-link" href="https://docs.pi-hole.net/main/prerequisites/#supported-operating-systems">
|
||||||
<img src="{{ site.img_url }}icons/linux.svg">
|
<div class="md:space-x-2">
|
||||||
<img src="{{ site.img_url }}icons/docker.svg">
|
<i class="icon-linux text-2xl"></i>
|
||||||
</div>
|
<i class="icon-docker text-3xl text-safing-blue-500"></i>
|
||||||
<img src="{{ site.img_url }}icons/external-black.svg">
|
</div>
|
||||||
</a>
|
</a>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr class="card-table-body-row">
|
||||||
<td>Secure DNS</td>
|
<td class="card-table-body-row-cell-title">Secure DNS</td>
|
||||||
<td><img src="{{ site.img_url }}icons/tick.svg"></td>
|
<td class="card-table-body-row-cell">
|
||||||
<td><img src="{{ site.img_url }}icons/tick.svg"></td>
|
<i class="icon-tick text-2xl text-green-500"></i>
|
||||||
</tr>
|
</td>
|
||||||
<tr>
|
<td class="card-table-body-row-cell">
|
||||||
<td>Individual Apps Settings</td>
|
<i class="icon-tick text-2xl text-green-500"></i>
|
||||||
<td><img src="{{ site.img_url }}icons/tick.svg"></td>
|
</td>
|
||||||
<td><img src="{{ site.img_url }}icons/cross.svg"></td>
|
</tr>
|
||||||
</tr>
|
<tr class="card-table-body-row">
|
||||||
<tr>
|
<td class="card-table-body-row-cell-title">Individual Apps Settings</td>
|
||||||
<td>Adaptive Threat Model</td>
|
<td class="card-table-body-row-cell">
|
||||||
<td><img src="{{ site.img_url }}icons/tick.svg"></td>
|
<i class="icon-tick text-2xl text-green-500"></i>
|
||||||
<td><img src="{{ site.img_url }}icons/cross.svg"></td>
|
</td>
|
||||||
</tr>
|
<td class="card-table-body-row-cell">
|
||||||
</tbody>
|
<i class="icon-cross text-2xl text-red-500"></i>
|
||||||
</table>
|
</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>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
## Detailed Comparison
|
## Detailed Comparison
|
||||||
|
|
||||||
### One Shoe Does Not Fit All - What Is Your Threat Model?
|
### 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/
|
- /community-hub/
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="mt-20 lg:mt-40 mb-16 lg:mb-48">
|
<section class="general-layout">
|
||||||
<div class="items-center h-full">
|
<div class="showcase-container-reverse">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="showcase-left" style="max-width: 1050px;">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex block justify-center m-auto w-auto items-center">
|
<img src="{{ site.img_url }}page-specific/about/team_overview.png" alt="">
|
||||||
<div class="pb-16 lg:pb-0 ml-0 lg:ml-32 lg:hidden self-center">
|
</div>
|
||||||
<img src="{{ site.img_url }}page-specific/about/team_overview.png" alt="">
|
<div class="showcase-right">
|
||||||
</div>
|
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||||
<div class="inline-block max-w-lg">
|
We <span class="text-safing-blue-500">love Freedom</span>, just like You
|
||||||
<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
|
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<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.
|
We are a bunch of ordinary people who want to change the world. Discontent with
|
||||||
</p>
|
the global state of mass surveillance, and seeing how it negatively impacts our
|
||||||
<p class="text-md opacity-55 max-w-lg pt-4">
|
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.
|
We still have a long way to go. We hope you'll join the journey.
|
||||||
</p>
|
</p>
|
||||||
<div class="py-10 flex">
|
<div class="col-container w-full text-left md:text-center lg:w-max lg:text-left">
|
||||||
<a href="{{ site.team_url }}">
|
<a class="btn-secondary" href="{{ site.team_url }}">View team overview</a>
|
||||||
<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">
|
<a class="btn-tertiary" href="#footer">Follow along</a>
|
||||||
View Team Overview
|
|
||||||
</button>
|
|
||||||
</a>
|
|
||||||
<a href="#footer" class="inline-flex pl-8 transition duration-150 ease-in-out hover:opacity-100 self-center uppercase opacity-55 text-xs font-bold">
|
|
||||||
Follow Along
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<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>
|
</div>
|
||||||
<div class="items-center h-full my-48">
|
<div class="feature-container">
|
||||||
<div class="flex items-center h-full">
|
<div class="feature-left">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<h2 class="feature-left-title">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-0 lg:flex">
|
Engage the problem at
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-0">
|
<span class="text-safing-blue-500">The Core</span>
|
||||||
<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
|
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<p class="feature-left-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.
|
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>
|
</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>
|
<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>
|
||||||
<div class="items-center h-full mt-8 md:mt-32">
|
<div class="showcase-container-reverse">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex">
|
<img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt="">
|
||||||
<div class="lg:pb-0 m0-0 lg:mr-32 self-center">
|
</div>
|
||||||
<img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
|
<div class="showcase-right">
|
||||||
</div>
|
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||||
<div class="inline-block max-w-lg">
|
A Simple Business Model
|
||||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10">
|
</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
|
Clear Ownership & Transparent Funding
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<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.
|
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>
|
</p>
|
||||||
<div class="py-10 flex">
|
<a class="btn-secondary" href="{{ site.ownership_url }}">Explore our influences</a>
|
||||||
<a href="{{ site.ownership_url }}">
|
|
||||||
<button type="button" style="background-color: #000;" class="transform hover:scale-95 inline-flex items-center px-10 py-3 border border-transparent text-xs leading-5 font-extrabold rounded-full text-white hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 active:bg-indigo-700 transition duration-150 ease-in-out uppercase">
|
|
||||||
Explore our influences
|
|
||||||
</button>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -1,5 +1,10 @@
|
||||||
---
|
---
|
||||||
---
|
---
|
||||||
|
|
||||||
@import "global";
|
/* Components */
|
||||||
@import "page_container";
|
/* 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 marketing_cards = all_cards | where_exp: "card", "card.projects contains 'Marketing'" %}
|
||||||
{% assign backoffice_cards = all_cards | where_exp: "card", "card.projects contains 'Back Office'" %}
|
{% assign backoffice_cards = all_cards | where_exp: "card", "card.projects contains 'Back Office'" %}
|
||||||
|
|
||||||
<section style="margin-top: 12rem; margin-bottom: 8rem;" class="mb-40">
|
<header class="header-three-container mt-32">
|
||||||
<div class="items-center h-full">
|
<div class="header-three-left">
|
||||||
<div class="relative max-w-screen-sm lg:max-w-screen-xl mx-auto px-4 sm:px-6 xl:px-0 lg:flex">
|
<span class="header-three-left-data">
|
||||||
<div class="pt-8">
|
{{ site.last_progress_update_on }}
|
||||||
<div class="text-center lg:text-left">
|
</span>
|
||||||
<span class="text-sm opacity-55 tracking-normal">{{ site.last_progress_update_on }}</span>
|
<h1 class="header-three-left-title">
|
||||||
<h2 id="influences" class="text-5xl tracking-tight font-extrabold leading-none pb-5 pt-2">
|
Backlog
|
||||||
Backlog
|
</h1>
|
||||||
</h2>
|
<p class="header-three-left-desc">
|
||||||
<p class="text-md opacity-55 max-w-lg mx-auto">
|
A big picture overview of our current
|
||||||
A big picture overview of our current mid- and long-term plans.
|
mid- and long-term plans.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
<div class="header-three-left-jump space-x-3">
|
||||||
<div class="pt-10 flex transform mx-auto justify-center lg:justify-start items-center">
|
<span class="title">Jump to:</span>
|
||||||
<span class="text-sm opacity-55 mr-4">
|
<div class="tag-list">
|
||||||
Jump to:
|
{% if portmaster_cards.size > 0 %}
|
||||||
</span>
|
|
||||||
<div class="flex">
|
|
||||||
{% if portmaster_cards.size > 0 %}
|
|
||||||
<a href="#portmaster" class="flex-1 pr-2" style="word-break: normal;">
|
<a href="#portmaster" class="flex-1 pr-2" style="word-break: normal;">
|
||||||
{% include tag.html tag='Portmaster' %}
|
{% include tag.html tag='Portmaster' %}
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if spn_cards.size > 0 %}
|
{% if spn_cards.size > 0 %}
|
||||||
<a href="#spn" class="flex-1 pr-2" style="word-break: normal;">
|
<a href="#spn" class="flex-1 pr-2" style="word-break: normal;">
|
||||||
{% include tag.html tag='SPN' %}
|
{% include tag.html tag='SPN' %}
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if website_cards.size > 0 %}
|
{% if website_cards.size > 0 %}
|
||||||
<a href="#website" class="flex-1 pr-2" style="word-break: normal;">
|
<a href="#website" class="flex-1 pr-2" style="word-break: normal;">
|
||||||
{% include tag.html tag='Website' %}
|
{% include tag.html tag='Website' %}
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if community_cards.size > 0 %}
|
{% if community_cards.size > 0 %}
|
||||||
<a href="#community" class="flex-1 pr-2" style="word-break: normal;">
|
<a href="#community" class="flex-1 pr-2" style="word-break: normal;">
|
||||||
{% include tag.html tag='Community' %}
|
{% include tag.html tag='Community' %}
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if marketing_cards.size > 0 %}
|
{% if marketing_cards.size > 0 %}
|
||||||
<a href="#marketing" class="flex-1 pr-2" style="word-break: normal;">
|
<a href="#marketing" class="flex-1 pr-2" style="word-break: normal;">
|
||||||
{% include tag.html tag='Marketing' %}
|
{% include tag.html tag='Marketing' %}
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if backoffice_cards.size > 0 %}
|
{% if backoffice_cards.size > 0 %}
|
||||||
<a href="#backoffice" class="flex-1 pr-2" style="word-break: normal;">
|
<a href="#backoffice" class="flex-1 pr-2" style="word-break: normal;">
|
||||||
{% include tag.html tag='Back Office' %}
|
{% include tag.html tag='Back Office' %}
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
<!-- <a class="tag-spn" href=""> SPN </a>
|
||||||
|
<a class="tag-spn" href=""> SPN </a>
|
||||||
|
<a class="tag-spn" href=""> SPN </a> -->
|
||||||
</div>
|
</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>
|
||||||
<div class="relative mt-24 lg:mt-0 lg:absolute lg:right-0 lg:mr-10">
|
<p class="header-three-left-extra">
|
||||||
{% assign progress_posts = site.publications | reverse | where: "progress_update", "true" %}
|
Disclaimer: Even if we'd love to accomplish everything
|
||||||
{% for post in progress_posts limit: 1 %}
|
listed below, some projects may turn out to be unfeasible.
|
||||||
{% include thumbnail_blog.html pre_header="BLOG" %}
|
</p>
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</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 %}
|
{% if portmaster_cards.size > 0 %}
|
||||||
<div class="pt-32">
|
<div class="collection-container" id="portmaster">
|
||||||
<div class="nextwrapper">
|
<div class="collection-container-top">
|
||||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
<div class="collection-container-top-title-counter items-center">
|
||||||
<span class="opacity-50" id="portmaster">Portmaster</span>
|
<span class="collection-container-top-title">
|
||||||
<strong class="pl-2 opacity-75">({{ portmaster_cards.size }})</strong>
|
Portmaster
|
||||||
</div>
|
</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 %}
|
{% for card in portmaster_cards %}
|
||||||
{% include project_card.html state='backlog' project='portmaster' %}
|
{% include project_card.html state='backlog' project='portmaster' %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
@ -89,12 +96,18 @@ layout: page
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if spn_cards.size > 0 %}
|
{% if spn_cards.size > 0 %}
|
||||||
<div class="pt-32">
|
<div class="collection-container" id="spn">
|
||||||
<div class="nextwrapper">
|
<div class="collection-container-top">
|
||||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
<div class="collection-container-top-title-counter items-center">
|
||||||
<span class="opacity-50" id="spn">Safing Privacy Network</span>
|
<span class="collection-container-top-title">
|
||||||
<strong class="pl-2 opacity-75">({{ spn_cards.size }})</strong>
|
Safing Privacy Network
|
||||||
</div>
|
</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 %}
|
{% for card in spn_cards %}
|
||||||
{% include project_card.html state='backlog' project='spn' %}
|
{% include project_card.html state='backlog' project='spn' %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
@ -102,12 +115,18 @@ layout: page
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if website_cards.size > 0 %}
|
{% if website_cards.size > 0 %}
|
||||||
<div class="pt-32">
|
<div class="collection-container" id="website">
|
||||||
<div class="nextwrapper">
|
<div class="collection-container-top">
|
||||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
<div class="collection-container-top-title-counter items-center">
|
||||||
<span class="opacity-50" id="website">Website</span>
|
<span class="collection-container-top-title">
|
||||||
<strong class="pl-2 opacity-75">({{ website_cards.size }})</strong>
|
Website
|
||||||
</div>
|
</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 %}
|
{% for card in website_cards %}
|
||||||
{% include project_card.html state='backlog' project='website' %}
|
{% include project_card.html state='backlog' project='website' %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
@ -115,12 +134,18 @@ layout: page
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if community_cards.size > 0 %}
|
{% if community_cards.size > 0 %}
|
||||||
<div class="pt-32">
|
<div class="collection-container" id="community">
|
||||||
<div class="nextwrapper">
|
<div class="collection-container-top">
|
||||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
<div class="collection-container-top-title-counter items-center">
|
||||||
<span class="opacity-50" id="community">Community</span>
|
<span class="collection-container-top-title">
|
||||||
<strong class="pl-2 opacity-75">({{ community_cards.size }})</strong>
|
Community
|
||||||
</div>
|
</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 %}
|
{% for card in community_cards %}
|
||||||
{% include project_card.html state='backlog' project='community' %}
|
{% include project_card.html state='backlog' project='community' %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
@ -128,12 +153,18 @@ layout: page
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if marketing_cards.size > 0 %}
|
{% if marketing_cards.size > 0 %}
|
||||||
<div class="pt-32">
|
<div class="collection-container" id="marketing">
|
||||||
<div class="nextwrapper">
|
<div class="collection-container-top">
|
||||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
<div class="collection-container-top-title-counter items-center">
|
||||||
<span class="opacity-50" id="marketing">Marketing</span>
|
<span class="collection-container-top-title">
|
||||||
<strong class="pl-2 opacity-75">({{ marketing_cards.size }})</strong>
|
Marketing
|
||||||
</div>
|
</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 %}
|
{% for card in marketing_cards %}
|
||||||
{% include project_card.html state='backlog' project='marketing' %}
|
{% include project_card.html state='backlog' project='marketing' %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
@ -141,12 +172,18 @@ layout: page
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if backoffice_cards.size > 0 %}
|
{% if backoffice_cards.size > 0 %}
|
||||||
<div class="pt-32">
|
<div class="collection-container" id="backoffice">
|
||||||
<div class="nextwrapper">
|
<div class="collection-container-top">
|
||||||
<div style="margin-top: -3rem;" class="flex absolute pl-8 ">
|
<div class="collection-container-top-title-counter items-center">
|
||||||
<span class="opacity-50" id="backoffice">Back Office</span>
|
<span class="collection-container-top-title">
|
||||||
<strong class="pl-2 opacity-75">({{ backoffice_cards.size }})</strong>
|
Back Office
|
||||||
</div>
|
</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 %}
|
{% for card in backoffice_cards %}
|
||||||
{% include project_card.html state='backlog' project='backoffice' %}
|
{% include project_card.html state='backlog' project='backoffice' %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
|
|
@ -3,34 +3,22 @@ title: Safing Blog
|
||||||
layout: page
|
layout: page
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="pt-16 md:pt-32 lg:pt-64">
|
<section class="general-layout">
|
||||||
<div class="items-center h-full">
|
<div class="blogpod-container mt-80">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="blogpod-container-top">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex">
|
<span class="blogpod-container-top-bg-title">Follow Us</span>
|
||||||
<div class="py-12 bg-white">
|
<h2 class="blogpod-container-top-title">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
Blog
|
||||||
<div class="lg:text-center">
|
</h2>
|
||||||
<!-- hide the huge "Follow Us" in mobile & md devices for now, made width problems -->
|
<div class="blogpod-container-top-extra">
|
||||||
<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>
|
<a class="link-secondary" href="{{ site.blog_feed_url }}"><i class="icon-rss"></i></a>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
</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>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -3,90 +3,74 @@ title: Business Model
|
||||||
layout: page
|
layout: page
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="mt-20 lg:mt-48 mb-16 lg:mb-48">
|
<section class="general-layout">
|
||||||
<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="showcase-container-reverse">
|
||||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
<div class="showcase-left" style="max-width: 1050px;">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
<img src="{{ site.img_url }}page-specific/business-model/provide-local-value-for-free-forever.png" alt="">
|
||||||
<h2 style="max-width: 404px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
</div>
|
||||||
Provide Local Value for Free, Forever
|
<div class="showcase-right">
|
||||||
</h2>
|
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
Provide Local Value for Free, Forever
|
||||||
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.
|
</h2>
|
||||||
</p>
|
<p class="showcase-right-desc">
|
||||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
Everybody deserves privacy, not only the wealthy. That is why
|
||||||
<a href="{{ site.portmaster_url }}">
|
all local privacy features are free, and will remain so forever.
|
||||||
<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">
|
This fits perfectly into the Freemium business model as well as
|
||||||
Discover the Portmaster
|
into FOSS, free and open source software.
|
||||||
</button>
|
</p>
|
||||||
</a>
|
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
|
||||||
</div>
|
|
||||||
</div>
|
</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>
|
||||||
<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="showcase-container">
|
||||||
<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="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:ml-32">
|
<img src="{{ site.img_url }}page-specific/business-model/only-pay-for-protection-in-transit.png" alt="">
|
||||||
<h2 style="max-width: 343px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10">
|
</div>
|
||||||
Sell Protection in Transit
|
<div class="showcase-right">
|
||||||
</h2>
|
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
Sell Protection in Transit
|
||||||
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.
|
</h2>
|
||||||
</p>
|
<p class="showcase-right-desc">
|
||||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
There is privacy that comes with a cost because it requires
|
||||||
<a href="{{ site.spn_url }}">
|
additional server bandwidth. Naturally, this is where we charge
|
||||||
<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">
|
for our powerful VPN alternative. You get an extra service,
|
||||||
Discover the SPN
|
we get to finance ourselves.
|
||||||
</button>
|
</p>
|
||||||
</a>
|
<a class="btn-secondary" href="{{ site.spn_url }}">Discover the SPN</a>
|
||||||
</div>
|
|
||||||
</div>
|
</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>
|
||||||
<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="showcase-container-reverse">
|
||||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
<img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt="">
|
||||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
</div>
|
||||||
Reinvest Earnings into Privacy
|
<div class="showcase-right">
|
||||||
</h2>
|
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
Reinvest Earnings into Privacy
|
||||||
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.
|
</h2>
|
||||||
</p>
|
<p class="showcase-right-desc">
|
||||||
<br>
|
All our income is invested into the privacy cycle: Finance amazing
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
talent. Develop great, open source software - both free and paid.
|
||||||
Repeat endlessly to spread privacy to the masses; strengthening the Freedom of our societies.
|
Delight users so more people join and support the cycle.
|
||||||
</p>
|
<br>
|
||||||
|
<br>
|
||||||
|
Repeat endlessly to spread privacy to the masses; strengthening
|
||||||
|
the Freedom of our societies.
|
||||||
|
</p>
|
||||||
</div>
|
</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>
|
||||||
<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="showcase-container">
|
||||||
<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="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:ml-32">
|
<img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
|
||||||
<h2 style="max-width: 473px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10">
|
</div>
|
||||||
Clear Ownership & Transparent Funding
|
<div class="showcase-right">
|
||||||
</h2>
|
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
Clear Ownership & Transparent Funding
|
||||||
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.
|
</h2>
|
||||||
</p>
|
<p class="showcase-right-desc">
|
||||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
Taking money always means opening up to influences. Therefore, we see it as
|
||||||
<a href="{{ site.ownership_url }}">
|
our duty to not only be open about our ownership, but also about how we
|
||||||
<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">
|
financed our journey so far.
|
||||||
Explore our influences
|
</p>
|
||||||
</button>
|
<a class="btn-secondary" href="{{ site.ownership_url }}">Explore our influences</a>
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
---
|
---
|
||||||
layout: page_container
|
layout: exception_container
|
||||||
title: Legal Disclosure - Impressum
|
title: Legal Disclosure - Impressum
|
||||||
heading: Contact
|
heading: Contact
|
||||||
container_class: imprint
|
container_class: imprint
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
---
|
---
|
||||||
layout: page_container
|
layout: exception_container
|
||||||
title: ESA Business Incubation
|
title: ESA Business Incubation
|
||||||
heading: ESA Business Incubation
|
heading: ESA Business Incubation
|
||||||
---
|
---
|
||||||
|
|
200
index.html
200
index.html
|
@ -5,142 +5,94 @@ title: Safing - Love Freedom
|
||||||
|
|
||||||
{% include header.html %}
|
{% include header.html %}
|
||||||
|
|
||||||
<section id="features" class="my-32 md:mt-16 md:mb-40">
|
<section class="general-layout">
|
||||||
|
<div class="showcase-container-reverse">
|
||||||
<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="showcase-left" style="max-width: 1050px;">
|
||||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
<img src="{{ site.img_url }}/page-specific/portmaster/monitor-network-activity.png" alt="">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
</div>
|
||||||
<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;">
|
<div class="showcase-right">
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||||
Alpha Software: Portmaster is in active development
|
<i class="icon-info text-md"></i>
|
||||||
|
<span>Alpha Software: Portmaster is in active development</span>
|
||||||
</div>
|
</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
|
Monitor All Network Activity
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<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.
|
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>
|
</p>
|
||||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
|
||||||
<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="">
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="showcase-container">
|
||||||
<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="showcase-left" style="max-width: 850px;">
|
||||||
<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">
|
<img src="{{ site.img_url }}/page-specific/portmaster/block-trackers-system-wide.png" alt="">
|
||||||
<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>
|
</div>
|
||||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
<div class="showcase-right">
|
||||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/block-trackers-system-wide.png" alt="">
|
<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>
|
</div>
|
||||||
|
<div class="showcase-container-reverse">
|
||||||
<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="showcase-left" style="max-width: 850px;">
|
||||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
<img src="{{ site.img_url }}/page-specific/portmaster/Set-global-and-per-app-configureation.png" alt="">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
</div>
|
||||||
<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;">
|
<div class="showcase-right">
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||||
Alpha Software: Portmaster is in active development
|
<i class="icon-info text-md"></i>
|
||||||
|
<span>Alpha Software: Portmaster is in active development</span>
|
||||||
</div>
|
</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;">
|
||||||
Set Global & per‑App Settings
|
Set Global & per‑App Settings
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<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.
|
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>
|
</p>
|
||||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
|
||||||
<a href="{{ site.portmaster_url }}">
|
</div>
|
||||||
<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">
|
</div>
|
||||||
Discover the Portmaster
|
<div class="blogpod-container">
|
||||||
</button>
|
<div class="blogpod-container-top">
|
||||||
</a>
|
<span class="blogpod-container-top-bg-title">Follow Us</span>
|
||||||
</div>
|
<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>
|
|
||||||
<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>
|
</div>
|
||||||
</section>
|
</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
|
title: Golang (or C/C++) Developer
|
||||||
heading: Golang (or C/C++) Developer
|
heading: Golang (or C/C++) Developer
|
||||||
---
|
---
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
---
|
---
|
||||||
layout: page_container
|
layout: exception_container
|
||||||
title: Join Safing
|
title: Join Safing
|
||||||
heading: 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
|
layout: page
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="mb-40 mt-32">
|
<header class="header-three-container mt-32">
|
||||||
<div class="items-center h-full">
|
<div class="header-three-left">
|
||||||
<div class="relative max-w-screen-sm lg:max-w-screen-xl mx-auto px-4 sm:px-6 xl:px-0 lg:flex">
|
<span class="header-three-left-data">
|
||||||
<div class="pt-8">
|
{{ site.last_progress_update_on }}
|
||||||
<div class="text-center lg:text-left">
|
</span>
|
||||||
<span class="text-sm opacity-55 tracking-normal">{{ site.last_progress_update_on }}</span>
|
<h1 class="header-three-left-title">
|
||||||
<h2 id="influences" class="text-5xl tracking-tight font-extrabold leading-none pb-10 pt-2">
|
|
||||||
Progress Overview
|
Progress Overview
|
||||||
</h2>
|
</h1>
|
||||||
<p class="text-md opacity-55 max-w-lg mx-auto">
|
<p class="header-three-left-desc">
|
||||||
Find out what the Safing team is currently working on. This is a compact overview of bigger tasks grouped by projects.
|
Without privacy there is no freedom of press, no
|
||||||
</p>
|
freedom of speech, not even freedom of thought.
|
||||||
</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.
|
|
||||||
</p>
|
</p>
|
||||||
<div class="py-10 flex">
|
</div>
|
||||||
<a href="{{ site.backlog_url }}">
|
<div class="header-three-right">
|
||||||
<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">
|
{% assign progress_posts = site.publications | reverse | where: "progress_update", "true" %}
|
||||||
Explore the Backlog
|
{% for post in progress_posts limit: 1 %}
|
||||||
</button>
|
{% include thumbnail_blog.html pre_header="BLOG" %}
|
||||||
</a>
|
{% 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>
|
</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="">
|
<img src="{{ site.img_url }}page-specific/next/files.png" alt="">
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
</section>
|
|
|
@ -5,248 +5,103 @@ redirect_from:
|
||||||
- /donate/
|
- /donate/
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="mt-20 md:mt-40">
|
<section class="general-layout">
|
||||||
<div class="items-center h-full">
|
<div class="showcase-container">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="showcase-left" style="max-width: 1050px;">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex">
|
<img src="{{ site.img_url }}page-specific/ownership/ownership.png" alt="">
|
||||||
<div class="lg:pb-0 m0-0 lg:mr-32 self-center">
|
</div>
|
||||||
<img src="{{ site.img_url }}page-specific/ownership/ownership.png" alt="">
|
<div class="showcase-right">
|
||||||
</div>
|
<h1 class="showcase-right-title" style="max-width: 450px;">
|
||||||
<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">
|
|
||||||
We own Safing
|
We own Safing
|
||||||
</h2>
|
</h1>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<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.
|
We do not want parties to gain influence which do not or might not stand
|
||||||
</p>
|
behind our values. That is why in the initial funding phase we took more
|
||||||
<p class="text-md opacity-55 max-w-lg pt-4">
|
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.
|
The legal entity behind Safing is <i>Safing ICS Technologies GmbH</i>, a private company registered in Austria.
|
||||||
</p>
|
</p>
|
||||||
<div class="py-10 md:flex text-center md:text-left inline-block">
|
<a class="btn-secondary" href="{{ site.company_agreement_url }}">View public registry</a>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="items-center h-full mt-8 md:mt-32 lg:mt-64">
|
<div class="showcase-container-reverse">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex block justify-center m-auto w-auto items-center">
|
<img src="{{ site.img_url }}page-specific/ownership/influences.png" alt="">
|
||||||
<div class="pb-16 lg:pb-0 ml-0 lg:ml-32 lg:hidden self-center">
|
</div>
|
||||||
<img src="{{ site.img_url }}page-specific/ownership/influences.png" alt="">
|
<div class="showcase-right">
|
||||||
</div>
|
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||||
<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">
|
|
||||||
Financed by Grants, Loans and <span style="color: #6188ff;">You</span>
|
Financed by Grants, Loans and <span style="color: #6188ff;">You</span>
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<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.
|
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>
|
||||||
<p class="text-md opacity-55 max-w-lg pt-4">
|
<a class="btn-secondary" href="#influences">Explore the Details</a>
|
||||||
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.
|
<a class="btn-tertiary hover-opacity-out" href="{{ site.spn_url }}#pricing">Support with a Purchase</a>
|
||||||
|
|
||||||
</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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
<div class="influence-container" id="influences">
|
||||||
<section style="margin-top: 6rem; margin-bottom: 8rem;" class="mb-40">
|
<div class="influence-container-top">
|
||||||
<div class="items-center h-full">
|
<div class="influence-container-top-title-date">
|
||||||
<div class="">
|
<h2 class="influence-container-top-title">
|
||||||
<div class="m">
|
Influences
|
||||||
<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>
|
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<span class="influence-container-top-data">updated November 2021</span>
|
||||||
Through these partnerships we are not only receiving funding, but much needed support, advice, training, encouragement and helpful criticism.
|
</div>
|
||||||
</p>
|
<p class="influence-container-top-desc">
|
||||||
<p class="text-md opacity-55 max-w-lg pt-4">
|
Through these partnerships we are not only receiving funding, but
|
||||||
To everyone involved - you know who you are: Thank you so much, we would not be here without you!
|
much needed support, advice, training, encouragement and helpful
|
||||||
</p>
|
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>
|
||||||
<div class="mt-24">
|
<div class="card-influence-bottom">
|
||||||
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10 mr-auto ml-auto">
|
{% for year in influence.years %}
|
||||||
<li class="text-center md:text-left">
|
<div class="card-influence-bottom-funding">
|
||||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover p-8 rounded-lg">
|
<span class="card-influence-bottom-funding-date">{{ year.year }}</span>
|
||||||
<div>
|
{% for item in year.items %}
|
||||||
<h1 class="text-2xl uppercase transition hover:opacity-55 ease-in-out duration-150">FFG</h1>
|
<span class="card-influence-bottom-funding-amount">
|
||||||
<span class="pt-4 opacity-55 font-extrabold">{{ site.data.finances.source.ffg.timespan }}</span>
|
{% if item.custom != null %}
|
||||||
<p class="pt-4 opacity-75">
|
<span>{{ item.custom }}</span>
|
||||||
The FFG is the national funding institution for Research & Development of Austria. Their goal is to strengthen innovation and the economy.
|
{% else %}
|
||||||
</p>
|
{% if item.status == "completed" %}
|
||||||
<p class="pt-4 opacity-75">
|
<span>Received</span>
|
||||||
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.
|
{% endif %}
|
||||||
</p>
|
<span class="font-extrabold">{{ item.amount }}€ {{ item.type }}</span>
|
||||||
</div>
|
{% if item.status == "open" %}
|
||||||
{% for year in site.data.finances.source.ffg.years %}
|
<small>held out in prospect</small>
|
||||||
<ul class="text-sm pt-4">
|
{% endif %}
|
||||||
<span class="font-medium opacity-55">{{ year.year }}</span>
|
{% endif %}
|
||||||
{% for item in year.items %}
|
</span>
|
||||||
<li class="opacity-75 font-medium">
|
{% endfor %}
|
||||||
{% if item.status == "completed" %}
|
</div>
|
||||||
Received
|
{% endfor %}
|
||||||
{% 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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -3,37 +3,23 @@ title: The Safing Podcast
|
||||||
layout: page
|
layout: page
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="pt-16 md:pt-32 lg:pt-64">
|
<section class="general-layout">
|
||||||
<div class="items-center h-full">
|
<div class="blogpod-container mt-80">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="blogpod-container-top">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex">
|
<span class="blogpod-container-top-bg-title">Follow Us</span>
|
||||||
<div class="py-12 bg-white">
|
<h2 class="blogpod-container-top-title">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
Podcast
|
||||||
<div class="lg:text-center">
|
</h2>
|
||||||
<!-- hide the huge "Follow Us" in mobile & md devices for now, made width problems -->
|
<div class="blogpod-container-top-extra">
|
||||||
<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>
|
<a class="link-secondary" href="{{ site.podcast_itunes_url }}"><i class="icon-podcast"></i></a>
|
||||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-5 md:py-10 text-center">Podcast</h2>
|
<a class="link-secondary" href="{{ site.podcast_feed_url }}"><i class="icon-rss"></i></a>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
</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>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -6,304 +6,242 @@ redirect_from:
|
||||||
- /download/
|
- /download/
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="notification w-full text-center text-white p-2" style="background-color: #6188ff;">
|
<div class="alert-primary rounded-none text-md">
|
||||||
<div class="mx-auto flex">
|
<i class="icon-info"></i>
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="ml-auto h-4 w-4 self-center mr-2">
|
<span>Portmaster is Alpha Software - expect hiccups here and there</span>
|
||||||
<span class="w-auto text-sm mr-auto">Portmaster is Alpha Software - expect hiccups here and there</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<header class="h-full my-20 md:my-40">
|
<header class="header-two-container mb-64">
|
||||||
<div class="flex items-center h-ful">
|
<div class="header-two-top">
|
||||||
<div class="h-full mx-auto ">
|
<h1 class="header-two-top-title">
|
||||||
<div class="text-center">
|
|
||||||
<h2 class="text-5xl sm:text-6xl tracking-tight font-extrabold leading-none py-10">
|
|
||||||
Take Back Control of Your Computer
|
Take Back Control of Your Computer
|
||||||
</h2>
|
</h1>
|
||||||
<div class="self-center">
|
<p class="header-two-top-desc">
|
||||||
<p class="text-md opacity-55 max-w-lg mx-auto">
|
Portmaster is a free and open-source application that puts
|
||||||
Portmaster is a free and open-source application that puts you back in charge over all your computer's network connections.
|
you back in charge over all your computer's network
|
||||||
</p>
|
connections.
|
||||||
<div class="py-10 sm:py-10 block mx-auto">
|
</p>
|
||||||
<a href="#downloads">
|
<a class="btn-secondary" href="#download">Download for free</a>
|
||||||
<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">
|
</div>
|
||||||
download for free
|
<div class="header-two-bottom">
|
||||||
</button>
|
<img src="{{ site.img_url }}page-specific/portmaster/full-interface.png" alt="">
|
||||||
</a>
|
</div>
|
||||||
</div>
|
<div class="header-bg">
|
||||||
</div>
|
<svg viewBox="0 0 862.55555573 533">
|
||||||
</div>
|
<rect width="100%" height="100%" fill="transparent" />
|
||||||
<div class="pt-6">
|
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||||
<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="">
|
<stop offset="45%" style="stop-color:rgb(255,255,255);stop-opacity:1" />
|
||||||
</div>
|
<stop offset="100%" style="stop-color:rgb(203, 216, 255);stop-opacity:1" />
|
||||||
<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">
|
</linearGradient>
|
||||||
<img src="{{ site.img_url }}page-specific/portmaster/wave.png" alt="">
|
<linearGradient id="grad2" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||||
</span>
|
<stop offset="0%" style="stop-color:rgb(255,255,255);stop-opacity:1" />
|
||||||
</div>
|
<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>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<section id="features" class="my-32 md:pt-32 md:mb-40 ">
|
<section class="general-layout">
|
||||||
<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="showcase-container-reverse">
|
||||||
<div class=" mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
<div class="showcase-left" style="max-width: 1050px;">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
<img src="{{ site.img_url }}page-specific/portmaster/monitor-network-activity.png" alt="">
|
||||||
<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;">
|
</div>
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<div class="showcase-right">
|
||||||
Alpha Software: Portmaster is in active development
|
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||||
</div>
|
<i class="icon-info text-md"></i>
|
||||||
<h2 style="max-width: 400px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
<span>Alpha Software: Portmaster is in active development</span>
|
||||||
Monitor All Network Activity
|
</div>
|
||||||
</h2>
|
<h2 class="showcase-right-title" style="max-width: 350px;">
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
Monitor All Network Activity
|
||||||
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.
|
</h2>
|
||||||
</p>
|
<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>
|
|
||||||
<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>
|
||||||
<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="showcase-container">
|
||||||
<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="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:mr-4 inline-block max-w-lg lg:ml-32">
|
<img src="{{ site.img_url }}page-specific/portmaster/manually-allow-ord-block-connections.png" alt="">
|
||||||
<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;">
|
</div>
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<div class="showcase-right">
|
||||||
Alpha Software: Portmaster is in active development
|
<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 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
|
Block Unwanted Connections
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
<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.
|
Many programs connect to the Internet without your knowledge. When you
|
||||||
|
find unwanted connections, you can now simply block them.
|
||||||
</p>
|
</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>
|
</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="showcase-container-reverse">
|
||||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
<img src="{{ site.img_url }}/page-specific/portmaster/block-trackers-system-wide.png" alt="">
|
||||||
<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;">
|
</div>
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<div class="showcase-right">
|
||||||
Alpha Software: Portmaster is in active development
|
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||||
</div>
|
<i class="icon-info text-md"></i>
|
||||||
<h2 style="max-width: 403px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold leading-none pt-8 pb-10 lg:w-auto">
|
<span>Alpha Software: Portmaster is in active development</span>
|
||||||
Auto-Block via Selected Filter Lists
|
</div>
|
||||||
</h2>
|
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
Auto-Block via Selected Filter Lists
|
||||||
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.
|
</h2>
|
||||||
</p>
|
<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>
|
||||||
<!-- <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>
|
||||||
<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="showcase-container">
|
||||||
<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="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:mr-4 inline-block max-w-lg lg:ml-32">
|
<img src="{{ site.img_url }}page-specific/portmaster/enforce-dns-over-tls.png" alt="">
|
||||||
<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;">
|
</div>
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<div class="showcase-right">
|
||||||
Alpha Software: Portmaster is in active development
|
<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 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
|
Enforce Secure DNS
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
<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.
|
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>
|
</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>
|
</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="showcase-container-reverse">
|
||||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
<img src="{{ site.img_url }}page-specific/portmaster/explore-the-docs-and-source-code.png" alt="">
|
||||||
<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;">
|
</div>
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<div class="showcase-right">
|
||||||
Alpha Software: Portmaster is in active development
|
<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 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
|
Explore the Docs and Source Code
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
<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.
|
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>
|
</p>
|
||||||
</div>
|
<div class="col-container w-full text-left md:text-center lg:w-max lg:text-left">
|
||||||
<div class="py-10 sm:py-10 text-center sm:flex">
|
<a class="btn-secondary" href="{{ site.docs_url }}">Checkout the docs</a>
|
||||||
<a href="{{ site.docs_url }}">
|
<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>
|
||||||
<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">
|
</div>
|
||||||
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>
|
</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="showcase-container">
|
||||||
<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="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:mr-4 inline-block max-w-lg lg:ml-32">
|
<img src="{{ site.img_url }}page-specific/portmaster/configure-settings-for-different-networks.png" alt="">
|
||||||
<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;">
|
</div>
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<div class="showcase-right">
|
||||||
Alpha Software: Portmaster is in active development
|
<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 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
|
Configure Settings for Different Networks
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-lg" style="max-width: 471px;">
|
<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.
|
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>
|
</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>
|
</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="showcase-container-reverse">
|
||||||
<div class="mx-auto lg:mr-0 lg:ml-auto mt-16 md:my-auto px-4 md:px-0">
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
<div class="md:ml-4 inline-block max-w-lg lg:mr-32">
|
<img src="{{ site.img_url }}/page-specific/portmaster/Set-global-and-per-app-configureation.png" alt="">
|
||||||
<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>
|
</div>
|
||||||
</div>
|
<div class="showcase-right">
|
||||||
<div class="mx-auto md:ml-auto row-start-1 self-end md:self-center">
|
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||||
<img class="" src="{{ site.img_url }}page-specific/portmaster/Set-global-and-per-app-configureation.png" alt="">
|
<i class="icon-info text-md"></i>
|
||||||
</div>
|
<span>Alpha Software: Portmaster is in active development</span>
|
||||||
</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>
|
</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>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
<div class="download-container" id="download">
|
||||||
<section class="mb-16 lg:pb-32" id="faq">
|
<h2 class="download-container-title" id="downloads">
|
||||||
<div class="bg-white">
|
Download
|
||||||
<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">
|
</h2>
|
||||||
<div class="text-center pb-12">
|
<div class="alert-primary max-w-3xl mx-auto">
|
||||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
<i class="icon-twitter text-xs"></i>
|
||||||
FAQ
|
<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>
|
</h2>
|
||||||
<p class="text-md opacity-55">
|
<p class="faq-container-top-desc">
|
||||||
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>
|
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>
|
</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>
|
||||||
|
<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>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
---
|
---
|
||||||
layout: page_container
|
layout: legal_container
|
||||||
title: Privacy Policy
|
title: Privacy Policy
|
||||||
heading: 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
|
layout: page
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="notification w-full text-center text-white p-2" style="background-color: #6188ff;">
|
<div class="alert-primary rounded-none text-md">
|
||||||
<div class="mx-auto flex">
|
<i class="icon-info text-md"></i>
|
||||||
<!-- use this disclaimer after the free month
|
<a data-method="get" href="https://docs.safing.io/spn/alpha/status">
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="ml-auto h-4 w-4 self-center mr-2">
|
<span>
|
||||||
<div class="mr-auto">
|
SPN is in "Alpha". View
|
||||||
<span class="w-auto text-sm">SPN is in Alpha - expect hiccups here and there, even as a customer.</span>
|
<span class="underline">what to expect</span>
|
||||||
</div>
|
from current speeds and features
|
||||||
-->
|
|
||||||
<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
|
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<header class="h-full">
|
<header class="header-one-container-reverse mb-64 mt-36">
|
||||||
<div class="flex items-center h-full pt-20 md:pt-32 md:pb-40">
|
<div class="header-one-left pl-12">
|
||||||
<div class="container mx-auto sm:px-8 sm:px-0">
|
<h1 class="header-one-left-title lg:max-w-md">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
Safing Privacy Network
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex">
|
</h1>
|
||||||
<div class="lg:pb-0 m0-0 lg:mr-40 self-center">
|
<p class="header-one-left-desc">
|
||||||
<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">
|
With the SPN you protect all your connections from mass
|
||||||
<img src="{{ site.img_url }}shapes/circle-md.png" alt="">
|
surveillance. Prevent all Internet Service Providers
|
||||||
</span>
|
from collecting and selling your private activities.
|
||||||
<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"
|
</p>
|
||||||
controls></video>
|
<div class="col-container w-full text-center lg:w-max lg:text-left">
|
||||||
<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">
|
<a class="btn-primary" href="#pricing">Get started</a>
|
||||||
<img src="{{ site.img_url }}shapes/circle-sm.png" alt="">
|
<a class="btn-tertiary" href="{{ site.portmaster_url }}">Built into the Portmaster</a>
|
||||||
</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>
|
|
||||||
</div>
|
</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>
|
</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>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<section style="margin-top: 3rem;">
|
<section class="general-layout">
|
||||||
<div class="text-center pb-24 lg:pb-48">
|
<div class="intro-container mt-32">
|
||||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 mr-auto ml-auto">
|
<h2 class="intro-container-title">
|
||||||
Protect Your Meta‑Data
|
Protect Your Meta‑Data
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 w-auto mx-auto max-w-lg">
|
<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.
|
Seek true privacy. Do not overlook meta-data: which websites
|
||||||
</p>
|
you visit and how frequently tell more about you than knowing
|
||||||
</div>
|
what you actually do on them.
|
||||||
<div class="items-center h-full">
|
</p>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="space-y-80">
|
||||||
<div class="items-center h-full mt-32 lg:mt-64">
|
<div class="showcase-container-reverse">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex block justify-center m-auto w-auto">
|
<img src="{{ site.img_url }}page-specific/spn/layers.gif" alt="">
|
||||||
<div class="ml-0 lg:ml-32 lg:hidden self-center">
|
</div>
|
||||||
<img src="{{ site.img_url }}page-specific/spn/metadata.gif" 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: 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>
|
||||||
<div class="inline-block max-w-lg">
|
<div class="showcase-container">
|
||||||
<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;">
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
<img src="{{ site.img_url }}icons/info.svg" class="h-4 w-4 self-center mr-2">
|
<img src="{{ site.img_url }}page-specific/spn/metadata.gif" alt="">
|
||||||
Alpha Software: the SPN is in active development
|
</div>
|
||||||
</div>
|
<div class="showcase-right">
|
||||||
<h2 style="max-width: 470px; line-height: 60px;" class="text-5xl tracking-tight font-extrabold py-10 lg:w-auto">
|
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||||
Minimize Your Meta‑Data
|
<i class="icon-info text-md"></i>
|
||||||
</h2>
|
<span>Alpha Software: the SPN is in active development </span>
|
||||||
<p class="text-md opacity-55 max-w-lg">
|
</div>
|
||||||
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.
|
<h2 class="showcase-right-title" style="max-width: 450px;">
|
||||||
</p>
|
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>
|
||||||
<div class="hidden pt-16 lg:pt-0 ml-0 lg:ml-32 lg:block self-center">
|
<div class="showcase-container-reverse">
|
||||||
<img src="{{ site.img_url }}page-specific/spn/metadata.gif" alt="">
|
<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 class="showcase-container">
|
||||||
</div>
|
<div class="showcase-left" style="max-width: 850px;">
|
||||||
</div>
|
<img src="{{ site.img_url }}page-specific/spn/switch.gif" alt="">
|
||||||
<div class="items-center h-full mt-32 lg:mt-64">
|
</div>
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="showcase-right">
|
||||||
<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="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
|
||||||
<div class="ml-0 lg:ml-32 lg:hidden self-center">
|
<i class="icon-info text-md"></i>
|
||||||
<img src="{{ site.img_url }}page-specific/spn/network.png" alt="">
|
<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>
|
||||||
<div class="inline-block max-w-lg">
|
<div class="packages-container" id="pricing">
|
||||||
<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;">
|
<div class="alert-primary mb-20">
|
||||||
<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">
|
|
||||||
<a data-method="get" href="{{ site.spn_alpha_status_page_url }}">
|
<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
|
SPN is in "Alpha". View
|
||||||
<span class="underline">what to expect</span>
|
<span class="underline">what to expect</span>
|
||||||
from current speeds and features
|
from current speeds and features
|
||||||
</button>
|
</span>
|
||||||
</a>
|
</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>
|
||||||
<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">
|
<div class="packages-container-top">
|
||||||
<li class="text-center md:text-left">
|
<h2 class="packages-container-top-title">
|
||||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover px-16 py-10 rounded-lg">
|
Protect Your Connections Today
|
||||||
<span class="text-2xl">Early Adopter Monthly</span>
|
</h2>
|
||||||
<div class="block pb-6">
|
<p class="packages-container-top-desc">
|
||||||
<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>
|
Subscribe to the SPN and lock in the lower Alpha prices forever.
|
||||||
<span class="text-xl pl-1 opacity-55 line-through">11.90€</span>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<span class="font-extrabold pt-10 text-md">Includes:</span>
|
<div class="packages-container-bottom">
|
||||||
<ul class="">
|
<div class="card-package">
|
||||||
<li class="pt-4 opacity-55">Access to the SPN</li>
|
<div class="card-package-top">
|
||||||
<li class="pt-4 opacity-55">Unlimited Bandwidth</li>
|
<span class="card-package-top-title">Early Adopter Monthly</span>
|
||||||
<li class="pt-4 opacity-55">Use on up to 5 devices</li>
|
<span class="card-package-top-amount">
|
||||||
<li class="pt-4 opacity-55">17% off compared to Beta-Prices</li>
|
9.90€ <span class="billing">/ per month</span>
|
||||||
</ul>
|
</span>
|
||||||
<div class="pt-16">
|
<span class="card-package-top-offer">11.90€</span>
|
||||||
<a href="{{ site.account_server_url }}plans/1/subscribe">
|
</div>
|
||||||
<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">
|
<div class="card-package-middle space-y-4">
|
||||||
Subscribe
|
<span class="card-package-middle-includes"> Includes: </span>
|
||||||
</button>
|
<span class="card-package-middle-includes-feature"> Access to the SPN </span>
|
||||||
</a>
|
<span class="card-package-middle-includes-feature"> Unlimited Bandwidth </span>
|
||||||
</div>
|
<span class="card-package-middle-includes-feature"> Use on up to 5 devices </span>
|
||||||
</div>
|
<span class="card-package-middle-includes-feature"> 17% off compared to Beta-Prices </span>
|
||||||
</li>
|
</div>
|
||||||
<li class="mt-10 md:mt-0 text-center md:text-left">
|
<div class="card-package-bottom">
|
||||||
<div class="block transform hover:scale-105 duration-150 ease-in-out hover px-16 py-10 rounded-lg">
|
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/1/subscribe">Subscribe</a>
|
||||||
<span class="text-2xl">Early Adopter Yearly</span>
|
</div>
|
||||||
<div class="block pb-6">
|
</div>
|
||||||
<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>
|
<div class="card-package">
|
||||||
<span class="text-xl pl-1 opacity-55 line-through">142.80€</span>
|
<div class="card-package-top">
|
||||||
</div>
|
<span class="card-package-top-title">Early Adopter Yearly</span>
|
||||||
<span class="font-extrabold pt-10 text-md">Includes:</span>
|
<span class="card-package-top-amount">
|
||||||
<ul>
|
99.00€ <span class="billing">/ per year</span>
|
||||||
<li class="pt-4 opacity-55">Access to the SPN</li>
|
</span>
|
||||||
<li class="pt-4 opacity-55">Unlimited Bandwidth</li>
|
<span class="card-package-top-offer">142.80</span>
|
||||||
<li class="pt-4 opacity-55">Use on up to 5 devices</li>
|
</div>
|
||||||
<li class="pt-4 opacity-55">30% off compared to Beta-Prices</li>
|
<div class="card-package-middle space-y-4">
|
||||||
</ul>
|
<span class="card-package-middle-includes"> Includes: </span>
|
||||||
<div class="pt-16">
|
<span class="card-package-middle-includes-feature"> Access to the SPN </span>
|
||||||
<a href="{{ site.account_server_url }}plans/2/subscribe">
|
<span class="card-package-middle-includes-feature"> Unlimited Bandwidth </span>
|
||||||
<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">
|
<span class="card-package-middle-includes-feature"> Use on up to 5 devices </span>
|
||||||
Subscribe
|
<span class="card-package-middle-includes-feature"> 30% off compared to Beta-Prices </span>
|
||||||
</button>
|
</div>
|
||||||
</a>
|
<div class="card-package-bottom">
|
||||||
</div>
|
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/2/subscribe">Subscribe</a>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</div>
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="faq-container">
|
||||||
</div>
|
<div class="faq-container-top">
|
||||||
</div>
|
<h2 class="faq-container-top-title">
|
||||||
</section>
|
FAQ
|
||||||
<section class="mb-16 lg:pb-32" id="faq">
|
</h2>
|
||||||
<div class="bg-white">
|
<p class="faq-container-top-desc">
|
||||||
<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">
|
You have a question? We answered some already, but you
|
||||||
<div class="text-center pb-12">
|
can always contact us at <a class="link-primary" href="mailto:hello@safing.io">hello@safing.io</a>
|
||||||
<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 }}
|
|
||||||
</p>
|
</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>
|
</div>
|
||||||
{% endfor %}
|
<div class="faq-container-bottom">
|
||||||
<div>
|
{% for faq in site.data.faq.spn %}
|
||||||
<h1 class="text-xl pb-4">Where can I find your source code?</h1>
|
<div class="faq-container-bottom-question">
|
||||||
<dd class="mt-2">
|
<div class="card-faq hover-scale-out">
|
||||||
<p class="text-md" style="color: #727272;">
|
<label class="card-label" for="card-toggle-anchor-{{ forloop.index }}">
|
||||||
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.
|
<div class="wrapper-left">
|
||||||
</p>
|
<div class="card-title">
|
||||||
</dd>
|
<h3 class="title">
|
||||||
</div>
|
{{ faq.q }}
|
||||||
</dl>
|
</h3>
|
||||||
</div>
|
</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>
|
||||||
</div>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -3,219 +3,159 @@ title: Get Help
|
||||||
layout: page
|
layout: page
|
||||||
---
|
---
|
||||||
|
|
||||||
<header class="h-full py-40">
|
|
||||||
<div class="flex items-center">
|
<section class="general-layout">
|
||||||
<div class="container mx-auto px-8 sm:px-0">
|
<div class="download-container">
|
||||||
<div class="text-center">
|
<h1 class="download-container-title">Support</h1>
|
||||||
<h2 class="text-5xl sm:text-6xl tracking-tight font-extrabold leading-none py-10">
|
<p class="download-container-extra">
|
||||||
Support
|
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>
|
</h2>
|
||||||
<div class="self-center">
|
<div class="space-y-8 max-w-3xl mx-auto">
|
||||||
<p class="text-md opacity-55 max-w-lg mx-auto">
|
<p class="download-container-extra">
|
||||||
What do you need help with?
|
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>
|
</p>
|
||||||
<div class="py-10 sm:py-16 block ">
|
<div class="alert-primary">
|
||||||
<a href="#portmaster">
|
<i class="icon-info text-md"></i>
|
||||||
<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">
|
<span> Portmaster is Alpha Software, thanks for being an Early Adopter. Bug reports are appreciated.</span>
|
||||||
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>
|
</div>
|
||||||
</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>
|
<div class="faq-container">
|
||||||
</div>
|
<div class="faq-container-top">
|
||||||
</header>
|
<h2 class="faq-container-top-title">
|
||||||
|
FAQ
|
||||||
<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
|
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-md opacity-55 max-w-screen-sm mx-auto">
|
<p class="faq-container-top-desc">
|
||||||
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.
|
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>
|
</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 class="faq-container-bottom">
|
||||||
</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">
|
|
||||||
{% for faq in site.data.faq.portmaster %}
|
{% for faq in site.data.faq.portmaster %}
|
||||||
<div>
|
<div class="faq-container-bottom-question">
|
||||||
<h1 class="text-xl pb-4">
|
<div class="card-faq hover-scale-out">
|
||||||
{{ faq.q }}
|
<label class="card-label" for="card-toggle-anchor-portmaster-{{ forloop.index }}">
|
||||||
</h1>
|
<div class="wrapper-left">
|
||||||
<dd class="mt-2">
|
<div class="card-title">
|
||||||
<p class="text-md opacity-55">
|
<h3 class="title">
|
||||||
{{ faq.a }}
|
{{ faq.q }}
|
||||||
</p>
|
</h3>
|
||||||
</dd>
|
</div>
|
||||||
{% if faq.link %}
|
</div>
|
||||||
<p class="text-md pt-4" style="color: #727272;">
|
<div class="wrapper-right">
|
||||||
<a class="link" href="{{ faq.link.url }}">
|
<i class="icon-arrow"></i>
|
||||||
{{ faq.link.text }}
|
</div>
|
||||||
</a>
|
</label>
|
||||||
</p>
|
<input class="card-input-toggle" id="card-toggle-anchor-portmaster-{{ forloop.index }}" type="checkbox">
|
||||||
{% endif %}
|
<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>
|
</div>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
<div>
|
{% include source_code_faq.html %}
|
||||||
<h1 class="text-xl pb-4">Where can I find your source code?</h1>
|
</div>
|
||||||
<dd class="mt-2">
|
</div>
|
||||||
<p class="text-md" style="color: #727272;">
|
<div class="space-y-36" id="spn">
|
||||||
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.
|
<div class="download-container">
|
||||||
</p>
|
<h2 class="download-container-title">
|
||||||
</dd>
|
Safing Privacy Network
|
||||||
</div>
|
</h2>
|
||||||
</dl>
|
<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>
|
</div>
|
||||||
</div>
|
<div class="faq-container">
|
||||||
</section>
|
<div class="faq-container-top">
|
||||||
|
<h2 class="faq-container-top-title">
|
||||||
<section class="my-20" id="spn">
|
FAQ
|
||||||
<div class="items-center h-full">
|
</h2>
|
||||||
<div class="max-w-full mx-auto px-4 sm:px-6">
|
<p class="faq-container-top-desc">
|
||||||
<div class="py-12 bg-white">
|
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.
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
</p>
|
||||||
<div class="text-center">
|
</div>
|
||||||
<h2 id="downloads" class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">
|
<div class="faq-container-bottom">
|
||||||
Safing Privacy Network
|
{% for faq in site.data.faq.spn %}
|
||||||
</h2>
|
<div class="faq-container-bottom-question">
|
||||||
</div>
|
<div class="card-faq hover-scale-out">
|
||||||
<div class="mx-auto text-center">
|
<label class="card-label" for="card-toggle-anchor-spn-{{ forloop.index }}">
|
||||||
<div class="text-center lg:text-left lg:inline-flex items-center mt-16 mb-16 spn-shadow p-10 rounded-lg">
|
<div class="wrapper-left">
|
||||||
<div class="flex items-center justify-center pl-2 md:pl-0 h-12 md:w-12 w-auto mr-auto ml-auto">
|
<div class="card-title">
|
||||||
<svg class="h-8 w-8" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
<h3 class="title">
|
||||||
<g fill="none">
|
{{ faq.q }}
|
||||||
<path d="M0 0h24v24H0z" />
|
</h3>
|
||||||
<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" />
|
</div>
|
||||||
<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" />
|
</div>
|
||||||
</g>
|
<div class="wrapper-right">
|
||||||
</svg>
|
<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>
|
</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>
|
{% endfor %}
|
||||||
</div>
|
{% include source_code_faq.html faq_id='spn-0'%}
|
||||||
</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>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
143
team/index.html
143
team/index.html
|
@ -3,89 +3,72 @@ title: Team Overview
|
||||||
layout: page
|
layout: page
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="my-40">
|
<div class="header-four-container mt-48">
|
||||||
<div class="items-center h-full">
|
<span class="header-four-container-counter">Team</span>
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<h1 class="header-four-container-title">Who We Are</h1>
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex">
|
</div>
|
||||||
<div class="py-12">
|
<section class="general-layout">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="space-y-28">
|
||||||
<div class="lg:text-center">
|
<div class="space-y-40">
|
||||||
<!-- fix this text size once we have customizable tailwind -->
|
{% for member in site.data.team.members %}
|
||||||
<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>
|
<div class="team-member" id="{{ member.name | slugify }}">
|
||||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-10 text-center">Who We Are</h2>
|
<div class="team-member-left">
|
||||||
</div>
|
<div class="team-member-left-profile relative">
|
||||||
<div class="mt-32">
|
<img src="{{ site.img_url }}profiles/{{ member.name | slugify }}.png" alt="{{ member.name }}">
|
||||||
<ul class="grid grid-cols-1">
|
</div>
|
||||||
|
<div class="team-member-left-scoial">
|
||||||
{% for member in site.data.team.members %}
|
{% for handle in member.handles %}
|
||||||
<li class="pb-40 lg:pb-24" id="{{ member.name | slugify }}">
|
<a href="{{ handle.external_url }}" target="_blank"><i class="icon-{{ handle.icon }} text-md"></i></a>
|
||||||
<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>
|
|
||||||
|
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
</div>
|
||||||
<li class="mb-40 lg:mb-24 bg-black opacity-25" style="height: 2px;"></li>
|
</div>
|
||||||
|
<div class="team-member-right">
|
||||||
{% for external in site.data.team.externals %}
|
<span class="team-member-right-postion">
|
||||||
<li class="pb-40 lg:pb-24" id="{{ external.name | slugify }}">
|
{{ member.title }}
|
||||||
<div class="text-center lg:text-left lg:flex items-center">
|
</span>
|
||||||
<div class="pb-8 lg:-mb-10">
|
<span class="team-member-right-name">
|
||||||
<img class="mx-auto" src="{{ site.img_url }}profiles/{{ external.name | slugify }}.png" alt="{{ external.name }}">
|
{{ 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">
|
</span>
|
||||||
<img src="{{ site.img_url }}shapes/square.png" alt="">
|
<span class="team-member-right-date">
|
||||||
</span>
|
Joined {{ member.joined }}
|
||||||
<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">
|
</span>
|
||||||
<img src="{{ site.img_url }}shapes/square.png" alt="">
|
<p class="team-member-right-desc">
|
||||||
</span>
|
{{ member.description }}
|
||||||
<div class="flex mx-auto justify-center pt-5">
|
</p>
|
||||||
{% 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>
|
</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>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
---
|
---
|
||||||
layout: page_container
|
layout: legal_container
|
||||||
title: Terms of Service
|
title: Terms of Service
|
||||||
heading: 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
|
layout: page
|
||||||
---
|
---
|
||||||
|
|
||||||
<section class="pt-16 md:pt-32 lg:pt-64">
|
<section class="general-layout">
|
||||||
<div class="items-center h-full">
|
<div class="blogpod-container mt-80">
|
||||||
<div class="container mx-auto px-8 sm:px-0 flex">
|
<div class="blogpod-container-top">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:flex">
|
<span class="blogpod-container-top-bg-title">Follow Us</span>
|
||||||
<div class="py-12 bg-white">
|
<h2 class="blogpod-container-top-title">
|
||||||
<div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8">
|
Video Updates
|
||||||
<div class="lg:text-center">
|
</h2>
|
||||||
<!-- hide the huge "Follow Us" in mobile & md devices for now, made width problems -->
|
<div class="blogpod-container-top-extra">
|
||||||
<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>
|
<a class="link-secondary" href="{{ site.youtube_channel_url }}">YouTube</a>
|
||||||
<h2 class="text-5xl tracking-tight font-extrabold leading-none py-5 md:py-10 text-center">Video Updates</h2>
|
<a class="link-secondary" href="{{ site.invidious_channel_url }}">Invidious</a>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
</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>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
Loading…
Add table
Reference in a new issue