1
0
Fork 0
mirror of https://github.com/safing/web synced 2025-04-17 01:19:08 +00:00

Tweak index, PM and SPN page

- insert missing hrefs
- remove buttons
- put in correct text
- add info banner
This commit is contained in:
davegson 2022-02-07 14:14:09 +01:00
parent 004e0b86cc
commit d0fb06a7b9
4 changed files with 110 additions and 94 deletions

View file

@ -12,7 +12,7 @@
Without privacy there is no freedom of press, no freedom of speech,
not even freedom of thought.
</p>
<a class="btn-secondary" href="#">Take back your freedom</a>
<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="">

View file

@ -19,11 +19,11 @@ title: Safing - Love Freedom
Monitor All Network Activity
</h2>
<p class="showcase-right-desc">
Discover everything that is happening on your computer. Expose every
connection your applications make and detect evil ones. Finally get
the power to act accordingly.
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>
<a class="btn-secondary" href="#">Discover the portmaster</a>
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
</div>
</div>
<div class="showcase-container">
@ -40,10 +40,10 @@ title: Safing - Love Freedom
</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.
advertisements and trackers for every application. Easily add
your own rules and block individual domains.
</p>
<a class="btn-secondary" href="#">Discover the portmaster</a>
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
</div>
</div>
<div class="showcase-container-reverse">
@ -59,12 +59,12 @@ title: Safing - Love Freedom
Set Global & perApp 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.
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>
<a class="btn-secondary" href="#">Discover the portmaster</a>
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
</div>
</div>
@ -96,4 +96,4 @@ title: Safing - Love Freedom
<a class="btn-secondary" href="{{ site.video_url }}">Videos</a>
</div>
</div>
</section>
</section>

View file

@ -7,7 +7,8 @@ redirect_from:
---
<div class="alert-primary rounded-none text-md">
<span>Portmaster is Alpha Software - expect hickups here and there</span>
<i class="icon-info"></i>
<span>Portmaster is Alpha Software - expect hiccups here and there</span>
</div>
<header class="header-two-container">
<div class="header-two-top">
@ -56,9 +57,9 @@ redirect_from:
Monitor All Network Activity
</h2>
<p class="showcase-right-desc">
Discover everything that is happening on your computer. Expose every
connection your applications make and detect evil ones. Finally get
the power to act accordingly.
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>
@ -72,11 +73,11 @@ redirect_from:
<span>Alpha Software: Portmaster is in active development</span>
</div>
<h2 class="showcase-right-title" style="max-width: 350px;">
Block Unwanted Connections
Block Unwanted Connections
</h2>
<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>
</div>
</div>
@ -90,12 +91,12 @@ redirect_from:
<span>Alpha Software: Portmaster is in active development</span>
</div>
<h2 class="showcase-right-title" style="max-width: 450px;">
Auto-Block via Selected Filter Lists
Auto-Block via Selected Filter Lists
</h2>
<p class="showcase-right-desc">
Automatically block ads, trackers and malware hosts via trusted domain-lists,
which are also used by Ad-Blockers, etc. Easily change the defaults to fit
your needs.
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>
@ -109,12 +110,12 @@ redirect_from:
<span>Alpha Software: Portmaster is in active development</span>
</div>
<h2 class="showcase-right-title" style="max-width: 350px;">
Enforce Secure DNS
Enforce Secure DNS
</h2>
<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>
</div>
</div>
@ -128,16 +129,16 @@ redirect_from:
<span>Alpha Software: Portmaster is in active development</span>
</div>
<h2 class="showcase-right-title" style="max-width: 350px;">
Explore the Docs and Source Code
Explore the Docs and Source Code
</h2>
<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>
<div class="col-container w-full text-left md:text-center lg:w-max lg:text-left">
<a class="btn-secondary" href="#">Checkout the docs</a>
<a class="btn-tertiary hover-opacity-out" href="#"><i class="icon-github text-md mr-2"></i>Inspect source code</a>
<a class="btn-secondary" href="{{ site.docs_url }}">Checkout the docs</a>
<a class="btn-tertiary hover-opacity-out" href="{{ site.github_url }}/portmaster"><i class="icon-github text-md mr-2"></i>Inspect source code</a>
</div>
</div>
</div>
@ -151,14 +152,13 @@ redirect_from:
<span>Alpha Software: Portmaster is in active development</span>
</div>
<h2 class="showcase-right-title" style="max-width: 550px;">
Configure Settings for Different Networks
Configure Settings for Different Networks
</h2>
<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
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>
<a class="btn-secondary" href="#">Discover the portmaster</a>
</div>
</div>
<div class="showcase-container-reverse">
@ -174,16 +174,15 @@ redirect_from:
Set Global & perApp 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.
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>
<a class="btn-secondary" href="#">Discover the portmaster</a>
</div>
</div>
<div class="download-container" id="download">
<h2 class="download-container-title">
<h2 class="download-container-title" id="downloads">
Download
</h2>
<div class="alert-primary max-w-3xl mx-auto">
@ -194,10 +193,10 @@ redirect_from:
<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" href="#"><i class="icon-mac text-md mr-2"></i>Macos (Not supported)</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 }}">other Linux 2.4+ distributions</a>
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">
@ -207,7 +206,7 @@ redirect_from:
</h2>
<p class="faq-container-top-desc">
You have a question? We answered some already, but you
can always contact us at <a class="link-primary" href="">hello@safing.io</a>
can always contact us at <a class="link-primary" href="mailto:hello@safing.io">hello@safing.io</a>
</p>
</div>
<div class="faq-container-bottom">
@ -257,13 +256,11 @@ redirect_from:
<input class="card-input-toggle" id="card-toggle-anchor-0" type="checkbox">
<div class="card-dropdown-toggle">
<div class="card-dropdown-content">
You can find our code on <a class="link-primary" href="">Github. The Portmaster</a>, the <a class="link-primary" href="">Portmaster UI</a>, the <a class="link-primary" href="">SPN</a>, the <a class="link-primary" href="">docs</a>
and <a class="link-primary" href="">this website</a> have their respective repositories. <a class="link-primary" href="">Jess</a>, the heart of the SPN, which
got audited by Cure53, can also be found online.
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>
</div>
</section>
</section>

View file

@ -4,11 +4,16 @@ layout: page
---
<div class="alert-primary rounded-none text-md">
<a data-method="get" href="https://account.safing.io/spn-reaches-alpha">
<span class="w-auto text-sm">SPN reached "Alpha". To celebrate, all customers can <span class="underline">use the SPN for FREE</span> in December 🎉</span>
<a data-method="get" href="https://docs.safing.io/spn/alpha/status">
<i class="icon-info text-md"></i>
<span>
SPN is in "Alpha". View
<span class="underline">what to expect</span>
from current speeds and features
</span>
</a>
</div>
<header class="header-one-container-reverse mt-40">
<header class="header-one-container-reverse my-40">
<div class="header-one-left pl-12">
<h1 class="header-one-left-title lg:max-w-md">
Safing Privacy Network
@ -27,8 +32,8 @@ layout: page
<span style="font-size: 12rem; font-weight: 800; margin-top: -5rem; margin-left: 6rem; z-index: -1;" class="absolute transform scale-50 lg:scale-125">
<img src="{{ site.img_url }}shapes/circle-md.png" alt="">
</span>
<video class="max-w-2xl" preload="auto"
src="{{ site.assets_server_url }}spn/feature-tour.mp4"
<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>
@ -36,7 +41,7 @@ layout: page
<img src="{{ site.img_url }}shapes/circle-sm.png" alt="">
</span>
</div>
</header>
</header>
<section class="section-container">
<div class="intro-container mt-32">
<h2 class="intro-container-title">
@ -56,18 +61,21 @@ layout: page
<div class="showcase-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span>
<span>Alpha Software: the SPN is in active development </span>
</div>
<h2 class="showcase-right-title" style="max-width: 450px;">
Onion Layer Encryption
Onion Layer Encryption
</h2>
<p class="showcase-right-desc">
Re-route all your connections through our multi-hop network
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.
encryption, no single party knows who you are and where you
are going to. Inspired by Tor.
</p>
<a class="btn-secondary" href="#">Discover the portmaster</a>
<a class="btn-secondary" href="{{ site.blog_url }}2020/01/22/how-the-spn-compares-to-tor/">Compare the SPN to Tor</a>
<a class="btn-tertiary hover-opacity-out" href="{{ site.img_url }}spn-labeled/spn-core.png">
View explainer-image
</a>
</div>
</div>
<div class="showcase-container">
@ -77,18 +85,17 @@ layout: page
<div class="showcase-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span>
<span>Alpha Software: the SPN is in active development </span>
</div>
<h2 class="showcase-right-title" style="max-width: 450px;">
Minimize Your MetaData
Minimize Your MetaData
</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.
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>
<a class="btn-secondary" href="#">Discover the portmaster</a>
</div>
</div>
<div class="showcase-container-reverse">
@ -98,18 +105,23 @@ layout: page
<div class="showcase-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span>
<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.
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="#">Discover the portmaster</a>
<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 class="showcase-container">
@ -119,30 +131,39 @@ layout: page
<div class="showcase-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span>
<span>Alpha Software: the SPN is in active development </span>
</div>
<h2 class="showcase-right-title" style="max-width: 450px;">
No Kill Switch Needed
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.
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="#">Discover the portmaster</a>
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
</div>
</div>
<div class="packages-container">
<div class="packages-container" id="pricing">
<div class="alert-primary">
<a data-method="get" href="{{ site.spn_alpha_status_page_url }}">
<span>
SPN is in "Alpha". View
<span class="underline">what to expect</span>
from current speeds and features
</span>
</a>
</div>
<div class="packages-container-top">
<h2 class="packages-container-top-title">
Pre-Order the SPN
Protect Your Connections Today
</h2>
<p class="packages-container-top-desc">
Lock in the lower prices forever and join the waitlist to
become one of the first SPN users.
Subscribe to the SPN and lock in the lower Alpha prices forever.
</p>
</div>
<div class="packages-container-bottom">
@ -162,7 +183,7 @@ layout: page
<span class="card-package-middle-includes-feature"> 17% off compared to Beta-Prices </span>
</div>
<div class="card-package-bottom">
<a class="btn-secondary w-full justify-center" href="#">Pre-Order</a>
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/1/subscribe">Subscribe</a>
</div>
</div>
<div class="card-package">
@ -181,7 +202,7 @@ layout: page
<span class="card-package-middle-includes-feature"> 30% off compared to Beta-Prices </span>
</div>
<div class="card-package-bottom">
<a class="btn-secondary w-full justify-center" href="#">Pre-Order</a>
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/2/subscribe">Subscribe</a>
</div>
</div>
</div>
@ -193,7 +214,7 @@ layout: page
</h2>
<p class="faq-container-top-desc">
You have a question? We answered some already, but you
can always contact us at <a class="link-primary" href="">hello@safing.io</a>
can always contact us at <a class="link-primary" href="mailto:hello@safing.io">hello@safing.io</a>
</p>
</div>
<div class="faq-container-bottom">
@ -243,13 +264,11 @@ layout: page
<input class="card-input-toggle" id="card-toggle-anchor-0" type="checkbox">
<div class="card-dropdown-toggle">
<div class="card-dropdown-content">
You can find our code on <a class="link-primary" href="">Github. The Portmaster</a>, the <a class="link-primary" href="">Portmaster UI</a>, the <a class="link-primary" href="">SPN</a>, the <a class="link-primary" href="">docs</a>
and <a class="link-primary" href="">this website</a> have their respective repositories. <a class="link-primary" href="">Jess</a>, the heart of the SPN, which
got audited by Cure53, can also be found online.
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>
</div>
</section>
</section>