Update index styling

This commit is contained in:
Luke Seers 2022-10-12 13:21:17 +02:00
parent bd6890846f
commit 6928a890ab

View file

@ -54,14 +54,10 @@ title: Safing - Love Freedom
</header> </header>
<section class="general-layout"> <section class="general-layout">
<div class="showcase-one-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-one-left" style="max-width: 1050px;"> <div class="showcase-one-left" style="max-width: 1150px;">
<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-one-right"> <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: Portmaster is in active development</span>
</div>
<h2 class="showcase-one-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>
@ -70,7 +66,6 @@ title: Safing - Love Freedom
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>
<a class="btn-secondary" href="{{ site.portmaster_url }}#features">Discover More features</a>
</div> </div>
</div> </div>
<div class="showcase-one-container"> <div class="showcase-one-container">
@ -78,10 +73,6 @@ title: Safing - Love Freedom
<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-one-right"> <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: Portmaster is in active development</span>
</div>
<h2 class="showcase-one-right-title" style="max-width: 450px;"> <h2 class="showcase-one-right-title" style="max-width: 450px;">
Auto-Block Trackers System-Wide Auto-Block Trackers System-Wide
</h2> </h2>
@ -90,18 +81,13 @@ title: Safing - Love Freedom
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.
</p> </p>
<a class="btn-secondary" href="{{ site.portmaster_url }}#features">Discover More features</a>
</div> </div>
</div> </div>
<div class="showcase-one-container-reverse"> <div class="showcase-one-container-reverse">
<div class="showcase-one-left" style="max-width: 850px;"> <div class="showcase-one-left" style="max-width: 950px;">
<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-one-right"> <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: Portmaster is in active development</span>
</div>
<h2 class="showcase-one-right-title" style="max-width: 350px;"> <h2 class="showcase-one-right-title" style="max-width: 350px;">
Set Global & perApp Settings Set Global & perApp Settings
</h2> </h2>
@ -111,27 +97,34 @@ title: Safing - Love Freedom
Or never connect to specific countries. The Portmaster has you Or never connect to specific countries. The Portmaster has you
covered. covered.
</p> </p>
<a class="btn-secondary" href="{{ site.portmaster_url }}#features">Discover More features</a>
</div> </div>
</div> </div>
<div class="download-container" id="download">
<h2 class="download-container-title" id="downloads"> <div class="download-container">
Download <div class="card-package darkmode relative mx-auto" style="max-width: 1210px; width: 100%;">
</h2> <div class="card-package-top" style="margin-top: 0;">
<div class="alert-primary max-w-3xl mx-auto"> <span class="card-package-top-amount" style="font-size: 2rem;">
<i class="icon-twitter text-xs"></i> Open Source & Free
<span>Portmaster is Alpha Software, treat as such; expect bugs here and there. Early Adopters welcome.</span> </span>
<p class="card-package-top-desc" style="max-width: 480px;">The free version is very powerful tool, but by buying a package you support the devlopment of the portmaster.</p>
</div>
<div class="card-package-bottom transform scale-105" style="position: absolute; width: 100%; left: 0; bottom: 0px; display: flex; justify-content: end; height: 100%;">
<div class="hidden lg:block" style="display: flex; align-items: center; margin-right: 4rem;">
{% include download_button.html unique_id="2" %}
</div>
</div>
</div> </div>
<div class="col-container-center w-full md:w-max text-center md:text-left"> <div class="flex mx-auto w-max mt-8 space-x-8 items-center" style="align-items: center;">
<a class="btn-secondary" href="{{ site.download_windows_url }}"><i class="icon-windows text-md mr-2"></i>Windows 10 + 11</a> <p class="block text-safing-gray-400">Seen and featured on</p>
<a class="btn-secondary" href="{{ site.docs_install_linux_url }}#installers"><i class="icon-ubuntu text-md mr-2"></i>Ubuntu</a> <div class=" space-x-8 hidden lg:flex" style="align-items: center;">
<a class="btn-secondary" href="{{ site.docs_install_linux_url }}#installers"><i class="icon-fedora text-md mr-2"></i>Fedora</a> <a href="{{ site.seen_itsfoss_url }}" class="hover-scale-in cursor-pointer hover-grayscale-in"><img src="{{ site.img_url }}/external/itsfoss.png"></a>
<a disabled class="btn"><i class="icon-mac text-md mr-2"></i>Macos (Not supported)</a> <a href="{{ site.seen_ghacks_url }}" class="hover-scale-in cursor-pointer hover-grayscale-in"><img src="{{ site.img_url }}/external/ghacks.png"></a>
<a href="{{ site.seen_techlore_url }}" class="hover-scale-in cursor-pointer hover-grayscale-in"><img src="{{ site.img_url }}/external/techlore.png"></a>
<a href="{{ site.seen_privacytools_url }}" class="hover-scale-in cursor-pointer hover-grayscale-in"><img src="{{ site.img_url }}/external/privacytools.png"></a>
</div>
</div> </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>. View installer <a class="link-primary" href="{{ site.github_url }}/checksums/">checksums</a>.
</p>
</div> </div>
<div class="blogpod-container"> <div class="blogpod-container">
<div class="blogpod-container-top"> <div class="blogpod-container-top">
<span class="blogpod-container-top-bg-title">Follow Us</span> <span class="blogpod-container-top-bg-title">Follow Us</span>