index: Redesign intro

[ipfire.org.git] / src / templates / index.html

diff --git a/src/templates/index.html b/src/templates/index.html
index dcf789b003998be9f91d5a4f2134c9f05b0ee885..a431e581d10f57b36f0a0fbc0044b5dbccc792de 100644 (file)
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -8,25 +8,22 @@
 
 {% block container %}
        <div class="main">
-               <section class="intro">
-                       <div class="container">
-                               <div class="branding">
-                                       <h1 class="display-1">IP<strong>Fire</strong></h1>
-                                       <h5>The Open Source Firewall Distribution</h5>
+               <div class="container intro">
+                       <div class="row">
+                               <div class="col-7">
+                                       <h1 class="display-3 mt-5">The Open Source Firewall Distribution</h1>
+
+                                       <div class="btn-toolbar">
+                                               <a class="btn btn-outline-primary btn-lg mr-3" href="/download">{{ _("Download") }}</a>
+                                               <a class="btn btn-outline-light btn-lg ml-3" href="/features">{{ _("Features") }}</a>
+                                       </div>
                                </div>
 
-                               <div class="row justify-content-center">
-                                       <a class="btn btn-outline-primary btn-lg mr-3" href="/download">{{ _("Download") }}</a>
-                                       <a class="btn btn-outline-dark btn-lg ml-3" href="/features">{{ _("Features") }}</a>
+                               <div class="col-5 text-center">
+                                       <img class="img-fluid" src="{{ static_url("img/ipfire-tux.png") }}" alt="IPFire Logo" />
                                </div>
                        </div>
-
-                       <div class="page-scroll">
-                               <a href="#features" class="btn btn-outline-primary rounded-circle scroll">
-                                       <svg class="icon i_lg i_arrow_down"><use xlink:href="#arrow_down"/></svg>
-                               </a>
-                       </div>
-               </section>
+               </div>
 
                <section id="features">
                        <div class="container">