From 45a8070203cb7d2f0b43ec0123b111639bde2fef Mon Sep 17 00:00:00 2001
From: Guillaume Gomez <guillaume1.gomez@gmail.com>
Date: Fri, 11 Jul 2025 11:59:28 +0200
Subject: [PATCH 1/2] Fix CSS indent

---
 util/gh-pages/style.css | 24 ++++++++++++------------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/util/gh-pages/style.css b/util/gh-pages/style.css
index 66abf4598b0e..ffe88ea71a5a 100644
--- a/util/gh-pages/style.css
+++ b/util/gh-pages/style.css
@@ -31,11 +31,11 @@ blockquote { font-size: 1em; }
 }
 
 .container > * {
-  margin-bottom: 20px;
-  border-radius: 4px;
-  background: var(--bg);
-  border: 1px solid var(--theme-popup-border);
-  box-shadow: 0 1px 1px rgba(0,0,0,.05);
+    margin-bottom: 20px;
+    border-radius: 4px;
+    background: var(--bg);
+    border: 1px solid var(--theme-popup-border);
+    box-shadow: 0 1px 1px rgba(0,0,0,.05);
 }
 
 div.panel-body button {
@@ -307,13 +307,13 @@ L4.75,12h2.5l0.5393066-2.1572876  c0.2276001-0.1062012,0.4459839-0.2269287,0.649
 -0.3701782l2.1323853,0.6099854l1.25-2.1650391L10.2133789,6.362915  C10.2238159,6.241333,\
 10.25,6.1243286,10.25,6z M6,7.5C5.1715698,7.5,4.5,6.8284302,4.5,6S5.1715698,4.5,6,4.5S7.5\
 ,5.1715698,7.5,6  S6.8284302,7.5,6,7.5z" fill="black"/></svg>');
-  width: 18px;
-  height: 18px;
-  display: block;
-  filter: invert(0.7);
-  position: absolute;
-  top: 4px;
-  left: 5px;
+    width: 18px;
+    height: 18px;
+    display: block;
+    filter: invert(0.7);
+    position: absolute;
+    top: 4px;
+    left: 5px;
 }
 
 .settings-menu * {

From 778dcfbade0db770374fbca55ade29cd8c57fdb1 Mon Sep 17 00:00:00 2001
From: Guillaume Gomez <guillaume1.gomez@gmail.com>
Date: Fri, 11 Jul 2025 15:33:18 +0200
Subject: [PATCH 2/2] Remove CSS bootstrap dependency

---
 util/gh-pages/index_template.html |  35 ++--
 util/gh-pages/style.css           | 327 ++++++++++++++++++++++++++----
 2 files changed, 307 insertions(+), 55 deletions(-)

diff --git a/util/gh-pages/index_template.html b/util/gh-pages/index_template.html
index 06646f8a8922..826d934f8dee 100644
--- a/util/gh-pages/index_template.html
+++ b/util/gh-pages/index_template.html
@@ -14,7 +14,6 @@
 
     <title>Clippy Lints</title> {# #}
 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css"/> {# #}
     <link id="githubLightHighlight" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/github.min.css" disabled="true" /> {# #}
     <link id="githubDarkHighlight" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/github-dark.min.css" disabled="true" /> {# #}
 
@@ -59,9 +58,9 @@ <h1 class="page-header">Clippy Lints <span id="lint-count" class="badge"></span>
 
         <div id="menu-filters"> {# #}
             <div class="panel-body row"> {# #}
-                <div id="upper-filters" class="col-12 col-md-5"> {# #}
-                    <div class="btn-group" id="lint-levels" tabindex="-1"> {# #}
-                        <button type="button" class="btn btn-default dropdown-toggle"> {# #}
+                <div id="upper-filters"> {# #}
+                    <div id="lint-levels" tabindex="-1"> {# #}
+                        <button type="button" class="btn-default dropdown-toggle"> {# #}
                             Lint levels <span class="badge">4</span> <span class="caret"></span> {# #}
                         </button> {# #}
                         <ul class="dropdown-menu" id="lint-levels-selector"> {# #}
@@ -74,8 +73,8 @@ <h1 class="page-header">Clippy Lints <span id="lint-count" class="badge"></span>
                             <li role="separator" class="divider"></li> {# #}
                         </ul> {# #}
                     </div> {# #}
-                    <div class="btn-group" id="lint-groups" tabindex="-1"> {# #}
-                        <button type="button" class="btn btn-default dropdown-toggle"> {# #}
+                    <div id="lint-groups" tabindex="-1"> {# #}
+                        <button type="button" class="btn-default dropdown-toggle"> {# #}
                             Lint groups <span class="badge">9</span> <span class="caret"></span> {# #}
                         </button> {# #}
                         <ul class="dropdown-menu" id="lint-groups-selector"> {# #}
@@ -91,8 +90,8 @@ <h1 class="page-header">Clippy Lints <span id="lint-count" class="badge"></span>
                             <li role="separator" class="divider"></li> {# #}
                         </ul> {# #}
                     </div> {# #}
-                    <div class="btn-group" id="version-filter" tabindex="-1"> {# #}
-                        <button type="button" class="btn btn-default dropdown-toggle"> {# #}
+                    <div id="version-filter" tabindex="-1"> {# #}
+                        <button type="button" class="btn-default dropdown-toggle"> {# #}
                             Version {#+ #}
                             <span id="version-filter-count" class="badge">0</span> {#+ #}
                             <span class="caret"></span> {# #}
@@ -104,8 +103,8 @@ <h1 class="page-header">Clippy Lints <span id="lint-count" class="badge"></span>
                             <li role="separator" class="divider"></li> {# #}
                         </ul> {# #}
                     </div> {# #}
-                    <div class="btn-group" id="lint-applicabilities" tabindex="-1"> {# #}
-                        <button type="button" class="btn btn-default dropdown-toggle"> {# #}
+                    <div id="lint-applicabilities" tabindex="-1"> {# #}
+                        <button type="button" class="btn-default dropdown-toggle"> {# #}
                             Applicability {#+ #}
                             <span class="badge">4</span> {#+ #}
                             <span class="caret"></span> {# #}
@@ -121,22 +120,20 @@ <h1 class="page-header">Clippy Lints <span id="lint-count" class="badge"></span>
                         </ul> {# #}
                     </div> {# #}
                 </div> {# #}
-                <div class="col-12 col-md-5 search-control"> {# #}
+                <div class="search-control"> {# #}
                     <div class="input-group"> {# #}
                         <label class="input-group-addon" id="filter-label" for="search-input">Filter:</label> {# #}
                         <input type="text" class="form-control filter-input" placeholder="Keywords or search string (`S` or `/` to focus)" id="search-input" /> {# #}
-                        <span class="input-group-btn"> {# #}
-                            <button class="filter-clear btn" type="button" onclick="searchState.clearInput(event)"> {# #}
-                                Clear {# #}
-                            </button> {# #}
-                        </span> {# #}
+                        <button class="filter-clear" type="button" onclick="searchState.clearInput(event)"> {# #}
+                            Clear {# #}
+                        </button> {# #}
                     </div> {# #}
                 </div> {# #}
-                <div class="col-12 col-md-2 btn-group expansion-group"> {# #}
-                    <button title="Collapse All" class="btn btn-default expansion-control" type="button" id="collapse-all"> {# #}
+                <div class="btn-group expansion-group"> {# #}
+                    <button title="Collapse All" class="btn-default expansion-control" type="button" id="collapse-all"> {# #}
                         <span class="glyphicon glyphicon-collapse-up"></span> {# #}
                     </button> {# #}
-                    <button title="Expand All" class="btn btn-default expansion-control" type="button" id="expand-all"> {# #}
+                    <button title="Expand All" class="btn-default expansion-control" type="button" id="expand-all"> {# #}
                         <span class="glyphicon glyphicon-collapse-down"></span> {# #}
                     </button> {# #}
                 </div> {# #}
diff --git a/util/gh-pages/style.css b/util/gh-pages/style.css
index ffe88ea71a5a..957a3260df4c 100644
--- a/util/gh-pages/style.css
+++ b/util/gh-pages/style.css
@@ -1,13 +1,60 @@
+* {
+    box-sizing: border-box;
+}
+
 blockquote { font-size: 1em; }
 
+h1, h2, h3, h4, h5, h6 {
+    font-family: inherit;
+    font-weight: 500;
+    line-height: 1.1;
+    color: inherit;
+}
+h1 {
+    font-size: 36px;
+}
+
+button {
+    cursor: pointer;
+    margin: 0;
+    font-family: inherit;
+    font-size: inherit;
+    line-height: inherit;
+}
+
+label {
+    display: inline-block;
+    max-width: 100%;
+}
+
 .dropdown-menu {
     color: var(--fg);
     background: var(--theme-popup-bg);
     border: 1px solid var(--theme-popup-border);
+    border-radius: 4px;
+    position: absolute;
+    top: 100%;
+    left: 0;
+    z-index: 1000;
+    display: none;
+    float: left;
+    min-width: 160px;
+    padding: 5px 0;
+    margin: 2px 0 0;
+    font-size: 14px;
+    text-align: left;
+    list-style: none;
+    box-shadow: 0 6px 12px rgba(0,0,0,.175);
+}
+.open > .dropdown-menu {
+  display: block;
 }
 
 .dropdown-menu .divider {
     background-color: var(--theme-popup-border);
+    height: 1px;
+    margin: 9px 0;
+    overflow: hidden;
 }
 
 .dropdown-menu .checkbox {
@@ -30,6 +77,27 @@ blockquote { font-size: 1em; }
     background-color: var(--theme-hover);
 }
 
+.checkbox label {
+    min-height: 20px;
+    margin-bottom: 0;
+    font-weight: 400;
+    cursor: pointer;
+}
+
+.text-capitalize {
+    text-transform: capitalize;
+}
+
+.container {
+    padding-right: 15px;
+    padding-left: 15px;
+    margin-right: auto;
+    margin-left: auto;
+}
+.container::before {
+    display: table;
+    content: " ";
+}
 .container > * {
     margin-bottom: 20px;
     border-radius: 4px;
@@ -38,9 +106,18 @@ blockquote { font-size: 1em; }
     box-shadow: 0 1px 1px rgba(0,0,0,.05);
 }
 
+div.panel-body {
+    padding: 15px;
+}
+div.panel-body::before, div.panel-body::after {
+    display: table;
+    content: " ";
+}
+div.panel-body::after {
+    clear: both;
+}
 div.panel-body button {
     background: var(--searchbar-bg);
-    color: var(--searchbar-fg);
     border-color: var(--theme-popup-border);
 }
 
@@ -52,9 +129,79 @@ div.panel-body  button.open {
     filter: brightness(90%);
 }
 
-.dropdown-toggle .badge {
+.row {
+    margin-right: -15px;
+    margin-left: -15px;
+}
+
+#upper-filters {
+    position: relative;
+    min-height: 1px;
+    padding-right: 15px;
+    padding-left: 15px;
+}
+
+#upper-filters > * {
+    position: relative;
+}
+
+.btn-group {
+    position: relative;
+    display: inline-block;
+}
+button {
+    display: inline-block;
+    padding: 6px 12px;
+    margin-bottom: 0;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 1.42857143;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: middle;
+    touch-action: manipulation;
+    cursor: pointer;
+    user-select: none;
+    border: 1px solid transparent;
+    border-radius: 4px;
+}
+button:hover {
+    text-decoration: none;
+}
+.badge {
+    color: #fff;
+    position: relative;
+    top: -1px;
+    display: inline-block;
+    min-width: 10px;
+    padding: 3px 7px;
+    font-size: 12px;
+    font-weight: 700;
+    line-height: 1;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: middle;
+    border-radius: 10px;
     background-color: #777;
 }
+.btn-default:hover {
+    color: #333;
+    background-color: #e6e6e6;
+    border-color: #adadad;
+}
+.btn-default .badge {
+    color: #fff;
+}
+button .caret {
+    display: inline-block;
+    width: 0;
+    height: 0;
+    margin-left: 0;
+    vertical-align: middle;
+    border-top: 4px dashed;
+    border-right: 4px solid transparent;
+    border-left: 4px solid transparent;
+}
 
 .lint-title {
     cursor: pointer;
@@ -81,12 +228,89 @@ article:hover .panel-title-name .anchor { display: inline;}
 
 .search-control {
     margin-top: 15px;
+    position: relative;
+    min-height: 1px;
+    padding-right: 15px;
+    padding-left: 15px;
 }
 
-@media (min-width: 992px) {
-    .search-control {
-        margin-top: 0;
-    }
+.input-group {
+    position: relative;
+    display: flex;
+}
+.input-group > :last-child {
+    border-left: 0;
+}
+.input-group > :first-child, .btn-group > :first-child {
+    border-right: 0;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+}
+.input-group > :last-child, .btn-group > :last-child {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+}
+.input-group .form-control:not(:first-child):not(:last-child) {
+    border-radius: 0;
+}
+.form-control:focus {
+    border-color: #66afe9;
+    outline: 0;
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
+}
+.input-group-addon {
+    padding: 6px 12px;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 1;
+    text-align: center;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    white-space: nowrap;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.glyphicon.glyphicon-collapse-up::before, .glyphicon.glyphicon-collapse-down::before {
+    --background-img-size: 14px;
+    background-repeat: no-repeat;
+    background-size: var(--background-img-size);
+    height: calc(var(--background-img-size) + 6px);
+    display: block;
+    background-position: 50%;
+    content: "";
+}
+.glyphicon.glyphicon-collapse-up::before {
+    /* Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License -
+       https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. */
+    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 \
+        448 512"><path d="M64 80c-8.8 0-16 7.2-16 16l0 320c0 8.8 7.2 16 16 16l320 0c8.8 0 16-7.2 \
+        16-16l0-320c0-8.8-7.2-16-16-16L64 80zM0 96C0 60.7 28.7 32 64 32l320 0c35.3 0 64 28.7 64 \
+        64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96zm224 64c6.7 0 13 2.8 17.6 \
+        7.7l104 112c6.5 7 8.2 17.2 4.4 25.9s-12.5 14.4-22 14.4l-208 0c-9.5 0-18.2-5.7-22-14.4s-2.\
+        1-18.9 4.4-25.9l104-112c4.5-4.9 10.9-7.7 17.6-7.7z"/></svg>');
+}
+.glyphicon.glyphicon-collapse-down::before {
+    /* Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License -
+       https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. */
+    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" \
+        viewBox="0 0 448 512"><path d="M384 432c8.8 0 16-7.2 16-16l0-320c0-8.8-7.2-16-16-16L64 \
+        80c-8.8 0-16 7.2-16 16l0 320c0 8.8 7.2 16 16 16l320 0zm64-16c0 35.3-28.7 64-64 64L64 \
+        480c-35.3 0-64-28.7-64-64L0 96C0 60.7 28.7 32 64 32l320 0c35.3 0 64 28.7 64 64l0 320zM224 \
+        352c-6.7 0-13-2.8-17.6-7.7l-104-112c-6.5-7-8.2-17.2-4.4-25.9s12.5-14.4 22-14.4l208 0c9.5 0 \
+        18.2 5.7 22 14.4s2.1 18.9-4.4 25.9l-104 112c-4.5 4.9-10.9 7.7-17.6 7.7z"/></svg>');
+}
+
+.expansion-group {
+    margin-top: 15px;
+    padding: 0px 8px;
+    display: flex;
+    flex-wrap: nowrap;
+}
+
+.expansion-control {
+    width: 50%;
 }
 
 @media (min-width: 405px) {
@@ -96,6 +320,38 @@ article:hover .panel-title-name .anchor { display: inline;}
     }
 }
 
+@media (min-width: 768px) {
+    .container {
+        width: 750px;
+    }
+}
+
+@media (min-width: 992px) {
+    .search-control {
+        margin-top: 0;
+    }
+    .container {
+        width: 970px;
+    }
+    #upper-filters, .search-control, .expansion-group {
+        float: left;
+    }
+    #upper-filters, .search-control {
+        width: 41.66666667%;
+    }
+    .expansion-group {
+        margin-top: 0;
+        padding: 0px 15px;
+        width: 16.66666667%;
+    }
+}
+
+@media (min-width: 1200px) {
+    .container {
+        width: 1170px;
+    }
+}
+
 @media (max-width: 430px) {
     /* Turn the version filter list to the left */
     #version-filter-selector {
@@ -113,8 +369,20 @@ article:hover .panel-title-name .anchor { display: inline;}
 }
 
 .label {
-    padding-top: 0.3em;
-    padding-bottom: 0.3em;
+    padding: 0.3em 0.6em;
+    font-size: 75%;
+    font-weight: 700;
+    line-height: 1;
+    color: #fff;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: baseline;
+    border-radius: .25em;
+    text-decoration: none;
+}
+
+.label-default {
+    background-color: #777;
 }
 
 .lint-level {
@@ -207,11 +475,6 @@ article:hover .panel-title-name .anchor { display: inline;}
     font-family: monospace;
 }
 
-details {
-    border-radius: 4px;
-    padding: .5em .5em 0;
-}
-
 pre {
     padding: 0;
 }
@@ -223,10 +486,6 @@ summary {
     display: revert;
 }
 
-details[open] {
-    padding: .5em;
-}
-
 /* Expanding the mdBook theme*/
 .light, body:not([class]) {
     --inline-code-bg: #f6f7f6;
@@ -350,6 +609,7 @@ L4.75,12h2.5l0.5393066-2.1572876  c0.2276001-0.1062012,0.4459839-0.2269287,0.649
     border-bottom: 1px solid var(--theme-popup-border);
     padding-bottom: 19px;
     border-radius: 0;
+    margin: 40px 0 20px;
 }
 pre, hr {
     background: var(--bg);
@@ -401,7 +661,16 @@ ul.dropdown-menu li.checkbox > button:hover {
 .filter-input {
     background: var(--searchbar-bg);
     color: var(--searchbar-fg);
-    border-color: var(--theme-popup-border);
+    position: relative;
+    width: 100%;
+    margin-bottom: 0;
+    height: 34px;
+    padding: 6px 12px;
+    font-size: 14px;
+    line-height: 1.42857143;
+    border: 1px solid var(--theme-popup-border);
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
 }
 
 .filter-input::-webkit-input-placeholder,
@@ -410,24 +679,6 @@ ul.dropdown-menu li.checkbox > button:hover {
     opacity: 30%;
 }
 
-.expansion-group {
-    margin-top: 15px;
-    padding: 0px 8px;
-    display: flex;
-    flex-wrap: nowrap;
-}
-
-@media (min-width: 992px) {
-    .expansion-group {
-        margin-top: 0;
-        padding: 0px 15px;
-    }
-}
-
-.expansion-control {
-    width: 50%;
-}
-
 :not(pre) > code {
     color: var(--inline-code-color);
     background-color: var(--inline-code-bg);
@@ -438,6 +689,10 @@ html {
 body {
     background: var(--bg);
     color: var(--fg);
+    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
+    font-size: 14px;
+    line-height: 1.42857143;
+    margin: 0;
 }
 
 article > label {