From bbaf0fc1e9ea3a02ec70b996d7ae8feb42cccd56 Mon Sep 17 00:00:00 2001
From: Michael Tremer <michael.tremer@ipfire.org>
Date: Thu, 25 Oct 2018 11:45:48 +0100
Subject: [PATCH] index: Update feature highlights

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>
---
 src/scss/style.scss      |  2 +-
 src/templates/index.html | 77 +++++++++-------------------------------
 2 files changed, 18 insertions(+), 61 deletions(-)

diff --git a/src/scss/style.scss b/src/scss/style.scss
index 3ad9029b..407f8c8e 100644
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -173,7 +173,7 @@ section {
 	padding: 3rem 1rem;
 
 	@include media-breakpoint-up(md) {
-		padding: 3rem 0;
+		padding: 5rem 0;
 	}
 
 	@include media-breakpoint-up(md) {
diff --git a/src/templates/index.html b/src/templates/index.html
index 55e0e49c..29c91451 100644
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -29,72 +29,44 @@
 	<section class="inverse">
 		<div class="container">
 			<div class="row mb-5">
-				<div class="col col-md-6">
-					<h1 class="mb-0">{{ _("Secure up your network with IPFire") }}</h1>
+				<div class="col-12 col-md-7">
+					<h1 class="mb-0">{{ _("Secure your network with IPFire") }}</h1>
 
 					<p>
-						IPFire comes with a versatile and state of the art firewall engine
-						that makes even the most complex setups easy to administer.
+						{{ _("IPFire is a versatile, state-of-the-art Open Source firewall based on Linux.") }}
+						{{ _("It's ease of use, high performance in any scenario and extensibility make it usable for everyone.") }}
 					</p>
+
+					<a class="btn btn-secondary mb-5" href="/features">{{ _("Learn More") }}</a>
 				</div>
 			</div>
 
-			<div class="row mt-5 mb-lg-6 mb-md-5">
-				<div class="col-md-6 col-lg-4 mb-5 pb-lg-5 d-flex">
+			<div class="row mt-5">
+				<div class="col-md-6 col-lg-4 mb-5 d-flex">
 					<div class="align-self-stretch">
 						<span class="fas fa-shield-alt fa-2x text-primary px-3"></span>
 					</div>
 
 					<div class="flex-column">
-						<h5 class="pb-3">{{ _("Firewall") }}</h5>
-						<p>
-							IPFire comes with a versatile and state of the art
-							firewall engine that makes even the most complex
-							setups easy to administer.
-						</p>
-					</div>
-				</div>
-
-				<div class="col-md-6 col-lg-4 mb-5 d-flex">
-					<div class="align-self-stretch">
-						<span class="fas fa-fast-forward fa-2x text-primary px-3"></span>
-					</div>
+						<h5 class="mb-3">{{ _("Security") }}</h5>
 
-					<div class="flex-column">
-						<h5 class="pb-3">{{ _("Performance") }}</h5>
 						<p>
-							IPFire is ready for high performance networks
-							and running evenly well on embedded hardware.
+							{{ _("Security is the highest priority in IPFire.") }}
+							{{ _("It is hardened to protect itself from attacks from the Internet and prevents attacks on your network.") }}
 						</p>
 					</div>
 				</div>
 
 				<div class="col-md-6 col-lg-4 mb-5 d-flex">
 					<div class="align-self-stretch">
-						<span class="fas fa-couch fa-2x text-primary px-3"></span>
+						<span class="fas fa-fire fa-2x text-primary px-3"></span>
 					</div>
 
 					<div class="flex-column">
-						<h5 class="pb-3">{{ _("Easy to use") }}</h5>
-						<p class="mb-1">
-							IPFire is set up easily in 15 to 20 minutes
-							but also comes with expert features that
-							are needed in professional networks.
-						</p>
-					</div>
-				</div>
+						<h5 class="mb-3">{{ _("Firewall") }}</h5>
 
-				<div class="col-md-6 col-lg-4 mb-5 d-flex">
-					<div class="align-self-stretch">
-						<span class="fas fa-lock fa-2x text-primary px-3"></span>
-					</div>
-
-					<div class="flex-column">
-						<h5 class="pb-3">{{ _("Network Security") }}</h5>
 						<p>
-							IPFire is designed for high security.
-							It is hardened to protect itself from attacks
-							from the network.
+							{{ _("It's powerful firewall engine and Intrusion Prevention System protects your network against attacks from the Internet and Denial-of-Service attacks.") }}
 						</p>
 					</div>
 				</div>
@@ -105,25 +77,10 @@
 					</div>
 
 					<div class="flex-column">
-						<h5 class="pb-3">{{ _("Open Source") }}</h5>
-						<p>
-							IPFire is free software and developed by an open community,
-							that improves it every single day.
-						</p>
-					</div>
-				</div>
+						<h5 class="mb-3">{{ _("Open Source") }}</h5>
 
-				<div class="col-md-6 col-lg-4 mb-5 d-flex">
-					<div class="align-self-stretch">
-						<span class="fas fa-heart fa-2x text-primary px-3"></span>
-					</div>
-
-					<div class="flex-column">
-						<h5 class="pb-3">{{ _("Trusted by thousands") }}</h5>
 						<p>
-							IPFire is developed in Europe and used all over the world
-							<a href="https://fireinfo.ipfire.org/statistics/geo-locations">in hundreds of countries</a>
-							by hundreds of thousands of users every day.
+							{{ _("IPFire is free software and developed by an open community and trusted by hundreds of thousands of users from all around the world.") }}
 						</p>
 					</div>
 				</div>
@@ -135,7 +92,7 @@
 		<div class="container">
 			<div class="row">
 				<div class="col-12 col-md-6 col-lg-5 mb-5">
-					<h1>Latest Release</h1>
+					<h1>{{ _("Latest Release") }}</h1>
 
 					<p class="mb-0">
 						<small>{{ locale.format_date(latest_release.date, shorter=True) }}</small>
-- 
2.39.5