From 98a6a49c9b2ea09971f5c915b71efccfd9582a94 Mon Sep 17 00:00:00 2001
From: Rico Hoppe <rico.hoppe@ipfire.org>
Date: Sun, 16 Apr 2023 13:11:33 +0000
Subject: [PATCH] support: changed design of wiki & community section

---
 src/templates/static/support.html | 166 +++++++++++++++---------------
 1 file changed, 83 insertions(+), 83 deletions(-)

diff --git a/src/templates/static/support.html b/src/templates/static/support.html
index d15d92bf..8bd29748 100644
--- a/src/templates/static/support.html
+++ b/src/templates/static/support.html
@@ -1,6 +1,6 @@
 {% extends "../base.html" %}
 
-{% block title %}{{ _("Support") }}{% end block %}
+{% block title %}{{ _("Help") }}{% end block %}
 
 {% block container %}
 	<section class="hero has-background-primary-light">
@@ -12,11 +12,11 @@
 							<a href="/">Home</a>
 						</li>
 						<li class="is-active">
-							<a href="#" aria-current="page">Support</a>
+							<a href="#" aria-current="page">Help</a>
 						</li>
 					</ul>
 				</nav>
-				<h1 class="title is-1">{{ _("Support") }}</h1>
+				<h1 class="title is-1">{{ _("Help") }}</h1>
 				<p class="subtitle">
 					{{ _("Need Help?")}}
 					{{ _("We are here for you") }}
@@ -34,99 +34,99 @@
 		</div>
 	</div>-->
 
-	<div class="container">
-		<section class="section is-medium">
-			<div class="columns is-vcentered">
-				<div class="column is-1"></div>
-				<div class="column is-1 is-narrow">
-					<i class="fas fa-solid fa-pen-alt fa-5x"></i>
-				</div>
-				<div class="column is-1"></div>
-
-				<div class="column is-6">
-					<h5 class="title is-5">
-						IPFire<span class="has-text-primary">_</span>Wiki
-					</h5>
-
-					<p>
-						Our wiki has everything there is to know about IPFire
-						It is written by the community and everyone can join and improve it
-					</p>
+	<section class="section is-medium">
+		<div class="container">
+			<section class="is-large">
+				<div class="has-background-lwl has-text-white">
+					<div class="columns is-centered is-vcentered">
+						<div class="column is-7">
+							<section class="section">
+								<div class="block">
+									<h3 class="title is-3 has-text-white">{{ _("Get Professional Support") }}</h4>
+								</div>
+								<div class="block">
+									<p>
+										Lightning Wire Labs provides professional support services
+										for companies that use IPFire.
+									</p>
 
+									<p>
+										The team of developers implements custom solutions based on IPFire and
+										carries out development of new features.
+										They will help you with designing a secure network that is tailored to
+										the specific needs of your business and support you with the integration
+										of IPFire.
+									</p>
+								</div>
+								<div class="block">
+									<button class="button is-white has-text-lwl has-text-weight-bold" href="https://www.lightningwirelabs.com/">
+										{{ _("Go to Website") }}
+									</button>
+								</div>
+							</section>
+						</div>
+						<div class="column is-2">
+							<figure class="image is-128x128">
+								<img src="{{ static_url("img/lightningwirelabs-logo.svg") }}" alt="{{ _("Lightning Wire Labs") }}">
+							</figure>
+						</div>
+					</div>
 				</div>
-				<div class="column">
-					<button class="button is-primary is-centered is-narrow is-large has-text-weight-bold" href="https://wiki.ipfire.org/">
-						{{ _("Go to Wiki") }}
-					</button>
-				</div>
-			</div>
-		</section>
+			</section>
+		</div>
+	</section>
 
-		<section class="is-large">
-			<div class="has-background-lwl has-text-white">
-				<div class="columns is-centered is-vcentered">
-					<div class="column is-7">
-						<section class="section">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-half">
 							<div class="block">
-								<h3 class="title is-3 has-text-white">{{ _("Get Professional Support") }}</h4>
+								<h3 class="title is-3">
+									IPFire<span class="has-text-primary">_</span>Wiki
+								</h3>
 							</div>
 							<div class="block">
-								<p>
-									Lightning Wire Labs provides professional support services
-									for companies that use IPFire.
-								</p>
-
-								<p>
-									The team of developers implements custom solutions based on IPFire and
-									carries out development of new features.
-									They will help you with designing a secure network that is tailored to
-									the specific needs of your business and support you with the integration
-									of IPFire.
-								</p>
+								<div class="column is-2 is-narrow is-centered">
+									<i class="fas fa-solid fa-pen-alt fa-5x"></i>
+								</div>
 							</div>
 							<div class="block">
-								<button class="button is-white has-text-lwl has-text-weight-bold" href="https://www.lightningwirelabs.com/">
-									{{ _("Go to Website") }}
+								<button class="button is-primary is-centered is-narrow is-large has-text-weight-bold is-fullwidth" href="https://wiki.ipfire.org/">
+									{{ _("Go to Wiki") }}
 								</button>
 							</div>
-						</section>
-					</div>
-					<div class="column is-2">
-						<figure class="image is-128x128">
-							<img src="{{ static_url("img/lightningwirelabs-logo.svg") }}" alt="{{ _("Lightning Wire Labs") }}">
-						</figure>
-					</div>
-				</div>
-			</div>
-		</section>
-
-
-		<section class="section is-medium">
-			<div class="columns is-vcentered">
-				<div class="column is-1"></div>
-				<div class="column is-1 is-narrow">
-					<i class="fas fa-solid fa-hands-helping fa-5x"></i>
-				</div>
-				<div class="column is-1"></div>
-
-				<div class="column is-6">
-					<h5 class="title is-5">
-						IPFire<span class="has-text-primary">_</span>Community
-					</h5>
-
-					<p>
-						Talk to the IPFire Community on our community portal.
-						Ask about how to get started with IPFire, how you can
-						contribute to the project, and what else you always
-						wanted to know about IPFire...
-					</p>
+							<div class="block">
+								<p>
+									Our wiki has everything there is to know about IPFire
+									It is written by the community and everyone can join and improve it
+								</p>
+							</div>
 				</div>
 				<div class="column">
-					<button class="button is-primary is-centered is-narrow is-large has-text-weight-bold" href="https://community.ipfire.org/">
-						{{ _("Go to Community") }}
-					</button>
+							<div class="block">
+								<h3 class="title is-3">
+									IPFire<span class="has-text-primary">_</span>Community
+								</h3>
+							</div>
+							<div class="block">
+								<div class="column is-2 is-narrow is-centered">
+									<i class="fas fa-solid fa-hands-helping fa-5x"></i>
+								</div>
+							</div>
+							<div class="block">
+								<button class="button is-primary is-centered is-narrow is-large has-text-weight-bold is-fullwidth" href="https://community.ipfire.org/">
+									{{ _("Go to Community") }}
+								</button>
+							</div>
+							<div class="block">
+								<p>
+									Talk to the IPFire Community on our community portal.
+									Ask about how to get started with IPFire, how you can
+									contribute to the project, and what else you always
+									wanted to know about IPFire...
+								</p>
+							</div>
 				</div>
 			</div>
-		</section>
+		</div>
 	</div>
 {% end block %}
-- 
2.47.3