Allow to go through clippy lints page without javascript

This commit is contained in:
Guillaume Gomez 2024-10-12 00:00:10 +02:00
parent f883e28e3d
commit 82969e5c4e
3 changed files with 44 additions and 26 deletions

View File

@ -143,26 +143,29 @@ Otherwise, have a great day =^.^=
</div> {# #}
</div>
{% for lint in lints %}
<article class="panel panel-default collapsed" id="{{lint.id}}"> {# #}
<header class="panel-heading" onclick="expandLint('{{lint.id}}')"> {# #}
<h2 class="panel-title"> {# #}
<div class="panel-title-name" id="lint-{{lint.id}}"> {# #}
<span>{{lint.id}}</span> {#+ #}
<a href="#{{lint.id}}" class="anchor label label-default" onclick="openLint(event)">&para;</a> {#+ #}
<a href="" class="anchor label label-default" onclick="copyToClipboard(event)"> {# #}
&#128203; {# #}
</a> {# #}
</div> {# #}
<article class="panel panel-default" id="{{lint.id}}"> {# #}
<input id="label-{{lint.id}}" type="checkbox"> {# #}
<label for="label-{{lint.id}}" onclick="highlightIfNeeded('{{lint.id}}')"> {# #}
<header class="panel-heading"> {# #}
<h2 class="panel-title"> {# #}
<div class="panel-title-name" id="lint-{{lint.id}}"> {# #}
<span>{{lint.id}}</span> {#+ #}
<a href="#{{lint.id}}" class="anchor label label-default" onclick="openLint(event)">&para;</a> {#+ #}
<a href="" class="anchor label label-default" onclick="copyToClipboard(event)"> {# #}
&#128203; {# #}
</a> {# #}
</div> {# #}
<div class="panel-title-addons"> {# #}
<span class="label label-lint-group label-default label-group-{{lint.group}}">{{lint.group}}</span> {#+ #}
<div class="panel-title-addons"> {# #}
<span class="label label-lint-group label-default label-group-{{lint.group}}">{{lint.group}}</span> {#+ #}
<span class="label label-lint-level label-lint-level-{{lint.level}}">{{lint.level}}</span> {#+ #}
<span class="label label-lint-level label-lint-level-{{lint.level}}">{{lint.level}}</span> {#+ #}
<span class="label label-doc-folding">&plus;</span> {# #}
</div> {# #}
</h2> {# #}
</header> {# #}
<span class="label label-doc-folding"></span> {# #}
</div> {# #}
</h2> {# #}
</header> {# #}
</label> {# #}
<div class="list-group lint-docs"> {# #}
<div class="list-group-item lint-doc-md">{{Self::markdown(lint.docs)}}</div> {# #}

View File

@ -138,18 +138,17 @@ function onEachLazy(lazyArray, func) {
}
}
function highlightIfNeeded(elem) {
onEachLazy(elem.querySelectorAll("pre > code.language-rust:not(.highlighted)"), el => {
function highlightIfNeeded(lintId) {
onEachLazy(document.querySelectorAll(`#${lintId} pre > code:not(.hljs)`), el => {
hljs.highlightElement(el.parentElement)
el.classList.add("highlighted");
});
}
function expandLint(lintId) {
const lintElem = document.getElementById(lintId);
const isCollapsed = lintElem.classList.toggle("collapsed");
lintElem.querySelector(".label-doc-folding").innerText = isCollapsed ? "+" : "";
highlightIfNeeded(lintElem);
const elem = document.querySelector(`#${lintId} > input[type="checkbox"]`);
elem.checked = true;
highlightIfNeeded(lintId);
}
// Show details for one lint

View File

@ -309,12 +309,12 @@ L4.75,12h2.5l0.5393066-2.1572876 c0.2276001-0.1062012,0.4459839-0.2269287,0.649
.page-header {
border-color: var(--theme-popup-border);
}
.panel-default > .panel-heading {
.panel-default .panel-heading {
background: var(--theme-hover);
color: var(--fg);
border: 1px solid var(--theme-popup-border);
}
.panel-default > .panel-heading:hover {
.panel-default .panel-heading:hover {
filter: brightness(90%);
}
.list-group-item {
@ -410,9 +410,25 @@ body {
color: var(--fg);
}
article.collapsed .lint-docs {
article > label {
width: 100%;
margin: 0;
}
article > input[type="checkbox"] {
display: none;
}
article > input[type="checkbox"] + label .label-doc-folding::before {
content: "+";
}
article > input[type="checkbox"]:checked + label .label-doc-folding::before {
content: "";
}
.lint-docs {
display: none;
}
article > input[type="checkbox"]:checked ~ .lint-docs {
display: block;
}
.github-corner svg {
fill: var(--fg);