git: f73e67f250 - main - Website: Draw the menu bars with CSS instead the font-awesome icons

From: Sergio Carlavilla Delgado <carlavilla_at_FreeBSD.org>
Date: Fri, 15 May 2026 20:21:39 UTC
The branch main has been updated by carlavilla:

URL: https://cgit.FreeBSD.org/doc/commit/?id=f73e67f250331dde3ebc74cc02b4a98d661eed96

commit f73e67f250331dde3ebc74cc02b4a98d661eed96
Author:     Sergio Carlavilla Delgado <carlavilla@FreeBSD.org>
AuthorDate: 2026-05-15 20:20:06 +0000
Commit:     Sergio Carlavilla Delgado <carlavilla@FreeBSD.org>
CommitDate: 2026-05-15 20:20:06 +0000

    Website: Draw the menu bars with CSS instead the font-awesome icons
---
 website/themes/beastie/assets/styles/main.css           | 17 ++++++++++++++++-
 .../themes/beastie/layouts/_partials/site-header.html   |  2 +-
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/website/themes/beastie/assets/styles/main.css b/website/themes/beastie/assets/styles/main.css
index cf5f78a012..0385c2f2e7 100644
--- a/website/themes/beastie/assets/styles/main.css
+++ b/website/themes/beastie/assets/styles/main.css
@@ -450,9 +450,24 @@ header ul li {
 
 .menu-bars {
   display: none;
+  width: 2rem;
+  height: 2rem;
   margin-left: auto;
   color: var(--white);
   cursor: pointer;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+}
+
+.menu-bars::before {
+  content: "";
+  display: block;
+  width: 1.5rem;
+  height: 2px;
+  background-color: currentColor;
+  border-radius: 999px;
+  box-shadow: 0 -7px 0 currentColor, 0 7px 0 currentColor;
 }
 
 input[type='checkbox'] {
@@ -665,7 +680,7 @@ input[type='checkbox'] {
   }
 
   .menu-bars {
-    display: block;
+    display: flex;
   }
 
   .menu {
diff --git a/website/themes/beastie/layouts/_partials/site-header.html b/website/themes/beastie/layouts/_partials/site-header.html
index 1928c07a30..e411dfaea2 100644
--- a/website/themes/beastie/layouts/_partials/site-header.html
+++ b/website/themes/beastie/layouts/_partials/site-header.html
@@ -6,7 +6,7 @@
         <img src="{{ "images/FreeBSD-monochromatic.svg" | relURL }}" width="160" height="50" alt="FreeBSD logo">
       </a>
       <label class="menu-bars" for="menu-bars">
-        <i class="fa fa-bars" aria-hidden="true"></i>
+        <span class="menu-bars-icon" aria-hidden="true"></span>
       </label>
     </div>
     <input id="menu-bars" type="checkbox">