fireinfo/releases: restyled the page

diff --git a/src/templates/fireinfo/releases.html b/src/templates/fireinfo/releases.html
index 9ff05746a84000ab660106aea523345b29d0c400..243878afac3b12f904dbe672d3f40ae97b47164d 100644 (file)
--- a/src/templates/fireinfo/releases.html
+++ b/src/templates/fireinfo/releases.html
@@ -3,37 +3,57 @@
 {% block title %}{{ _("Releases") }}{% end block %}
 
 {% block container %}
-       <section>
-               <div class="container">
-                       <div class="row">
-                               <div class="col-12">
-                                       <h1>{{ _("Releases") }}</h1>
-                               </div>
+       <section class="hero is-primary">
+               <div class="hero-body">
+                       <div class="container">
+                               <nav class="breadcrumb is-medium" aria-label="breadcrumbs">
+                                       <ul>
+                                               <li>
+                                                       <a href="https://ipfire.org/">
+                                                               Home
+                                                       </a>
+                                               </li>
+                                               <li>
+                                                       <a href="/">
+                                                               {{ _("Fireinfo") }}
+                                                       </a>
+                                               </li>
+                                               <li class="is-active">
+                                                       <a href="#">
+                                                               {{ _("Releases") }}
+                                                       </a>
+                                               </li>
+                                       </ul>
+                               </nav>
+
+                               <h1 class="title is-1">{{ _("Releases") }}</h1>
                        </div>
                </div>
        </section>
 
-       <div class="container">
-               <dl class="row">
+       <section class="section">
+               <div class="container">
                        {% for name, percentage in releases %}
-                               <dt class="col-sm-5">{{ name.replace("core", "Core Update ") }}</dt>
+                               <div class="columns">
+                                       <div class="column is-4">{{ name.replace("core", "Core Update ") }}</div>
 
-                               <dd class="col-sm-7">
-                                       {% module ProgressBar(percentage, "primary") %}
-                               </dd>
+                                       <div class="column">
+                                               {% module ProgressBar(percentage, "primary") %}
+                                       </div>
+                               </div>
                        {% end %}
-               </dl>
 
-               <h2>{{ _("Kernels") }}</h2>
+                       <h2 class="title is-2">{{ _("Kernels") }}</h2>
 
-               <dl class="row">
                        {% for name, percentage in kernels %}
-                               <dt class="col-sm-5">{{ name }}</dt>
+                               <div class="columns">
+                                       <div class="column is-4">{{ name }}</div>
 
-                               <dd class="col-sm-7">
-                                       {% module ProgressBar(percentage, "info") %}
-                               </dd>
+                                       <div class="column">
+                                               {% module ProgressBar(percentage, "info") %}
+                                       </div>
+                               </div>
                        {% end %}
-               </dl>
-       </div>
+               </div>
+       </section>
 {% end block %}