vikarti.anatra/safing-web
1
0
Fork 0
mirror of https://github.com/safing/web synced 2025-09-02 19:19:03 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #207 from safing/feature/update-spn-page

Browse source 
Update SPN page
This commit is contained in:
Dave Gson 2022-06-28 11:39:13 +02:00 • committed by GitHub
commit c59a58503c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 802 additions and 492 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
_includes/head.html
View file

@ -30,5 +30,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 }}safingTailwind/safingTailwind-1.6.1.css" type="text/css"> <link rel="stylesheet" href="{{ site.vendor_url }}safingTailwind/safingTailwind-1.7.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">

2
_includes/project_card.html
View file

@ -1,4 +1,4 @@
<div class="card"> <div class="card card-shadow">
<label class="card-label" for="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}"> <label class="card-label" for="card{{ include.state | prepend: '-' }}{{ include.project | prepend: '-' }}-{{ forloop.index }}">
<div class="wrapper-left"> <div class="wrapper-left">
<div class="flex"> <div class="flex">

2
_includes/project_tablecard.html
View file

@ -1,4 +1,4 @@
<div class="card-extended"> <div class="card-extended card-shadow">
<label class="card-label" for="tablecard-{{ include.state }}-{{ forloop.index }}"> <label class="card-label" for="tablecard-{{ include.state }}-{{ forloop.index }}">
<div class="wrapper-left"> <div class="wrapper-left">
<div class="flex"> <div class="flex">

2
_includes/source_code_faq.html
View file

@ -5,7 +5,7 @@
{% endif %} {% endif %}
<div class="faq-container-bottom-question"> <div class="faq-container-bottom-question">
<div class="card-faq hover-scale-out"> <div class="card-faq card-shadow hover-scale-out">
<label class="card-label" for="card-toggle-anchor-{{ faq_id }}"> <label class="card-label" for="card-toggle-anchor-{{ faq_id }}">
<div class="wrapper-left"> <div class="wrapper-left">
<div class="card-title"> <div class="card-title">

28
about/index.html
View file

@ -7,15 +7,15 @@ redirect_from:
--- ---
<section class="general-layout"> <section class="general-layout">
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 1050px;"> <div class="showcase-left" style="max-width: 1050px;">
<img src="{{ site.img_url }}page-specific/about/team_overview.png" alt=""> <img src="{{ site.img_url }}page-specific/about/team_overview.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
We <span class="text-safing-blue-500">love&nbsp;Freedom</span>, just like You We <span class="text-safing-blue-500">love&nbsp;Freedom</span>, just like You
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
We are a bunch of ordinary people who want to change the world. Discontent with 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 the global state of mass surveillance, and seeing how it negatively impacts our
lives, we decided it was time to do something about it. lives, we decided it was time to do something about it.
@ -69,15 +69,15 @@ redirect_from:
</div> </div>
</div> </div>
</div> </div>
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt=""> <img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
A Simple Business Model A Simple Business Model
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Our business model is Freemium. First provide local privacy for free, forever. 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 Then let happy users support us by paying for a powerful VPN alternative. Finally
reinvest earnings into making all our products better. reinvest earnings into making all our products better.
@ -85,15 +85,15 @@ redirect_from:
<a class="btn-secondary" href="{{ site.business_model_url }}">Look At The Cycle</a> <a class="btn-secondary" href="{{ site.business_model_url }}">Look At The Cycle</a>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt=""> <img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Clear Ownership & Transparent Funding Clear Ownership & Transparent Funding
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Taking money always means opening up to influences. Therefore, we see it as our duty 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 to not only be open about our ownership, but also about how we financed our journey
so far. so far.

38
business-model/index.html
View file

@ -4,15 +4,15 @@ layout: page
--- ---
<section class="general-layout"> <section class="general-layout">
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 1050px;"> <div class="showcase-one-left" style="max-width: 1050px;">
<img src="{{ site.img_url }}page-specific/business-model/provide-local-value-for-free-forever.png" alt=""> <img src="{{ site.img_url }}page-specific/business-model/provide-local-value-for-free-forever.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Provide Local Value for Free, Forever Provide Local Value for Free, Forever
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Everybody deserves privacy, not only the wealthy. That is why Everybody deserves privacy, not only the wealthy. That is why
all local privacy features are free, and will remain so forever. all local privacy features are free, and will remain so forever.
This fits perfectly into the Freemium business model as well as This fits perfectly into the Freemium business model as well as
@ -21,15 +21,15 @@ layout: page
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a> <a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/business-model/only-pay-for-protection-in-transit.png" alt=""> <img src="{{ site.img_url }}page-specific/business-model/only-pay-for-protection-in-transit.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Sell Protection in Transit Sell Protection in Transit
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
There is privacy that comes with a cost because it requires There is privacy that comes with a cost because it requires
additional server bandwidth. Naturally, this is where we charge additional server bandwidth. Naturally, this is where we charge
for our powerful VPN&nbsp;alternative. You get an extra service, for our powerful VPN&nbsp;alternative. You get an extra service,
@ -38,15 +38,15 @@ layout: page
<a class="btn-secondary" href="{{ site.spn_url }}">Discover the SPN</a> <a class="btn-secondary" href="{{ site.spn_url }}">Discover the SPN</a>
</div> </div>
</div> </div>
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt=""> <img src="{{ site.img_url }}page-specific/business-model/reinvest-earnings-into-privacy.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Reinvest Earnings into Privacy Reinvest Earnings into Privacy
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
All our income is invested into the privacy cycle: Finance amazing All our income is invested into the privacy cycle: Finance amazing
talent. Develop great, open source software - both free and paid. talent. Develop great, open source software - both free and paid.
Delight users so more people join and support the cycle. Delight users so more people join and support the cycle.
@ -57,15 +57,15 @@ layout: page
</p> </p>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt=""> <img src="{{ site.img_url }}page-specific/about/safing-hand.gif" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Clear Ownership & Transparent Funding Clear Ownership & Transparent Funding
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Taking money always means opening up to influences. Therefore, we see it as 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 our duty to not only be open about our ownership, but also about how we
financed our journey so far. financed our journey so far.

30
index.html
View file

@ -6,19 +6,19 @@ title: Safing - Love Freedom
{% include header.html %} {% include header.html %}
<section class="general-layout"> <section class="general-layout">
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 1050px;"> <div class="showcase-one-left" style="max-width: 1050px;">
<img src="{{ site.img_url }}page-specific/portmaster/monitor-network-activity.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/monitor-network-activity.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Monitor All Network Activity Monitor All Network Activity
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Discover everything that is happening on your computer. Expose every Discover everything that is happening on your computer. Expose every
connection your applications make and detect evil ones. Finally get connection your applications make and detect evil ones. Finally get
the power to act accordingly. the power to act accordingly.
@ -26,19 +26,19 @@ title: Safing - Love Freedom
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a> <a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/portmaster/block-trackers-system-wide.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/block-trackers-system-wide.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Block Trackers System-Wide Block Trackers System-Wide
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Protect your whole computer, not just your browser. Block all Protect your whole computer, not just your browser. Block all
advertisements and trackers for every application. Easily add advertisements and trackers for every application. Easily add
your own rules and block individual domains. your own rules and block individual domains.
@ -46,19 +46,19 @@ title: Safing - Love Freedom
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a> <a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
</div> </div>
</div> </div>
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/portmaster/set-global-and-per-app-configuration.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/set-global-and-per-app-configuration.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Set Global & per‑App Settings Set Global & per‑App Settings
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Make your own rules. Completely cut off applications from the Make your own rules. Completely cut off applications from the
Internet. Or block all p2p connections except for certain apps. Internet. Or block all p2p connections except for certain apps.
Or never connect to specific countries. The Portmaster has you Or never connect to specific countries. The Portmaster has you

2
jobs/index.html
View file

@ -78,7 +78,7 @@ layout: page
{% assign jobs = site.jobs %} {% assign jobs = site.jobs %}
{% if jobs.size > 0 %} {% if jobs.size > 0 %}
{% for job in jobs %} {% for job in jobs %}
<div class="card p-7 flex items-center"> <div class="card card-shadow p-7 flex items-center">
<div class="flex space-x-2 items-center"> <div class="flex space-x-2 items-center">
<h3 class="text-xl block">{{ job.title }}</h3> <h3 class="text-xl block">{{ job.title }}</h3>
<span class="text-sm text-safing-gray-300 block">{{ job.extraInfo }}</span> <span class="text-sm text-safing-gray-300 block">{{ job.extraInfo }}</span>

10
next/index.html
View file

@ -105,15 +105,15 @@ layout: page
</div> </div>
</div> </div>
{% endif %} {% endif %}
<div class="showcase-container-reverse mt-32"> <div class="showcase-one-container-reverse mt-32">
<div class="showcase-left" style="max-width: 1050px;"> <div class="showcase-one-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"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 299px;"> <h2 class="showcase-one-right-title" style="max-width: 299px;">
There is More. A Lot More. There is More. A Lot More.
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
We have plans and ideas for years to come. We will We have plans and ideas for years to come. We will
never be "done" but always evolve and progress. I'm never be "done" but always evolve and progress. I'm
sure you have cool ideas for us too! Take a look what sure you have cool ideas for us too! Take a look what

20
ownership/index.html
View file

@ -6,15 +6,15 @@ redirect_from:
--- ---
<section class="general-layout"> <section class="general-layout">
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 1050px;"> <div class="showcase-one-left" style="max-width: 1050px;">
<img src="{{ site.img_url }}page-specific/ownership/ownership.png" alt=""> <img src="{{ site.img_url }}page-specific/ownership/ownership.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h1 class="showcase-right-title" style="max-width: 450px;"> <h1 class="showcase-one-right-title" style="max-width: 450px;">
We own Safing We own Safing
</h1> </h1>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
We do not want parties to gain influence which do not or might not stand 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 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. personal risks instead of selling parts of our company for easy money.
@ -25,15 +25,15 @@ redirect_from:
<a class="btn-secondary" href="{{ site.company_agreement_url }}">View public registry</a> <a class="btn-secondary" href="{{ site.company_agreement_url }}">View public registry</a>
</div> </div>
</div> </div>
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/ownership/influences.png" alt=""> <img src="{{ site.img_url }}page-specific/ownership/influences.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
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="showcase-right-desc"> <p class="showcase-one-right-desc">
We are thankful for all the partnerships & possibilities that are emerging 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. from our R&D heavy years in which we are exploring new privacy frontiers.
<br> <br>
@ -66,7 +66,7 @@ redirect_from:
</div> </div>
<div class="influence-container-bottom"> <div class="influence-container-bottom">
{% for influence in site.data.finances %} {% for influence in site.data.finances %}
<div class="card-influence"> <div class="card-influence card-shadow">
<div class="card-influence-top "> <div class="card-influence-top ">
<div class="card-influence-title-date"> <div class="card-influence-title-date">
<span class="card-influence-top-title">{{ influence.name }}</span> <span class="card-influence-top-title">{{ influence.name }}</span>

72
portmaster/index.html
View file

@ -12,8 +12,8 @@ redirect_from:
</div> </div>
<header class="header-two-container mb-64"> <header class="header-two-container mb-64">
<div class="header-two-top"> <div class="header-two-top">
<h1 class="header-two-top-title"> <h1 class="header-two-top-title" style="max-width: 600px;">
Take Back Control of Your Computer Control Your Computer, <span class="text-safing-blue-600">Get Peace of Mind</span>
</h1> </h1>
<p class="header-two-top-desc"> <p class="header-two-top-desc">
Portmaster is a free and open-source application that puts Portmaster is a free and open-source application that puts
@ -44,94 +44,94 @@ redirect_from:
</div> </div>
</header> </header>
<section class="general-layout"> <section class="general-layout">
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 1050px;"> <div class="showcase-one-left" style="max-width: 1050px;">
<img src="{{ site.img_url }}page-specific/portmaster/monitor-network-activity.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/monitor-network-activity.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Monitor All Network Activity Monitor All Network Activity
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Discover everything that is happening on your computer. Expose every Discover everything that is happening on your computer. Expose every
connection your applications make and detect evil ones. Finally get connection your applications make and detect evil ones. Finally get
the power to act accordingly. the power to act accordingly.
</p> </p>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/portmaster/manually-allow-ord-block-connections.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/manually-allow-ord-block-connections.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Block Unwanted Connections Block Unwanted Connections
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Many programs connect to the Internet without your knowledge. When you Many programs connect to the Internet without your knowledge. When you
find unwanted connections, you can now simply block them. find unwanted connections, you can now simply block them.
</p> </p>
</div> </div>
</div> </div>
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/portmaster/block-trackers-system-wide.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/block-trackers-system-wide.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Auto-Block via Selected Filter Lists Auto-Block via Selected Filter Lists
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Automatically block ads, trackers and malware hosts via trusted domain-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 which are also used by Ad-Blockers, etc. Easily change the defaults to fit
your needs. your needs.
</p> </p>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/portmaster/enforce-dns-over-tls.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/enforce-dns-over-tls.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Enforce Secure DNS Enforce Secure DNS
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Even with invasive connections gone, you do not want to share your dns requests 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 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. queries to a DNS-over-TLS provider of your choice.
</p> </p>
</div> </div>
</div> </div>
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/portmaster/explore-the-docs-and-source-code.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/explore-the-docs-and-source-code.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Explore the Docs and Source Code Explore the Docs and Source Code
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
In the age of Mass Surveillance, what good is a service when you cannot see what 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 it is really doing? We believe in open source. We also document everything
as good as we can. as good as we can.
@ -142,38 +142,38 @@ redirect_from:
</div> </div>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/portmaster/configure-settings-for-different-networks.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/configure-settings-for-different-networks.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 550px;"> <h2 class="showcase-one-right-title" style="max-width: 550px;">
Configure Settings for Different Networks Configure Settings for Different Networks
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
The Wi-Fi in your local coffee shop is riskier than yours at home. Set up your 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 settings for different networks and then simply press a button when changing
location. All settings will adjust immediately location. All settings will adjust immediately
</p> </p>
</div> </div>
</div> </div>
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/portmaster/set-global-and-per-app-configuration.png" alt=""> <img src="{{ site.img_url }}page-specific/portmaster/set-global-and-per-app-configuration.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: Portmaster is in active development</span> <span>Alpha Software: Portmaster is in active development</span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Set Global & per‑App Settings Set Global & per‑App Settings
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Make your own rules. Completely cut off applications from the Make your own rules. Completely cut off applications from the
Internet. Or block all p2p connections except for certain apps. Internet. Or block all p2p connections except for certain apps.
Or never connect to specific countries. The Portmaster has you Or never connect to specific countries. The Portmaster has you
@ -212,7 +212,7 @@ redirect_from:
<div class="faq-container-bottom"> <div class="faq-container-bottom">
{% for faq in site.data.faq.portmaster %} {% for faq in site.data.faq.portmaster %}
<div class="faq-container-bottom-question"> <div class="faq-container-bottom-question">
<div class="card-faq hover-scale-out"> <div class="card-faq card-shadow hover-scale-out">
<label class="card-label" for="card-toggle-anchor-{{ forloop.index }}"> <label class="card-label" for="card-toggle-anchor-{{ forloop.index }}">
<div class="wrapper-left"> <div class="wrapper-left">
<div class="card-title"> <div class="card-title">

244
spn/index.html
View file

@ -11,40 +11,77 @@ layout: page
from current speeds and features from current speeds and features
</span> </span>
</a> </a>
<header class="header-one-container-reverse mb-64 mt-36"> <header class="header-two-container mb-64 mt-20">
<div class="header-one-left pl-12"> <div class="header-two-top">
<h1 class="header-one-left-title lg:max-w-md"> <div class="alert max-w-md bg-transparent mx-auto">
Safing Privacy Network <i class="icon-add text-xl" style="color: rgba(46, 98, 255, 1);"></i>
<span style="color: rgba(0, 0, 0, 0.6);" class="text-md">Portmaster Add-on</span>
</div>
<h1 class="header-two-top-title" style="margin-top: 0.3rem;">
It's Time to <span class="text-safing-blue-600">Ditch VPN's</span>
</h1> </h1>
<p class="header-one-left-desc"> <p class="header-two-top-desc" style="max-width: 650px;">
With the SPN you protect all your connections from mass Stop paying for out-dated technology that was never intended to protect your privacy.
surveillance. Prevent all Internet Service Providers Get peace of mind with the SPN. Built from scratch and designed to truly protect your privacy
from collecting and selling your private activities. from mass surveillance.
</p> </p>
<div class="col-container w-full text-center lg:w-max lg:text-left">
<a class="btn-primary" href="#pricing">Get started</a>
<a class="btn-tertiary" href="{{ site.portmaster_url }}">Built into the Portmaster</a>
</div> </div>
<div class="header-two-bottom" style="margin-top: 3.5rem;">
<div class="element-x-center max-w-sm md:max-w-4xl">
<div class="package-billing">
<div class="package-billing-line-left"></div>
<span class="package-billing-center">Billing: <span class="text-safing-blue-600">One-Time Payment</span></span>
<div class="package-billing-line-right"></div>
</div> </div>
<div class="header-one-right"> <div class="grid md:grid-cols-2 space-y-3 space-x-3 mt-12 justify-center justify-items-center">
<span style="font-size: 12rem; font-weight: 800; margin-top: -5rem; margin-left: 6rem; z-index: -1;" class="absolute transform scale-50 lg:scale-125"> <div>
<img src="{{ site.img_url }}shapes/circle-md.png" alt=""> <div class="card-package most-popular card-shadow">
<div class="card-package-most-popular">
<span>Most Popular</span>
</div>
<div class="card-package-top">
<div class="flex">
<span class="card-package-top-title">Early Adopter</span>
<span tooltip="Compared to &quot;Beta&quot; Prices" class="ml-auto bg-safing-gray-100 text-center rounded-full px-5 py-1 inline-flex text-sm">Save 23%</span>
</div>
<span class="card-package-top-amount">
9.90€
</span> </span>
<div class="card"> </div>
<div class="rounded-2xl overflow-hidden"> <div class="card-package-middle space-y-4">
<video class="max-w-2xl" preload="auto" <span class="card-package-middle-includes-feature"> Use SPN for 1-Month </span>
src="{{ site.assets_server_url }}spn/feature-tour.mp4" </div>
poster="{{ site.assets_server_url }}spn/feature-tour-poster.png" <div class="card-package-bottom">
controls> <a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/1/subscribe">Buy Package</a>
</video>
</div> </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"> <span class="element-x-center-max mt-4 text-sm">Billing does <strong>NOT</strong> auto-renew</span>
<img src="{{ site.img_url }}shapes/circle-sm.png" alt=""> </div>
<div>
<div class="card-package">
<div class="card-package-top">
<div class="flex">
<span class="card-package-top-title">Early Adopter</span>
<span tooltip="Compared to Monthly &quot;Beta&quot; Prices" class="ml-auto bg-safing-gray-100 text-center rounded-full px-5 py-1 inline-flex text-sm">Save 36%</span>
</div>
<span class="card-package-top-amount">
99.00€
</span> </span>
</div> </div>
<div class="card-package-middle space-y-4">
<span class="card-package-middle-includes-feature"> Use SPN for 1-Year </span>
</div>
<div class="card-package-bottom">
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/2/subscribe">Buy Package</a>
</div>
</div>
<span class="element-x-center-max mt-4 text-sm">Billing does <strong>NOT</strong> auto-renew</span>
</div>
</div>
</div>
</div>
</header> </header>
<section class="general-layout"> <section class="space-y-40">
<div class="intro-container mt-32"> <div class="intro-container mt-32">
<h2 class="intro-container-title"> <h2 class="intro-container-title">
Protect Your Meta‑Data Protect Your Meta‑Data
@ -55,20 +92,20 @@ layout: page
what you actually do on them. what you actually do on them.
</p> </p>
</div> </div>
<div class="space-y-80"> <div class="general-layout">
<div class="showcase-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/spn/layers.gif" alt=""> <img src="{{ site.img_url }}page-specific/spn/layers.gif" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: the SPN is in active development </span> <span>Alpha Software: the SPN is in active development </span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Onion Layer Encryption Onion Layer Encryption
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-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- to decouple your identity from the destination. With onion-
encryption, no single party knows who you are and where you encryption, no single party knows who you are and where you
@ -80,39 +117,19 @@ layout: page
</a> </a>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-one-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/spn/metadata.gif" alt="">
</div>
<div class="showcase-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i>
<span>Alpha Software: the SPN is in active development </span>
</div>
<h2 class="showcase-right-title" style="max-width: 450px;">
Minimize Your Meta‑Data
</h2>
<p class="showcase-right-desc">
With the SPN, your meta-data is stripped to a minimum.
Abstracting even the size of outgoing packets to diminish
what information third parties, like your ISP or the Wi-Fi
operator of your local coffee place, can gather about you.
</p>
</div>
</div>
<div class="showcase-container-reverse">
<div class="showcase-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/spn/network.png" alt=""> <img src="{{ site.img_url }}page-specific/spn/network.png" alt="">
</div> </div>
<div class="showcase-right"> <div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: the SPN is in active development </span> <span>Alpha Software: the SPN is in active development </span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Distributed Multi Identity Network Distributed Multi Identity Network
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Instead of exiting all your traffic at one place, route every Instead of exiting all your traffic at one place, route every
connection individually to spread your connections across the connection individually to spread your connections across the
globe. Use vast amounts of identities (IP addresses) and limit globe. Use vast amounts of identities (IP addresses) and limit
@ -126,19 +143,58 @@ layout: page
</a> </a>
</div> </div>
</div> </div>
<div class="showcase-container"> <div class="showcase-two-container">
<div class="showcase-left" style="max-width: 850px;"> <div class="showcase-two-top-break-left">
<img src="{{ site.img_url }}page-specific/spn/switch.gif" alt=""> <h2 class="showcase-two-top-title" style="max-width: 550px;">
SPN in Action
</h2>
<p class="showcase-two-top-desc">
Watch a short video showing how you easily get multiple identities per app, by default.
</p>
</div> </div>
<div class="showcase-right"> <div class="showcase-two-bottom" style="max-width: 850px;">
<div class="card">
<div class="overflow-hidden">
<video preload="auto" src="https://assets.safing.io/spn/feature-tour.mp4" poster="https://assets.safing.io/spn/feature-tour-poster.png" controls="">
</video>
</div>
</div>
</div>
<div class="showcase-bg"></div>
</div>
<div class="showcase-one-container-reverse">
<div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/spn/metadata.gif" alt="">
</div>
<div class="showcase-one-right">
<div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto"> <div class="alert-tiny w-max pr-6 bg-safing-blue-600 ml-0 md:mx-auto">
<i class="icon-info text-md"></i> <i class="icon-info text-md"></i>
<span>Alpha Software: the SPN is in active development </span> <span>Alpha Software: the SPN is in active development </span>
</div> </div>
<h2 class="showcase-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Minimize Your Meta‑Data
</h2>
<p class="showcase-one-right-desc">
With the SPN, your meta-data is stripped to a minimum.
Abstracting even the size of outgoing packets to diminish
what information third parties, like your ISP or the Wi-Fi
operator of your local coffee place, can gather about you.
</p>
</div>
</div>
<div class="showcase-one-container">
<div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/spn/switch.gif" alt="">
</div>
<div class="showcase-one-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-one-right-title" style="max-width: 450px;">
No Kill Switch Needed No Kill Switch Needed
</h2> </h2>
<p class="showcase-right-desc"> <p class="showcase-one-right-desc">
Get peace of mind instead of fearing data-leakage. Get peace of mind instead of fearing data-leakage.
<br> <br>
<br> <br>
@ -149,59 +205,73 @@ layout: page
<a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a> <a class="btn-secondary" href="{{ site.portmaster_url }}">Discover the portmaster</a>
</div> </div>
</div> </div>
<div class="packages-container" id="pricing"> <div class="showcase-two-container" id="pricing">
<a class="alert-primary hover-scale-out mb-20" data-method="get" href="{{ site.spn_alpha_status_page_url }}"> <div class="showcase-two-top" style="max-width: 690px;">
<a class="alert-primary hover-scale-out" data-method="get" href="{{ site.spn_alpha_status_page_url }}">
<span> <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
</span> </span>
</a> </a>
<div class="packages-container-top"> <h2 class="showcase-two-top-title">
<h2 class="packages-container-top-title">
Protect Your Connections Today Protect Your Connections Today
</h2> </h2>
<p class="packages-container-top-desc"> <p class="showcase-two-top-desc">
Subscribe to the SPN and lock in the lower Alpha prices forever. Subscribe to the SPN and lock in the lower Alpha prices forever.
</p> </p>
</div> </div>
<div class="packages-container-bottom"> <div class="showcase-two-bottom" style="max-width: 850px;">
<div class="card-package"> <div class="element-x-center max-w-sm md:max-w-4xl">
<div class="package-billing">
<div class="package-billing-line-left"></div>
<span class="package-billing-center">Billing: <span class="text-safing-blue-600">One-Time Payment</span></span>
<div class="package-billing-line-right"></div>
</div>
<div class="grid md:grid-cols-2 space-y-3 space-x-3 mt-12 justify-center justify-items-center">
<div>
<div class="card-package most-popular card-shadow">
<div class="card-package-most-popular">
<span>Most Popular</span>
</div>
<div class="card-package-top"> <div class="card-package-top">
<span class="card-package-top-title">Early Adopter Monthly</span> <div class="flex">
<span class="card-package-top-title">Early Adopter</span>
<span tooltip="Compared to &quot;Beta&quot; Prices" class="ml-auto bg-safing-gray-100 text-center rounded-full px-5 py-1 inline-flex text-sm">Save 23%</span>
</div>
<span class="card-package-top-amount"> <span class="card-package-top-amount">
9.90€ <span class="billing">/ per month</span> 9.90€
</span> </span>
<span class="card-package-top-offer">11.90€</span>
</div> </div>
<div class="card-package-middle space-y-4"> <div class="card-package-middle space-y-4">
<span class="card-package-middle-includes"> Includes: </span> <span class="card-package-middle-includes-feature"> Use SPN for 1-Month </span>
<span class="card-package-middle-includes-feature"> Access to the SPN </span>
<span class="card-package-middle-includes-feature"> Unlimited Bandwidth </span>
<span class="card-package-middle-includes-feature"> Use on up to 5 devices </span>
<span class="card-package-middle-includes-feature"> 17% off compared to Beta-Prices </span>
</div> </div>
<div class="card-package-bottom"> <div class="card-package-bottom">
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/1/subscribe">Subscribe</a> <a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/1/subscribe">Buy Package</a>
</div> </div>
</div> </div>
<span class="element-x-center-max mt-4 text-sm">Billing does <strong>NOT</strong> auto-renew</span>
</div>
<div>
<div class="card-package"> <div class="card-package">
<div class="card-package-top"> <div class="card-package-top">
<span class="card-package-top-title">Early Adopter Yearly</span> <div class="flex">
<span class="card-package-top-title">Early Adopter</span>
<span tooltip="Compared to Monthly &quot;Beta&quot; Prices" class="ml-auto bg-safing-gray-100 text-center rounded-full px-5 py-1 inline-flex text-sm">Save 36%</span>
</div>
<span class="card-package-top-amount"> <span class="card-package-top-amount">
99.00€ <span class="billing">/ per year</span> 99.00€
</span> </span>
<span class="card-package-top-offer">142.80</span>
</div> </div>
<div class="card-package-middle space-y-4"> <div class="card-package-middle space-y-4">
<span class="card-package-middle-includes"> Includes: </span> <span class="card-package-middle-includes-feature"> Use SPN for 1-Year </span>
<span class="card-package-middle-includes-feature"> Access to the SPN </span>
<span class="card-package-middle-includes-feature"> Unlimited Bandwidth </span>
<span class="card-package-middle-includes-feature"> Use on up to 5 devices </span>
<span class="card-package-middle-includes-feature"> 30% off compared to Beta-Prices </span>
</div> </div>
<div class="card-package-bottom"> <div class="card-package-bottom">
<a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/2/subscribe">Subscribe</a> <a class="btn-secondary w-full justify-center" href="{{ site.account_server_url }}plans/2/subscribe">Buy Package</a>
</div>
</div>
<span class="element-x-center-max mt-4 text-sm">Billing does <strong>NOT</strong> auto-renew</span>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -219,7 +289,7 @@ layout: page
<div class="faq-container-bottom"> <div class="faq-container-bottom">
{% for faq in site.data.faq.spn %} {% for faq in site.data.faq.spn %}
<div class="faq-container-bottom-question"> <div class="faq-container-bottom-question">
<div class="card-faq hover-scale-out"> <div class="card-faq card-shadow hover-scale-out">
<label class="card-label" for="card-toggle-anchor-{{ forloop.index }}"> <label class="card-label" for="card-toggle-anchor-{{ forloop.index }}">
<div class="wrapper-left"> <div class="wrapper-left">
<div class="card-title"> <div class="card-title">

4
support/index.html
View file

@ -59,7 +59,7 @@ layout: page
<div class="faq-container-bottom"> <div class="faq-container-bottom">
{% for faq in site.data.faq.portmaster %} {% for faq in site.data.faq.portmaster %}
<div class="faq-container-bottom-question"> <div class="faq-container-bottom-question">
<div class="card-faq hover-scale-out"> <div class="card-faq card-shadow hover-scale-out">
<label class="card-label" for="card-toggle-anchor-portmaster-{{ forloop.index }}"> <label class="card-label" for="card-toggle-anchor-portmaster-{{ forloop.index }}">
<div class="wrapper-left"> <div class="wrapper-left">
<div class="card-title"> <div class="card-title">
@ -126,7 +126,7 @@ layout: page
<div class="faq-container-bottom"> <div class="faq-container-bottom">
{% for faq in site.data.faq.spn %} {% for faq in site.data.faq.spn %}
<div class="faq-container-bottom-question"> <div class="faq-container-bottom-question">
<div class="card-faq hover-scale-out"> <div class="card-faq card-shadow hover-scale-out">
<label class="card-label" for="card-toggle-anchor-spn-{{ forloop.index }}"> <label class="card-label" for="card-toggle-anchor-spn-{{ forloop.index }}">
<div class="wrapper-left"> <div class="wrapper-left">
<div class="card-title"> <div class="card-title">

BIN
vendor/safingTailwind-1.6.1.zip vendored
View file

Binary file not shown.

BIN
vendor/safingTailwind-1.7.zip vendored Normal file
View file

Binary file not shown.

19
vendor/safingTailwind/docs/docs.html vendored
View file

@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../docs/css/highlight.min.css"> <link rel="stylesheet" href="../docs/css/highlight.min.css">
<link rel="stylesheet" href="../docs/css/style.css"> <link rel="stylesheet" href="../docs/css/style.css">
<link rel="stylesheet" href="../safingTailwind-1.6.1.css"> <link rel="stylesheet" href="../safingTailwind-1.7.css">
<script src="../docs/js/vendor/jquery.min.js" type="text/javascript"></script> <script src="../docs/js/vendor/jquery.min.js" type="text/javascript"></script>
<script src="../docs/js/vendor/jquery-resizable.js"></script> <script src="../docs/js/vendor/jquery-resizable.js"></script>
<script src="../docs/js/vendor/highlight.min.js"></script> <script src="../docs/js/vendor/highlight.min.js"></script>
@ -14,7 +14,7 @@
</head> </head>
<body class="antialiased font-sans font-medium"> <body class="antialiased font-sans font-medium">
<div class="alert-primary rounded-none text-md"> <div class="alert-primary rounded-none text-md">
<span>There will be some stuff missing in this, and also some bugs. <strong>v1.6</strong></span> <span>There will be some stuff missing in this, and also some bugs. <strong>v1.7</strong></span>
</div> </div>
<div class="flex"> <div class="flex">
<nav class="overflow-y-auto pb-10 pt-20 ml-20 w-56"> <nav class="overflow-y-auto pb-10 pt-20 ml-20 w-56">
@ -587,7 +587,6 @@
@apply block; @apply block;
@apply rounded-lg; @apply rounded-lg;
@apply bg-white; @apply bg-white;
@apply card-shadow;
} }
.card-extended .card { .card-extended .card {
@ -745,8 +744,6 @@
@apply pl-0; @apply pl-0;
} }
.card-input-toggle { .card-input-toggle {
@apply hidden; @apply hidden;
} }
@ -755,11 +752,13 @@
@apply block; @apply block;
} }
.card-shadow { .card.card-shadow,
.card-extended.card-shadow {
@apply relative; @apply relative;
} }
.card-shadow::after { .card.card-shadow::after,
.card-extended.card-shadow::after {
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0), 0 0 90px 0 rgba(59, 93, 199, 0.1); box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0), 0 0 90px 0 rgba(59, 93, 199, 0.1);
content: ''; content: '';
@apply h-full; @apply h-full;
@ -974,6 +973,9 @@
<div class="space-y-7"> <div class="space-y-7">
<span>General Icons</span> <span>General Icons</span>
<div class="grid grid-cols-12 auto-cols-max grid-flow-row gap-y-10"> <div class="grid grid-cols-12 auto-cols-max grid-flow-row gap-y-10">
<div class="bg-white p-4 w-max m-auto" tooltip=".icon-add">
<i class="icon-add text-lg"></i>
</div>
<div class="bg-white p-4 w-max m-auto" tooltip=".icon-earth"> <div class="bg-white p-4 w-max m-auto" tooltip=".icon-earth">
<i class="icon-earth text-lg"></i> <i class="icon-earth text-lg"></i>
</div> </div>
@ -1088,6 +1090,9 @@
&lt;div class="space-y-7"&gt; &lt;div class="space-y-7"&gt;
&lt;span&gt;General Icons&lt;/span&gt; &lt;span&gt;General Icons&lt;/span&gt;
&lt;div class="grid grid-cols-12 auto-cols-max grid-flow-row gap-y-10"&gt; &lt;div class="grid grid-cols-12 auto-cols-max grid-flow-row gap-y-10"&gt;
&lt;div class="bg-white p-4 w-max m-auto" tooltip=".icon-add"&gt;
&lt;i class="icon-add text-lg"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="bg-white p-4 w-max m-auto" tooltip=".icon-earth"&gt; &lt;div class="bg-white p-4 w-max m-auto" tooltip=".icon-earth"&gt;
&lt;i class="icon-earth text-lg"&gt;&lt;/i&gt; &lt;i class="icon-earth text-lg"&gt;&lt;/i&gt;
&lt;/div&gt; &lt;/div&gt;

2
vendor/safingTailwind/docs/js/internal/iframeRefresher.js vendored
View file

@ -10,7 +10,7 @@ function SetUpIframeData() {
innerHtml = iframeContents.find('html'); innerHtml = iframeContents.find('html');
innerBody = iframeContents.find('body'); innerBody = iframeContents.find('body');
innerHead = iframeContents.find('head'); innerHead = iframeContents.find('head');
innerHead.append('<link rel="stylesheet" href="../safingTailwind-1.6.1.css">'); innerHead.append('<link rel="stylesheet" href="../safingTailwind-1.7.css">');
innerBody.append(data) innerBody.append(data)
}); });
setTimeout(function(){ setTimeout(function(){

BIN
vendor/safingTailwind/fonts/safing-icons.ttf vendored
View file

Binary file not shown.

BIN
vendor/safingTailwind/fonts/safing-icons.woff vendored
View file

Binary file not shown.

743
vendor/safingTailwind/safingTailwind-1.6.1.css → vendor/safingTailwind/safingTailwind-1.7.css vendored
View file

File diff suppressed because it is too large Load diff