bootstrap4: port mirror sites to bootstrap 4

Signed-off-by: Jonatan Schlag <jonatan.schlag@ipfire.org>

diff --git a/src/templates/mirrors/delete.html b/src/templates/mirrors/delete.html
index 2ad999377114eb4e7379ae1cdf09fbbe0c680e58..53b6fcac2970edd4989d428347ab9ef0d5088939 100644 (file)
--- a/src/templates/mirrors/delete.html
+++ b/src/templates/mirrors/delete.html
@@ -3,38 +3,49 @@
 {% block title %}{{ _("Delete mirror %s") % mirror.hostname }}{% end block %}
 
 {% block body %}
-       <ul class="breadcrumb">
-               <li>
-                       <a href="/">{{ _("Home") }}</a>
-                       <span class="divider">/</span>
-               </li>
-               <li>
-                       <a href="/mirrors">{{ _("Mirrors") }}</a>
-                       <span class="divider">/</span>
-               </li>
-               <li>
-                       <a href="/mirror/{{ mirror.hostname }}">{{ mirror.hostname }}</a>
-                       <span class="divider">/</span>
-               </li>
-               <li class="active">
-                       <a href="/mirror/{{ mirror.hostname }}/delete">{{ _("Delete") }}</a>
-               </li>
-       </ul>
-
-       <div class="page-header">
-               <h2>{{ _("Delete mirror: %s") % mirror.hostname }}</h2>
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <nav aria-label="breadcrumb" role="navigation">
+                               <ol class="breadcrumb">
+                                       <li class="breadcrumb-item"><a href="/">{{ _("Home") }}</a></li>
+                                       <li class="breadcrumb-item"><a href="/mirrors">{{ _("Mirrors") }}</a></li>
+                                       <li class="breadcrumb-item">
+                                               <a href="/mirror/{{ mirror.hostname }}">{{ mirror.hostname }}</a>
+                                       </li>
+                                       <li class="breadcrumb-item active">
+                                               <a href="/mirror/{{ mirror.hostname }}/delete">{{ _("Delete") }}</a>
+                                       </li>
+                               </ol>
+                       </nav>
+               </div>
        </div>
 
-       <p>
-               {{ _("You are going to delete the mirror %s.") % mirror.hostname }}
-       </p>
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <div class="alert alert-danger" role="alert">
+                               <h2 class="alert-heading" style="word-wrap: break-word;">
+                                       {{ _("Delete mirror: %s") % mirror.hostname }}
+                               </h2>
+                               <p>
+                                       {{ _("You are going to delete the mirror %s.") % mirror.hostname }}
+                               </p>
+                       </div>
+               </div>
+       </div>
 
-       <div class="btn-toolbar pull-right">
-               <a class="btn btn-danger" href="/mirror/{{ mirror.hostname }}/delete?confirmed=1">
-                       {{ _("Delete %s") % mirror.hostname }}
-               </a>
-               <a class="btn" href="/mirror/{{ mirror.hostname }}">{{ _("Cancel") }}</a>
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <div class="btn-toolbar" role="toolbar">
+                               <div class="btn-group mr-2" role="group">
+                                       <a class="btn btn-danger" href="/mirror/{{ mirror.hostname }}/delete?confirmed=1">
+                                               {{ _("Delete %s") % mirror.hostname }}
+                                       </a>
+                               </div>
+                               <div class="btn-group" role="group">
+                                       <a class="btn btn-primary" href="/mirror/{{ mirror.hostname }}">{{ _("Cancel") }}</a>
+                               </div>
+                       </div>
+               </div>
        </div>
 
-       <br class="clear">
 {% end block %}

diff --git a/src/templates/mirrors/detail.html b/src/templates/mirrors/detail.html
index 5940b14cb912284acacbc7f5ea60766e5151a830..8ab65dfc136d1d01db40343efc36bf86d924ac07 100644 (file)
--- a/src/templates/mirrors/detail.html
+++ b/src/templates/mirrors/detail.html
@@ -19,31 +19,29 @@
 
 
        <div class="row">
-               <div class="col-12 col-sm-12 col-md-6 col-lg-9 col-xl-9">
+               <div class="col-12 col-sm-12 col-md-9 col-lg-10 col-xl-10">
                        <h2 style="word-wrap: break-word;">
                                {{ _("Mirror: %s") % mirror.hostname }} <br>
                                <small class="text-muted">{{ mirror.owner }}</small>
                        </h2>
                </div>
                {% if current_user and current_user.has_perm("manage_mirrors") %}
-                       <div class="col-12 col-sm-12 col-md-6 col-lg-3 col-xl-3">
-                               <div class="dropdown justify-content-center justify-content-lg-end justify-content-xl-end">
-                                       <button class="btn dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                                               {{ _("Actions") }}
-                                       </button>
-                                       <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
-                                               <a class="dropdown-item" href="/mirror/new">
-                                                       <i class="icon-asterisk"></i> {{ _("Add new mirror") }}
-                                               </a>
-                                               <a class="dropdown-item" href="/mirror/{{ mirror.hostname }}/edit">
-                                                       <i class="icon-edit"></i>
-                                                       {{ _("Edit settings") }}
-                                               </a>
-                                               <a class="dropdown-item" href="/mirror/{{ mirror.hostname }}/delete">
-                                                       <i class="icon-trash"></i>
-                                                       {{ _("Delete mirror") }}
-                                               </a>
-                                       </div>
+                       <div class="col-12 col-sm-12 col-md-3 col-lg-2 col-xl-2">
+                               <button class="btn dropdown-toggle btn-block " type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                       {{ _("Actions") }}
+                               </button>
+                               <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                                       <a class="dropdown-item" href="/mirror/new">
+                                               <i class="icon-asterisk"></i> {{ _("Add new mirror") }}
+                                       </a>
+                                       <a class="dropdown-item" href="/mirror/{{ mirror.hostname }}/edit">
+                                               <i class="icon-edit"></i>
+                                               {{ _("Edit settings") }}
+                                       </a>
+                                       <a class="dropdown-item" href="/mirror/{{ mirror.hostname }}/delete">
+                                               <i class="icon-trash"></i>
+                                               {{ _("Delete mirror") }}
+                                       </a>
                                </div>
                        </div>
                {% end %}
@@ -51,7 +49,7 @@
 
        <div class="row">
                <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
-                               <h3>{{ _("General") }}</h3>
+                       <h3>{{ _("General") }}</h3>
                        <div class="table-responsive">
                                <table class="table table-striped table-hover">
                                        <tbody>

diff --git a/src/templates/mirrors/edit.html b/src/templates/mirrors/edit.html
index 4be0bac40a7686676b0053eee4be43b298bd729a..a17aa03d15a94e70f847362de310ee6f57d01c6a 100644 (file)
--- a/src/templates/mirrors/edit.html
+++ b/src/templates/mirrors/edit.html
@@ -3,84 +3,76 @@
 {% block title %}{{ _("Manage mirror %s") % mirror.hostname }}{% end block %}
 
 {% block body %}
-       <ul class="breadcrumb">
-               <li>
-                       <a href="/">{{ _("Home") }}</a>
-                       <span class="divider">/</span>
-               </li>
-               <li>
-                       <a href="/mirrors">{{ _("Mirrors") }}</a>
-                       <span class="divider">/</span>
-               </li>
-               <li>
-                       <a href="/mirror/{{ mirror.hostname }}">{{ mirror.hostname }}</a>
-                       <span class="divider">/</span>
-               </li>
-               <li class="active">
-                       <a href="/mirror/{{ mirror.hostname }}/edit">{{ _("Manage") }}</a>
-               </li>
-       </ul>
-
-       <div class="page-header">
-               <h2>{{ _("Manage mirror: %s") % mirror.hostname }}</h2>
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <nav aria-label="breadcrumb" role="navigation">
+                               <ol class="breadcrumb">
+                                       <li class="breadcrumb-item"><a href="/">{{ _("Home") }}</a></li>
+                                       <li class="breadcrumb-item"><a href="/mirrors">{{ _("Mirrors") }}</a></li>
+                                       <li class="breadcrumb-item">
+                                               <a href="/mirror/{{ mirror.hostname }}">{{ mirror.hostname }}</a>
+                                       </li>
+                                       <li class="breadcrumb-item active">
+                                                       <a href="/mirror/{{ mirror.hostname }}/edit">{{ _("Manage") }}</a>
+                                       </li>
+                               </ol>
+                       </nav>
+               </div>
        </div>
 
-       <form class="form-horizontal" method="POST" action="">
-               {% raw xsrf_form_html() %}
-               <fieldset>
-                       <div class="control-group">
-                               <label class="control-label" for="name">{{ _("Hostname") }}</label>
-                               <div class="controls">
-                                       <input type="text" class="input-xlarge" id="name" name="name" value="{{ mirror.hostname }}">
-
-                                       <p class="help-block">
-                                               {{ _("The canonical hostname.") }}
-                                       </p>
-                               </div>
-                       </div>
-
-                       <div class="control-group">
-                               <label class="control-label">{{ _("Supports HTTPS") }}</label>
-                               <div class="controls">
-                                       <label class="checkbox">
-                                               <input type="checkbox" name="supports_https" {% if mirror.supports_https %}checked{% end %}>
-                                               {{ _("Check if this mirror server supports HTTPS.") }}
-                                       </label>
-                               </div>
-                       </div>
-               </fieldset>
-
-               <fieldset>
-                       <legend>{{ _("Contact information") }}</legend>
-
-                       <div class="control-group">
-                               <label class="control-label" for="owner">{{ _("Owner") }}</label>
-                               <div class="controls">
-                                       <input type="text" class="input-xlarge" id="owner" name="owner" value="{{ mirror.owner }}">
-
-                                       <p class="help-block">
-                                               {{ _("The owner of the mirror server.") }}
-                                       </p>
-                               </div>
-                       </div>
-
-                       <div class="control-group">
-                               <label class="control-label" for="contact">{{ _("Contact address") }}</label>
-                               <div class="controls">
-                                       <input type="text" class="input-xlarge" id="contact" name="contact" value="{{ mirror.contact }}">
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <h2 style="word-wrap: break-word;">
+                               {{ _("Manage mirror: %s") % mirror.hostname }}
+                       </h2>
+               </div>
+       </div>
 
-                                       <p class="help-block">
-                                               {{ _("An email address to contact an administrator of the mirror.") }}
-                                               <br>
-                                               <em>{{ _("This won't be made public.") }}</em>
-                                       </p>
-                               </div>
-                       </div>
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <form method="POST" action="">
+                               {% raw xsrf_form_html() %}
+                               <fieldset>
+                                       <div class="form-group">
+                                               <label for="name">{{ _("Hostname") }}</label>
+                                               <input type="text" class="form-control" id="name" name="name"
+                                                       aria-describedby="nameHelp" value="{{ mirror.hostname }}">
+                                               <small id="nameHelp" class="form-text text-muted">
+                                                       {{ _("The canonical hostname.") }}
+                                               </small>
+                                       </div>
+                                       <div class="form-check">
+                                               <label class="form-check-label">
+                                                       <input class="form-check-input" type="checkbox" name="supports_https" {% if mirror.supports_https %}checked{% end %}>
+                                                       {{ _("Check if this mirror server supports HTTPS.") }}
+                                               </label>
+                                       </div>
+                               </fieldset>
+                               <fieldset>
+                                       <legend>{{ _("Contact information") }}</legend>
+                                       <div class="form-group">
+                                               <label for="owner">{{ _("Owner") }}</label>
+                                               <input type="text" class="form-control" id="owner" name="owner"
+                                                       aria-describedby="ownerHelp" placeholder="{{ _("Owner") }}" value="{{ mirror.owner }}">
+                                               <small id="ownerHelp" class="form-text text-muted">
+                                                       {{ _("The owner of the mirror server.") }}
+                                               </small>
+                                       </div>
+                                       <div class="form-group">
+                                               <label for="contact">{{ _("Contact address") }}</label>
+                                               <input type="text" class="form-control" id="contact" name="contact"
+                                                       aria-describedby="contactHelp" placeholder="{{ _("Contact address") }}" value="{{ mirror.contact }}">
+                                               <small id="contactHelp" class="form-text text-muted">
+                                                               {{ _("An email address to contact an administrator of the mirror.") }}
+                                                               <br>
+                                                               <em>{{ _("This won't be made public.") }}</em>
+                                               </small>
+                                       </div>
 
-                       <div class="form-actions">
+                               </fieldset>
                                <button type="submit" class="btn btn-primary">{{ _("Save changes") }}</button>
                                <a class="btn" href="/mirror/{{ mirror.hostname }}">{{ _("Cancel") }}</a>
-                       </div>
-               </fieldset>
-       </form>
+                       </form>
+               </div>
+       </div>
 {% end block %}

diff --git a/src/templates/mirrors/list.html b/src/templates/mirrors/list.html
index 897454d9d4ba83c7593bf8ded343fa3f6269ae39..33c896592e208d86ccad6ab5a513774bbf2d8993 100644 (file)
--- a/src/templates/mirrors/list.html
+++ b/src/templates/mirrors/list.html
@@ -15,20 +15,18 @@
        </div>
 
        <div class="row">
-               <div class="col-12 col-sm-12 col-md-6 col-lg-9 col-xl-6">
+               <div class="col-12 col-sm-12 col-md-3 col-lg-10 col-xl-10">
                        <h2>{{ _("Mirrors") }}</h2>
                </div>
                {% if current_user and current_user.has_perm("manage_mirrors") %}
-                       <div class="col-12 col-sm-12 col-md-6 col-lg-3 col-xl-3">
-                               <div class="dropdown justify-content-center justify-content-lg-end justify-content-xl-end">
-                                       <button class="btn dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                                               {{ _("Actions") }}
-                                       </button>
-                                       <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
-                                                       <a class="dropdown-item" href="/mirror/new">
-                                                               <i class="icon-asterisk"></i> {{ _("Add new mirror") }}
-                                                       </a>
-                                       </div>
+                       <div class="col-12 col-sm-12 col-md-3 col-lg-2 col-xl-2">
+                               <button class="btn dropdown-toggle btn-block" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                       {{ _("Actions") }}
+                               </button>
+                               <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                                               <a class="dropdown-item" href="/mirror/new">
+                                                       <i class="icon-asterisk"></i> {{ _("Add new mirror") }}
+                                               </a>
                                </div>
                        </div>
                {% end %}

diff --git a/src/templates/mirrors/new.html b/src/templates/mirrors/new.html
index 2e5a9ab731d25492aa748513363583ae2651217e..c9446960b973900f5bb4a08a35809325bb5c848a 100644 (file)
--- a/src/templates/mirrors/new.html
+++ b/src/templates/mirrors/new.html
@@ -3,54 +3,53 @@
 {% block title %}{{ _("Add new mirror") }}{% end block %}
 
 {% block body %}
-       <ul class="breadcrumb">
-               <li>
-                       <a href="/">{{ _("Home") }}</a>
-                       <span class="divider">/</span>
-               </li>
-               <li>
-                       <a href="/mirrors">{{ _("Mirrors") }}</a>
-                       <span class="divider">/</span>
-               </li>
-               <li class="active">
-                       <a href="/mirror/new">{{ _("New mirror") }}</a>
-               </li>
-       </ul>
-
-       <div class="page-header">
-               <h2>{{ _("Add a new mirror") }}</h2>
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <nav aria-label="breadcrumb" role="navigation">
+                               <ol class="breadcrumb">
+                                       <li class="breadcrumb-item"><a href="/">{{ _("Home") }}</a></li>
+                                       <li class="breadcrumb-item"><a href="/mirrors">{{ _("Mirrors") }}</a></li>
+                                       <li class="breadcrumb-item active">
+                                               <a href="/mirror/new">{{ _("New mirror") }}</a>
+                                       </li>
+                               </ol>
+                       </nav>
+               </div>
        </div>
 
-       <form class="form-horizontal" method="POST" action="">
-               {% raw xsrf_form_html() %}
-               <fieldset>
-                       <div class="control-group {% if hostname_missing %}error{% end %}">
-                               <label class="control-label" for="name">{{ _("Hostname") }}</label>
-                               <div class="controls">
-                                       <input type="text" class="input-xlarge" id="name" name="name"
-                                               {% if _hostname %}value="{{ _hostname }}"{% end %}>
-
-                                       <p class="help-block">
-                                               {{ _("Enter the canonical hostname of the mirror.") }}
-                                       </p>
-                               </div>
-                       </div>
-
-                       <div class="control-group {% if path_invalid %}error{% end %}">
-                               <label class="control-label" for="name">{{ _("Path") }}</label>
-                               <div class="controls">
-                                       <input type="text" class="input-xlarge" id="path" name="path"
-                                               {% if path %}value="{{ path }}"{% end %}>
-
-                                       <p class="help-block">
-                                               {{ _("The path to the files on the server.") }}
-                                       </p>
-                               </div>
-                       </div>
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <h2 style="word-wrap: break-word;">
+                               {{ _("Add a new mirror") }}
+                       </h2>
+               </div>
+       </div>
 
-                       <div class="form-actions">
-                               <button type="submit" class="btn btn-primary">{{ _("Create new mirror") }}</button>
-                       </div>
-               </fieldset>
-       </form>
+       <div class="row">
+               <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
+                       <form method="POST" action="">
+                               {% raw xsrf_form_html() %}
+                               <fieldset>
+                                       <div class="form-group {% if hostname_missing %}is-invalid{% end %}">
+                                               <label for="name">{{ _("Hostname") }}</label>
+                                               <input type="text" class="form-control" id="name" name="name"
+                                                       aria-describedby="nameHelp" placeholder="{{ _("Hostname") }}" {% if _hostname %}value="{{ _hostname }}"{% end %}>
+                                               <small id="nameHelp" class="form-text text-muted">
+                                                       {{ _("Enter the canonical hostname of the mirror.") }}
+                                               </small>
+                                       </div>
+
+                                       <div class="form-group {% if path_invalid  %}is-invalid{% end %}">
+                                               <label for="path">{{ _("Path") }}</label>
+                                               <input type="text" class="form-control"  id="path" name="path"
+                                                       aria-describedby="pathHelp" placeholder="{{ _("Path") }}" {% if path %}value="{{ path }}"{% end %}>
+                                               <small id="pathHelp" class="form-text text-muted">
+                                                       {{ _("The path to the files on the server.") }}
+                                               </small>
+                                       </div>
+                                       <button type="submit" class="btn btn-primary">{{ _("Create new mirror") }}</button>
+                               </fieldset>
+                       </form>
+               </div>
+       </div>
 {% end block %}