From f43e35c3a92b5e2adf7c9c0c5227193daeb4d2b3 Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Mon, 17 Jun 2024 16:34:27 -0400
Subject: [PATCH] add close button to sidebar

---
 docs/_includes/base.njk     |  1 +
 docs/assets/styles/docs.css | 13 +++++++++++++
 2 files changed, 14 insertions(+)

diff --git a/docs/_includes/base.njk b/docs/_includes/base.njk
index 5a83dc4b2..ee1a348bb 100644
--- a/docs/_includes/base.njk
+++ b/docs/_includes/base.njk
@@ -86,6 +86,7 @@
       {# Sidebar #}
       {% if hasSidebar %}
         <aside slot="navigation" id="sidebar" class="docs-aside" data-remember-scroll>
+          <wa-icon-button id="sidebar-close-button" name="xmark" label="Close" data-drawer="close"></wa-icon-button>
           <nav>
             {% include "sidebar.njk" %}
           </nav>
diff --git a/docs/assets/styles/docs.css b/docs/assets/styles/docs.css
index afb47aa24..76b051253 100644
--- a/docs/assets/styles/docs.css
+++ b/docs/assets/styles/docs.css
@@ -134,6 +134,19 @@ wa-page[view='desktop'] > #sidebar {
   }
 }
 
+#sidebar-close-button {
+  display: none;
+}
+
+@media screen and (max-width: 768px) {
+  #sidebar-close-button {
+    display: inline-block;
+    position: absolute;
+    top: 1rem;
+    right: 1rem;
+  }
+}
+
 #sidebar nav {
   padding-bottom: 1rem;
 }