diff --git a/swh/web/assets/src/bundles/browse/content.css b/swh/web/assets/src/bundles/browse/content.css
index 58f29e81..de62c98b 100644
--- a/swh/web/assets/src/bundles/browse/content.css
+++ b/swh/web/assets/src/bundles/browse/content.css
@@ -1,52 +1,52 @@
 /**
  * Copyright (C) 2018-2019  The Software Heritage developers
  * See the AUTHORS file at the top-level directory of this distribution
  * License: GNU Affero General Public License version 3, or any later version
  * See top-level LICENSE file for more information
  */
 
 .swh-content {
     background-image: none;
     background-color: white;
     padding: 0;
 }
 
 .swh-content pre,
 .swh-content pre code {
     margin: 0;
     padding: 0;
 }
 
 .swh-content img,
 .swh-content svg {
     max-width: 100%;
 }
 
 .chosen-container {
     color: #444;
 }
 
 .chosen-container .chosen-single div b {
     margin-top: 2px;
     filter: brightness(0%);
 }
 
 .chosen-container .chosen-single {
-    height: 31px;
+    height: 100%;
     line-height: 1.5;
     border-radius: 0px;
     background-color: #f4f4f4;
     border-color: #ddd;
     background-image:none;
     -webkit-box-shadow: none;
 	-moz-box-shadow: none;
     box-shadow: none;
     font-weight: 400;
     font-size: 14px;
     padding-top: 4px;
     padding-bottom: 4px;
 }
 
 .chosen-container .chosen-single:hover {
     background-color: #e7e7e7;
 }
diff --git a/swh/web/assets/src/bundles/webapp/webapp.css b/swh/web/assets/src/bundles/webapp/webapp.css
index 15b24e88..9b4f408b 100644
--- a/swh/web/assets/src/bundles/webapp/webapp.css
+++ b/swh/web/assets/src/bundles/webapp/webapp.css
@@ -1,504 +1,508 @@
 /**
  * Copyright (C) 2018-2019  The Software Heritage developers
  * See the AUTHORS file at the top-level directory of this distribution
  * License: GNU Affero General Public License version 3, or any later version
  * See top-level LICENSE file for more information
  */
 
 html {
     height: 100%;
     overflow-x: hidden;
 }
 
 body {
     min-height: 100%;
     margin: 0;
     position: relative;
     padding-bottom: 120px;
 }
 
 a:active,
 a.active {
     outline: none;
 }
 
 code {
     background-color: #f9f2f4;
 }
 
 pre code {
     background-color: transparent;
 }
 
 footer {
     background-color: #262626;
     color: #fff;
     font-size: 0.8rem;
     position: absolute;
     bottom: 0;
     width: 100%;
     padding-top: 20px;
     padding-bottom: 20px;
 }
 
 footer a,
 footer a:visited,
 footer a:hover {
     color: #fecd1b;
 }
 
 footer a:hover {
     text-decoration: underline;
 }
 
 .link-color {
     color: #fecd1b;
 }
 
 pre {
     background-color: #f5f5f5;
     border: 1px solid #ccc;
     border-radius: 4px;
     padding: 9.5px;
     font-size: 0.8rem;
 }
 
 .btn.active {
     background-color: #e7e7e7;
 }
 
 .card {
     margin-bottom: 5px !important;
     overflow-x: auto;
 }
 
 .navbar-brand {
     padding: 5px;
     margin-right: 0;
 }
 
 .table {
     margin-bottom: 0;
 }
 
 .swh-table thead {
     background-color: #f2f4f5;
     border-top: 1px solid rgba(0, 0, 0, 0.2);
     font-weight: normal;
 }
 
 .swh-table-striped th {
     border-top: none;
 }
 
 .swh-table-striped tbody tr:nth-child(even) {
     background-color: #f2f4f5;
 }
 
 .swh-table-striped tbody tr:nth-child(odd) {
     background-color: #fff;
 }
 
 .swh-web-app-link a {
     text-decoration: none;
     border: none;
 }
 
 .swh-web-app-link:hover {
     background-color: #efeff2;
 }
 
 .table > thead > tr > th {
     border-top: none;
     border-bottom: 1px solid #e20026;
 }
 
 .table > tbody > tr > td {
     border-style: none;
 }
 
 .sitename .first-word,
 .sitename .second-word {
     color: rgba(0, 0, 0, 0.75);
     font-weight: normal;
     font-size: 1.2rem;
 }
 
 .sitename .first-word {
     font-family: 'Alegreya Sans', sans-serif;
 }
 
 .sitename .second-word {
     font-family: 'Alegreya', serif;
 }
 
 .swh-counter {
     font-size: 150%;
 }
 
 .swh-http-error {
     margin: 0 auto;
     text-align: center;
 }
 
 .swh-http-error-head {
     color: #2d353c;
     font-size: 30px;
 }
 
 .swh-http-error-code {
     bottom: 60%;
     color: #2d353c;
     font-size: 96px;
     line-height: 80px;
     margin-bottom: 10px !important;
 }
 
 .swh-http-error-desc {
     font-size: 12px;
     color: #647788;
     text-align: center;
 }
 
 .swh-http-error-desc pre {
     display: inline-block;
     text-align: left;
     max-width: 800px;
     white-space: pre-wrap;
 }
 
 .popover {
     max-width: 97%;
     z-index: 40000;
 }
 
 .modal {
     text-align: center;
     padding: 0 !important;
 }
 
 .modal::before {
     content: '';
     display: inline-block;
     height: 100%;
     vertical-align: middle;
     margin-right: -4px;
 }
 
 .modal-dialog {
     display: inline-block;
     text-align: left;
     vertical-align: middle;
 }
 
 .dropdown-submenu {
     position: relative;
 }
 
 .dropdown-submenu .dropdown-menu {
     top: 0;
     left: -100%;
     margin-top: -5px;
     margin-left: -2px;
 }
 
 .dropdown-item:hover,
 .dropdown-item:focus {
     background-color: rgba(0, 0, 0, 0.1);
 }
 
 a.dropdown-left::before {
     content: "\f0d9";
     font-family: 'FontAwesome';
     display: block;
     width: 20px;
     height: 20px;
     float: left;
     margin-left: 0;
 }
 
 #swh-navbar {
     border-top-style: none;
     border-left-style: none;
     border-right-style: none;
     border-bottom-style: solid;
     border-bottom-width: 5px;
     border-image: linear-gradient(to right, rgb(226, 0, 38) 0%, rgb(254, 205, 27) 100%) 1 1 1 1;
     width: 100%;
     padding: 5px;
     margin-bottom: 10px;
     margin-top: 30px;
     justify-content: normal;
     flex-wrap: nowrap;
     height: 72px;
     overflow: hidden;
 }
 
 #back-to-top {
     display: none;
     position: fixed;
     bottom: 30px;
     right: 30px;
     z-index: 10;
 }
 
 #back-to-top a img {
     display: block;
     width: 32px;
     height: 32px;
     background-size: 32px 32px;
     text-indent: -999px;
     overflow: hidden;
 }
 
 .swh-top-bar {
     direction: ltr;
     height: 30px;
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     z-index: 99999;
     background-color: #262626;
     color: #fff;
     text-align: center;
     font-size: 14px;
 }
 
 .swh-top-bar ul {
     margin-top: 4px;
     padding-left: 0;
     white-space: nowrap;
 }
 
 .swh-top-bar li {
     display: inline-block;
     margin-left: 10px;
     margin-right: 10px;
 }
 
 .swh-top-bar a,
 .swh-top-bar a:visited {
     color: white;
 }
 
 .swh-top-bar a.swh-current-site,
 .swh-top-bar a.swh-current-site:visited {
     color: #fecd1b;
 }
 
 .swh-position-right {
     position: absolute;
     right: 0;
 }
 
 .swh-donate-link {
     border: 1px solid #fecd1b;
     background-color: #e20026;
     color: white !important;
     padding: 3px;
     border-radius: 3px;
 }
 
 .swh-navbar-content h4 {
     padding-top: 7px;
 }
 
 .swh-navbar-content .bread-crumbs {
     display: block;
     margin-left: -40px;
 }
 
 .swh-navbar-content .bread-crumbs li.bc-no-root {
     padding-top: 7px;
 }
 
 .main-sidebar {
     margin-top: 30px;
 }
 
 .content-wrapper {
     background: none;
 }
 
 .brand-image {
     max-height: 40px;
 }
 
 .brand-link {
     padding-top: 18.5px;
     padding-bottom: 18px;
     padding-left: 4px;
     border-bottom: 5px solid #e20026 !important;
 }
 
 .navbar-header a,
 ul.dropdown-menu a,
 ul.navbar-nav a,
 ul.nav-sidebar a {
     border-bottom-style: none;
     color: #323232;
 }
 
 .swh-sidebar .nav-link.active {
     color: #323232 !important;
     background-color: #e7e7e7 !important;
 }
 
 .swh-image-error {
     width: 80px;
     height: auto;
 }
 
 @media (max-width: 600px) {
+    .card {
+        min-width: 80%;
+    }
+
     .swh-image-error {
         width: 40px;
         height: auto;
     }
 
     .swh-navbar-content h4 {
         font-size: 1rem;
     }
 
     .swh-donate-link {
         display: none;
     }
 }
 
 .form-check-label {
     padding-top: 4px;
 }
 
 .swh-id-option {
     display: inline-block;
     margin-right: 5px;
     line-height: 1rem;
 }
 
 .nav-pills .nav-link:not(.active):hover {
     color: rgba(0, 0, 0, 0.55);
 }
 
 .swh-heading-color {
     color: #e20026 !important;
 }
 
 .sidebar-mini.sidebar-collapse .main-sidebar:hover {
     width: 4.6rem;
 }
 
 .sidebar-mini.sidebar-collapse .main-sidebar:hover .user-panel > .info,
 .sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-sidebar .nav-link p,
 .sidebar-mini.sidebar-collapse .main-sidebar:hover .brand-text {
     visibility: hidden !important;
 }
 
 .sidebar .nav-link p,
 .main-sidebar .brand-text,
 .sidebar .user-panel .info {
     transition: none;
 }
 
 .sidebar-mini.sidebar-mini.sidebar-collapse .sidebar {
     padding-right: 0;
 }
 
 .swh-words-logo {
     position: absolute;
     top: 0;
     left: 0;
     width: 73px;
     height: 73px;
     text-align: center;
     font-size: 10pt;
     color: rgba(0, 0, 0, 0.75);
 }
 
 .swh-words-logo:hover {
     text-decoration: none;
 }
 
 .swh-words-logo-swh {
     line-height: 1;
     padding-top: 13px;
     visibility: hidden;
 }
 
 hr.swh-faded-line {
     border: 0;
     height: 1px;
     background-image: linear-gradient(to left, #f0f0f0, #8c8b8b, #f0f0f0);
 }
 
 .swh-readme-txt pre {
     background: none;
     border: none;
 }
 
 .swh-coverage-col {
     padding-left: 10px;
     padding-right: 10px;
 }
 
 .swh-coverage {
     height: calc(65px + 1em);
     padding-top: 0.3rem;
     border: none;
 }
 
 .swh-coverage a {
     text-decoration: none;
 }
 
 .swh-coverage-logo {
     display: block;
     width: 100%;
     height: 50px;
     margin-left: auto;
     margin-right: auto;
     object-fit: contain;
 
     /* polyfill for old browsers, see https://github.com/bfred-it/object-fit-images */
     font-family: 'object-fit: contain;';
 }
 
 .swh-coverage-list {
     width: 100%;
     height: 320px;
     border: none;
 }
 
 tr.swh-tr-hover-highlight:hover td {
     background: #ededed;
 }
 
 tr.swh-api-doc-route a {
     text-decoration: none;
 }
 
 .swh-apidoc .col {
     margin: 10px;
 }
 
 a.toggle-col {
     text-decoration: none;
 }
 
 a.toggle-col.col-hidden {
     text-decoration: line-through;
 }
 
 .admonition.warning {
     background: #fcf8e3;
     border: 1px solid #faebcc;
     padding: 15px;
     border-radius: 4px;
 }
 
 .admonition.warning p {
     margin-bottom: 0;
 }
 
 .admonition.warning .first {
     font-size: 1.5rem;
 }
diff --git a/swh/web/templates/includes/top-navigation.html b/swh/web/templates/includes/top-navigation.html
index 21c2bf9a..5e989b01 100644
--- a/swh/web/templates/includes/top-navigation.html
+++ b/swh/web/templates/includes/top-navigation.html
@@ -1,140 +1,140 @@
 {% comment %}
 Copyright (C) 2017-2019  The Software Heritage developers
 See the AUTHORS file at the top-level directory of this distribution
 License: GNU Affero General Public License version 3, or any later version
 See top-level LICENSE file for more information
 {% endcomment %}
 
 {% load swh_templatetags %}
 
 <div class="swh-browse-top-navigation">
   {% if snapshot_context %}
     {% if snapshot_context.branch or snapshot_context.release %}
       <div class="dropdown float-left" id="swh-branches-releases-dd">
         <button class="btn btn-block btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
           {% if snapshot_context.branch %}
             <i class="{{ swh_object_icons.branch }} fa-fw" aria-hidden="true"></i>
             Branch: <strong>{{ snapshot_context.branch }}</strong>
           {% else %}
             <i class="{{ swh_object_icons.release }} fa-fw" aria-hidden="true"></i>
             Release: <strong>{{ snapshot_context.release }}</strong>
           {% endif %}
           <span class="caret"></span>
         </button>
         <ul class="scrollable-menu dropdown-menu swh-branches-releases">
           <ul class="nav nav-tabs">
             <li class="nav-item"><a class="nav-link active swh-branches-switch" data-toggle="tab">Branches</a></li>
             <li class="nav-item"><a class="nav-link swh-releases-switch" data-toggle="tab">Releases</a></li>
           </ul>
           <div class="tab-content">
             <div class="tab-pane active" id="swh-tab-branches">
               {% for b in snapshot_context.branches %}
                 <li class="swh-branch">
                   <a href="{{ b.url | safe }}">
                     <i class="{{ swh_object_icons.branch }} fa-fw" aria-hidden="true"></i>
                     {% if b.name == snapshot_context.branch %}
                       <i class="fa fa-check fa-fw" aria-hidden="true"></i>
                     {% else %}
                       <i class="fa fa-fw" aria-hidden="true"></i>
                     {% endif %}
                     {{ b.name }}
                   </a>
                 </li>
               {% endfor %}
               {% if snapshot_context.branches|length < snapshot_context.snapshot_size.revision %}
                 <li>
                   <i class="fa fa-warning fa-fw" aria-hidden="true"></i>
                   Branches list truncated to {{ snapshot_context.branches|length }} entries,
                   {{ snapshot_context.branches|length|mul:-1|add:snapshot_context.snapshot_size.revision }}
                   were omitted.
                 </li>
               {% endif %}
             </div>
             <div class="tab-pane" id="swh-tab-releases">
               {% if snapshot_context.releases %}
                 {% for r in snapshot_context.releases %}
                   {% if r.target_type == 'revision' %}
                     <li class="swh-release">
                       <a href="{{ r.url | safe }}">
                         <i class="{{ swh_object_icons.release }} fa-fw" aria-hidden="true"></i>
                         {% if r.name == snapshot_context.release %}
                           <i class="fa fa-check fa-fw" aria-hidden="true"></i>
                         {% else %}
                           <i class="fa fa-fw" aria-hidden="true"></i>
                         {% endif %}
                         {{ r.name }}
                       </a>
                     </li>
                   {% endif %}
                 {% endfor %}
                 {% if snapshot_context.releases|length < snapshot_context.snapshot_size.release %}
                 <li>
                   <i class="fa fa-warning fa-fw" aria-hidden="true"></i>
                   Releases list truncated to {{ snapshot_context.releases|length }} entries,
                   {{ snapshot_context.releases|length|mul:-1|add:snapshot_context.snapshot_size.release }}
                   were omitted.
                 </li>
               {% endif %}
               {% else %}
                 <span>No releases to show</span>
               {% endif %}
             </div>
           </div>
         </ul>
       </div>
     {% endif %}
   {% endif %}
 
-  <div class="btn-group float-right swh-actions-dropdown">
+  <div class="btn-group float-right swh-actions-dropdown flex d-flex flex-wrap">
     {% if top_right_link %}
       <a href="{{ top_right_link.url | safe }}" class="btn btn-default btn-sm" role="button">
         {% if top_right_link.icon %}
           <i class="{{ top_right_link.icon }} fa-fw"></i>
         {% endif %}
         {{ top_right_link.text }}
       </a>
     {% endif %}
     {% if available_languages %}
       <select data-placeholder="Select Language" class="language-select chosen-select">
         <option value=""></option>
         {% for lang in available_languages %}
           <option value="{{ lang }}">{{ lang }}</option>
         {% endfor %}
       </select>
     {% endif %}
     {% if show_actions_menu %}
       <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
         <i class="fa fa-bars fa-fw" aria-hidden="true"></i>Actions
         <span class="caret"></span>
       </button>
       <ul class="dropdown-menu dropdown-menu-right swh-browse-actions-menu">
         {% if not snapshot_context or not snapshot_context.is_empty %}
           {% include "includes/vault-create-tasks.html" %}
         {% endif %}
         {% include "includes/show-metadata.html" %}
         {% include "includes/take-new-snapshot.html" %}
       </ul>
     {% endif %}
   </div>
 
   {% include "includes/breadcrumbs.html" %}
 
 </div>
 
 {% include "includes/show-swh-ids.html" %}
 
 <script>
   var snapshotContext = false;
   var branch = false;
   {% if snapshot_context %}
     snapshotContext = true;
     branch = "{{ snapshot_context.branch|escape }}";
   {% endif %}
   {% if available_languages %}
     $(".chosen-select").val("{{ language }}");
     $(".chosen-select").chosen().change(function(event, params) {
       updateLanguage(params.selected);
     });
   {% endif %}
   swh.browse.initSnapshotNavigation(snapshotContext, branch !== "None");
 </script>