docs/files/index: restyled the page

diff --git a/src/templates/docs/files/index.html b/src/templates/docs/files/index.html
index 486d36cf9af0293f67ec1f7cce007f82057f6544..70f8ce1f771aee2f7cf3491320e1e83afef970e5 100644 (file)
--- a/src/templates/docs/files/index.html
+++ b/src/templates/docs/files/index.html
@@ -4,21 +4,19 @@
 
 {% block main %}
        {% if files %}
-               <div class="card mb-4">
-                       <div class="card-body">
-                               <h4 class="card-title">{{ _("Files") }}</h4>
+               <section class="section">
+                       <div class="container">
+                               <h4 class="title is-3">{{ _("Files") }}</h3>
 
-                               <div class="row">
+                               <div class="block">
                                        {% for f in files %}
                                                {% if f.is_image() %}
-                                                       <div class="col-sm-6 col-md-4">
-                                                               <figure class="figure">
-                                                                       <a href="{{ f.url }}?action=detail">
-                                                                               <img class="figure-img img-fluid img-thumbnail" src="{{ f.url }}?s=256" alt="{{ f.filename }}">
-                                                                               <figcaption class="figure-caption">{{ f.filename }}</figcaption>
-                                                                       </a>
-                                                               </figure>
-                                                       </div>
+                                                       <figure class="image">
+                                                               <a href="{{ f.url }}?action=detail">
+                                                                       <img class="figure-img img-fluid img-thumbnail" src="{{ f.url }}?s=256" alt="{{ f.filename }}">
+                                                                       <p class="is-size-7">{{ f.filename }}</p>
+                                                               </a>
+                                                       </figure>
                                                {% end %}
                                        {% end %}
                                </div>
@@ -39,25 +37,36 @@
                                        {% end %}
                                </ul>
                        </div>
-               </div>
+               </section>
        {% end %}
 
-       <div class="card">
-               <div class="card-body">
-                       <h6 class="card-title">{{ _("Upload File") }}</h6>
+       <section class="section">
+               <div class="container">
+                       <h5 class="title is-5">{{ _("Upload File") }}</h5>
 
                        <form method="POST" action="/docs/_upload" enctype="multipart/form-data">
                                {% raw xsrf_form_html() %}
 
                                <input type="hidden" name="path" value="{{ path }}">
 
-                               <div class="mb-3">
-                                       <input class="form-control" type="file" name="file" required>
-                                       <label class="form-label" for="customFile">{{ _("Choose a file to upload") }}</label>
+                               <div class="block">
+                                       <div class="file">
+                                               <label class="file-label">
+                                                       <input class="file-input" type="file" name="file" required>
+                                                       <span class="file-cta">
+                                                               <span class="file-icon">
+                                                                       <i class="fas fa-upload"></i>
+                                                               </span>
+                                                               <span class="file-label">
+                                                                       {{ _("Choose a file to upload") }}
+                                                               </span>
+                                                       </span>
+                                               </label>
+                                       </div>
                                </div>
 
-                               <div class="d-grid">
-                                       <input class="btn btn-primary" type="submit" value="{{ _("Upload") }}">
+                               <div class="block">
+                                       <input class="button is-primary" type="submit" value="{{ _("Upload") }}">
                                </div>
                        </form>
                </div>