bootstrap 4: port index.html

[pbs.git] / src / templates / index.html

diff --git a/src/templates/index.html b/src/templates/index.html
index da1c8ed81ba70b3d48410aee9b7b4819b7536b07..f6e616466d79a491808be559828c19239359cad1 100644 (file)
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -4,23 +4,28 @@
 
 {% block body %}
        {% if current_user %}
-               <div class="page-header">
-                       <h2>{{ _("Welcome, %s!") % current_user.firstname }}</h2>
+               <div class="row">
+                       <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                               <h2 class="text-center" >{{ _("Welcome, %s!") % current_user.firstname }}</h2>
+                       </div>
                </div>
 
 
        {% else %}
-               <div class="hero-unit ac" style="background-color: white">
-                       <br>
-                       <h1>
-                               {{ _("Pakfire Build Service") }}
-                       </h1>
+               <div class="row" style="background-color: white">
+                       <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                               <br>
+                               <h1 class="text-center" >
+                                       {{ _("Pakfire Build Service") }}
+                               </h1>
 
-                       <hr>
+                               <hr>
+                               <br>
 
-                       <h2>
-                               <small>{{ _("Development powered by community!") }}</small>
-                       </h2>
+                               <h2 class="text-center">
+                                       <small>{{ _("Development powered by community!") }}</small>
+                               </h2>
+                       </div>
                </div>
 
                <hr>
@@ -28,12 +33,18 @@
 
        {% if updates %}
                <div class="row">
-                       <div class="span12">
-                               <div class="tabbable">
-                                       <ul class="nav nav-tabs">
-                                               {% for type, updts, active in updates %}
-                                                       <li {% if active %}class="active"{% end %}>
-                                                               <a href="#updates_{{ type }}" data-toggle="tab">
+                       <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                               <ul class="nav nav-tabs" role="tablist">
+                                       {% for type, updts, active in updates %}
+                                               <li class="nav-item">
+                                                       <a
+                                                               {% if active %}
+                                                                       class="nav-link active"
+                                                               {% else %}
+                                                                       class="nav-link"
+                                                               {% end %}
+                                                               href="#updates_{{ type }}" data-toggle="tab"
+                                                               role="tab">
                                                                        {% if type == "stable" %}
                                                                                {{ _("Latest stable updates") }}
                                                                        {% elif type == "unstable" %}
@@ -41,25 +52,25 @@
                                                                        {% elif type == "testing" %}
                                                                                {{ _("Testing updates") }}
                                                                        {% end %}
-                                                               </a>
-                                                       </li>
-                                               {% end %}
-                                       </ul>
-
-                                       <div class="tab-content">
-                                               {% for type, updts, active in updates %}
-                                                       <div class="tab-pane {% if active %}active{% end %}" id="updates_{{ type }}">
-                                                               {% module UpdatesTable(updts) %}
-                                                       </div>
-                                               {% end %}
-                                       </div>
+                                                       </a>
+                                               </li>
+                                       {% end %}
+                               </ul>
+                               <div class="tab-content">
+                                       {% for type, updts, active in updates %}
+                                               <div class="tab-pane {% if active %}active{% end %}" id="updates_{{ type }}">
+                                                       {% module UpdatesTable(updts) %}
+                                               </div>
+                                       {% end %}
                                </div>
-
-                               <p class="pull-right">
+                       </div>
+               </div>
+               <div class="row">
+                       <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                               <p class="float-right">
                                        <a href="/updates">{{ _("View more updates...") }}</a>
                                </p>
-
-                               <br style="clear: both;">
+                               <br>
                        </div>
                </div>
        {% end %}