diff --git a/cypress/integration/origin-search.spec.js b/cypress/integration/origin-search.spec.js
--- a/cypress/integration/origin-search.spec.js
+++ b/cypress/integration/origin-search.spec.js
@@ -77,11 +77,11 @@
// Check all three checkboxes and check if
// correct url params are added
cy.get('#swh-search-origins-with-visit')
- .check()
+ .check({force: true})
.get('#swh-filter-empty-visits')
- .check()
+ .check({force: true})
.get('#swh-search-origin-metadata')
- .check()
+ .check({force: true})
.then(() => {
const searchText = origin.url;
doSearch(searchText);
@@ -128,9 +128,9 @@
it('should not paginate if there are not many results', function() {
// Setup search
cy.get('#swh-search-origins-with-visit')
- .uncheck()
+ .uncheck({force: true})
.get('#swh-filter-empty-visits')
- .uncheck()
+ .uncheck({force: true})
.then(() => {
const searchText = 'libtess';
@@ -154,9 +154,9 @@
stubOriginVisitLatestRequests();
// Setup search
cy.get('#swh-search-origins-with-visit')
- .uncheck()
+ .uncheck({force: true})
.get('#swh-filter-empty-visits')
- .uncheck()
+ .uncheck({force: true})
.then(() => {
const searchText = 'many.origins';
@@ -219,9 +219,9 @@
stubOriginVisitLatestRequests();
// Setup search
cy.get('#swh-search-origins-with-visit')
- .uncheck()
+ .uncheck({force: true})
.get('#swh-filter-empty-visits')
- .uncheck()
+ .uncheck({force: true})
.then(() => {
const searchText = 'many.origins';
@@ -268,9 +268,9 @@
stubOriginVisitLatestRequests();
// Setup search
cy.get('#swh-search-origins-with-visit')
- .uncheck()
+ .uncheck({force: true})
.get('#swh-filter-empty-visits')
- .uncheck()
+ .uncheck({force: true})
.then(() => {
const searchText = 'many.origins';
diff --git a/cypress/integration/persistent-identifiers.spec.js b/cypress/integration/persistent-identifiers.spec.js
--- a/cypress/integration/persistent-identifiers.spec.js
+++ b/cypress/integration/persistent-identifiers.spec.js
@@ -137,14 +137,14 @@
.contains(td.objectPids[0])
.should('have.attr', 'href', this.Urls.browse_swh_id(td.objectPids[0]));
- cy.get(`#swh-id-tab-${td.objectType} .swh-id-context-option`)
+ cy.get(`#swh-id-tab-${td.objectType} .swh-id-option`)
.click();
cy.get(`#swh-id-tab-${td.objectType} .swh-id`)
.contains(td.objectPids[1])
.should('have.attr', 'href', this.Urls.browse_swh_id(td.objectPids[1]));
- cy.get(`#swh-id-tab-${td.objectType} .swh-id-context-option`)
+ cy.get(`#swh-id-tab-${td.objectType} .swh-id-option`)
.click();
cy.get(`#swh-id-tab-${td.objectType} .swh-id`)
diff --git a/cypress/integration/vault.spec.js b/cypress/integration/vault.spec.js
--- a/cypress/integration/vault.spec.js
+++ b/cypress/integration/vault.spec.js
@@ -325,7 +325,7 @@
cy.get(`#vault-task-${this.revision}`)
.find('input[type="checkbox"]')
- .click();
+ .click({force: true});
cy.contains('button', 'Remove selected tasks')
.click();
diff --git a/swh/web/assets/config/bootstrap-pre-customize.scss b/swh/web/assets/config/bootstrap-pre-customize.scss
--- a/swh/web/assets/config/bootstrap-pre-customize.scss
+++ b/swh/web/assets/config/bootstrap-pre-customize.scss
@@ -8,6 +8,7 @@
// override some global bootstrap sass variables before generating stylesheets
// global text colors and fonts
+$primary: #e20026;
$body-color: rgba(0, 0, 0, 0.55);
$font-family-sans-serif: "Alegreya Sans", sans-serif !important;
$link-color: rgba(0, 0, 0, 0.75);
diff --git a/swh/web/assets/src/bundles/vault/vault-ui.js b/swh/web/assets/src/bundles/vault/vault-ui.js
--- a/swh/web/assets/src/bundles/vault/vault-ui.js
+++ b/swh/web/assets/src/bundles/vault/vault-ui.js
@@ -175,8 +175,10 @@
tableRow = `<tr id="vault-task-${cookingTask.object_id}" title="Once downloaded, the git repository can be imported with the ` +
`following commands:\n\n$ git init\n$ zcat ${cookingTask.object_id}.gitfast.gz | git fast-import">`;
}
- tableRow += '<td><input type="checkbox" class="vault-task-toggle-selection"/></td>';
- tableRow += `<td style="width: 120px"><i class="${swh.webapp.getSwhObjectIcon(cookingTask.object_type)} mdi-fw" aria-hidden="true"></i>${cookingTask.object_type}</td>`;
+ tableRow += '<td><div class="custom-control custom-checkbox">';
+ tableRow += `<input type="checkbox" class="custom-control-input vault-task-toggle-selection" id="vault-task-toggle-selection-${cookingTask.object_id}"/>`;
+ tableRow += `<label class="custom-control-label" for="vault-task-toggle-selection-${cookingTask.object_id}"></label></td>`;
+ tableRow += `<td style="width: 120px"><i class="${swh.webapp.getSwhObjectIcon(cookingTask.object_type)} mdi-fw"></i>${cookingTask.object_type}</td>`;
tableRow += `<td class="vault-object-id" data-object-id="${cookingTask.object_id}"><a href="${browseUrl}">${cookingTask.object_id}</a></td>`;
tableRow += `<td style="width: 350px">${progressBar.outerHTML}</td>`;
let downloadLink = downloadLinkWait;
diff --git a/swh/web/templates/browse/browse.html b/swh/web/templates/browse/browse.html
--- a/swh/web/templates/browse/browse.html
+++ b/swh/web/templates/browse/browse.html
@@ -12,6 +12,7 @@
{% block title %}{{ heading }} – Software Heritage archive{% endblock %}
{% block navbar-content %}
+
{% if snapshot_context %}
<h4>
<i class="{{ swh_object_icons|key_value:swh_object_name.lower }} mdi-fw" aria-hidden="true"></i>
@@ -42,6 +43,7 @@
</a>
</h4>
{% endif %}
+
{% endblock %}
{% block browse-content %}
diff --git a/swh/web/templates/browse/origin-visits.html b/swh/web/templates/browse/origin-visits.html
--- a/swh/web/templates/browse/origin-visits.html
+++ b/swh/web/templates/browse/origin-visits.html
@@ -41,23 +41,26 @@
<h4>History</h4>
-<div class="text-center">
- <div class="form-check-inline">
- <label class="form-check-label active" onclick="swh.origin.showFullVisitsDifferentSnapshots(event)">
- <input type="radio" class="form-check-input" name="optradio" checked>Show full visits with different snapshots
+<form class="text-center">
+ <div class="custom-control custom-radio custom-control-inline">
+ <input class="custom-control-input" type="radio" id="swh-different-snapshot-visits" name="swh-visits" value="option1" checked>
+ <label class="custom-control-label font-weight-normal" for="swh-different-snapshot-visits" onclick="swh.origin.showFullVisitsDifferentSnapshots(event)">
+ Show full visits with different snapshots
</label>
</div>
- <div class="form-check-inline">
- <label class="form-check-label" onclick="swh.origin.showFullVisits(event)">
- <input type="radio" class="form-check-input" name="optradio">Show all full visits
+ <div class="custom-control custom-radio custom-control-inline">
+ <input class="custom-control-input" type="radio" id="swh-full-visits" name="swh-visits" value="option2">
+ <label class="custom-control-label font-weight-normal" for="swh-full-visits" onclick="swh.origin.showFullVisits(event)">
+ Show all full visits
</label>
</div>
- <div class="form-check-inline disabled">
- <label class="form-check-label" onclick="swh.origin.showAllVisits(event)">
- <input type="radio" class="form-check-input" name="optradio">Show all visits
+ <div class="custom-control custom-radio custom-control-inline">
+ <input class="custom-control-input" type="radio" id="swh-all-visits" name="swh-visits" value="option3">
+ <label class="custom-control-label font-weight-normal" for="swh-all-visits" onclick="swh.origin.showAllVisits(event)">
+ Show all visits
</label>
</div>
-</div>
+</form>
<h5>Calendar</h5>
diff --git a/swh/web/templates/browse/revision-log.html b/swh/web/templates/browse/revision-log.html
--- a/swh/web/templates/browse/revision-log.html
+++ b/swh/web/templates/browse/revision-log.html
@@ -26,29 +26,29 @@
<hr class="mt-0 mb-0">
- <div class="text-center">
+ <form class="text-center">
sort by:
- <div class="form-check form-check-inline" title="reverse chronological order">
- <input class="form-check-input" type="radio" name="revs-ordering" id="revs-ordering-date"
+ <div class="custom-control custom-radio custom-control-inline" title="reverse chronological order">
+ <input class="custom-control-input" type="radio" name="revs-ordering" id="revs-ordering-date"
value="" onclick="swh.revision.revsOrderingTypeClicked(event)" checked>
- <label class="form-check-label active" for="revs-ordering-date">revision date</label>
+ <label class="custom-control-label font-weight-normal" for="revs-ordering-date">revision date</label>
</div>
- <div class="form-check form-check-inline" title="pre-order, depth-first visit on the revision graph">
- <input class="form-check-input" type="radio" name="revs-ordering" id="revs-ordering-dfs"
+ <div class="custom-control custom-radio custom-control-inline" title="pre-order, depth-first visit on the revision graph">
+ <input class="custom-control-input" type="radio" name="revs-ordering" id="revs-ordering-dfs"
value="dfs" onclick="swh.revision.revsOrderingTypeClicked(event)">
- <label class="form-check-label" for="revs-ordering-dfs">DFS</label>
+ <label class="custom-control-label font-weight-normal" for="revs-ordering-dfs">DFS</label>
</div>
- <div class="form-check form-check-inline" title="post-order, depth-first visit on the revision graph">
- <input class="form-check-input" type="radio" name="revs-ordering" id="revs-ordering-dfs-post"
+ <div class="custom-control custom-radio custom-control-inline" title="post-order, depth-first visit on the revision graph">
+ <input class="custom-control-input" type="radio" name="revs-ordering" id="revs-ordering-dfs-post"
value="dfs_post" onclick="swh.revision.revsOrderingTypeClicked(event)">
- <label class="form-check-label" for="revs-ordering-dfs-post">DFS post-ordering</label>
+ <label class="custom-control-label font-weight-normal" for="revs-ordering-dfs-post">DFS post-ordering</label>
</div>
- <div class="form-check form-check-inline" title="breadth-first visit on the revision graph">
- <input class="form-check-input" type="radio" name="revs-ordering" id="revs-ordering-bfs"
+ <div class="custom-control custom-radio custom-control-inline" title="breadth-first visit on the revision graph">
+ <input class="custom-control-input" type="radio" name="revs-ordering" id="revs-ordering-bfs"
value="bfs" onclick="swh.revision.revsOrderingTypeClicked(event)">
- <label class="form-check-label" for="revs-ordering-bfs">BFS</label>
+ <label class="custom-control-label font-weight-normal" for="revs-ordering-bfs">BFS</label>
</div>
- </div>
+ </form>
<div class="table-responsive mb-3">
<table class="table swh-table swh-table-striped">
diff --git a/swh/web/templates/browse/search.html b/swh/web/templates/browse/search.html
--- a/swh/web/templates/browse/search.html
+++ b/swh/web/templates/browse/search.html
@@ -19,23 +19,29 @@
<div class="input-group">
<input class="form-control" placeholder="Enter a persistent id to resolve or string pattern(s) to search for in origin urls" type="text" id="origins-url-patterns"/>
<div class="input-group-append">
- <button class="btn btn-default" type="submit"><i class="swh-search-icon mdi mdi-24px mdi-magnify" aria-hidden="true"></i></button>
+ <button class="btn btn-primary" type="submit"><i class="swh-search-icon mdi mdi-24px mdi-magnify" aria-hidden="true"></i></button>
</div>
</div>
- <div class="form-check swh-id-option">
- <input class="form-check-input" value="option-origins-with-visit" type="checkbox"
+ <div class="custom-control custom-checkbox swh-id-option">
+ <input class="custom-control-input" value="option-origins-with-visit" type="checkbox"
id="swh-search-origins-with-visit" checked>
- <label class="form-check-label" for="swh-search-origins-with-visit">only show origins visited at least once</label>
+ <label class="custom-control-label font-weight-normal" for="swh-search-origins-with-visit">
+ only show origins visited at least once
+ </label>
</div>
- <div class="form-check swh-id-option">
- <input class="form-check-input" value="option-filter-empty-visits" type="checkbox"
+ <div class="custom-control custom-checkbox swh-id-option">
+ <input class="custom-control-input" value="option-filter-empty-visits" type="checkbox"
id="swh-filter-empty-visits" checked>
- <label class="form-check-label" for="swh-filter-empty-visits">filter out origins with no archived content</label>
+ <label class="custom-control-label font-weight-normal" for="swh-filter-empty-visits">
+ filter out origins with no archived content
+ </label>
</div>
- <div class="form-check swh-id-option">
- <input class="form-check-input" value="option-filter-empty-visits" type="checkbox"
+ <div class="custom-control custom-checkbox swh-id-option">
+ <input class="custom-control-input" value="option-filter-empty-visits" type="checkbox"
id="swh-search-origin-metadata">
- <label class="form-check-label" for="swh-search-origin-metadata">search in metadata (instead of URL)</label>
+ <label class="custom-control-label font-weight-normal" for="swh-search-origin-metadata">
+ search in metadata (instead of URL)
+ </label>
</div>
</form>
<hr>
diff --git a/swh/web/templates/browse/vault-ui.html b/swh/web/templates/browse/vault-ui.html
--- a/swh/web/templates/browse/vault-ui.html
+++ b/swh/web/templates/browse/vault-ui.html
@@ -27,7 +27,12 @@
<table class="table swh-table swh-table-striped swh-vault-table" id="vault-cooking-tasks">
<thead>
<tr>
- <th><input type="checkbox" id="vault-tasks-toggle-selection"/></th>
+ <th>
+ <div class="custom-control custom-checkbox">
+ <input type="checkbox" class="custom-control-input" id="vault-tasks-toggle-selection">
+ <label class="custom-control-label" for="vault-tasks-toggle-selection"></label>
+ </div>
+ </th>
<th style="width: 100px">Object type</th>
<th>Object id</th>
<th style="width: 350px">Cooking status</th>
diff --git a/swh/web/templates/includes/custom-checkbox.html b/swh/web/templates/includes/custom-checkbox.html
new file mode 100644
--- /dev/null
+++ b/swh/web/templates/includes/custom-checkbox.html
@@ -0,0 +1,11 @@
+{% 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 %}
+
+<div class="custom-control custom-checkbox {{ extra_classes}}">
+ <input class="custom-control-input" type="checkbox" id="{{id }}" {{ extra_attrs }} {% if checked %}checked{% endif %}>
+ <label class="custom-control-label font-weight-normal" for="{{ id }}">{{ label }}</label>
+</div>
\ No newline at end of file
diff --git a/swh/web/templates/includes/show-swh-ids.html b/swh/web/templates/includes/show-swh-ids.html
--- a/swh/web/templates/includes/show-swh-ids.html
+++ b/swh/web/templates/includes/show-swh-ids.html
@@ -66,12 +66,12 @@
{% if swhid_info.swhid_with_context is not None %}
<div class="float-left">
<form id="swh-id-options">
- <div class="form-check swh-id-option">
- <input class="form-check-input swh-id-context-option" value="option-origin" type="checkbox"
+ <div class="custom-control custom-checkbox swh-id-option">
+ <input class="custom-control-input swh-id-context-option" value="option-origin" type="checkbox"
id="swh-id-context-option-{{ swhid_info.object_type }}"
data-swhid-with-context="{{ swhid_info.swhid_with_context }}"
onclick="swh.browse.swhIdContextOptionToggled(event)">
- <label class="form-check-label" for="swh-id-context-option-{{ swhid_info.object_type }}">Add contextual information</label>
+ <label class="custom-control-label font-weight-normal" for="swh-id-context-option-{{ swhid_info.object_type }}">Add contextual information</label>
</div>
</form>
</div>