git: f73e67f250 - main - Website: Draw the menu bars with CSS instead the font-awesome icons
- Go to: [ bottom of page ] [ top of archives ] [ this month ]
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">