fix dropdown menu for non-javascript browsers

ethpandaops · Aug 26, 2023 · 6db2b20 · 6db2b20
1 parent e09ec2d
commit 6db2b20
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/static/css/layout.css b/static/css/layout.css
@@ -183,6 +183,11 @@ header nav .navbar-toggler.toggler-wrapper > * {
   z-index: 101;
 }
 
+header nav .nav-item:hover .dropdown-menu,
+header nav .nav-item:focus-within .dropdown-menu {
+  display: block;
+}
+
 @media (max-width: 992px) {
   header .navbar-brand {
     margin-right: 0;

diff --git a/templates/_layout/layout.html b/templates/_layout/layout.html
@@ -39,22 +39,19 @@
       <script src="/js/color-modes.js"></script>
     </head>
     <body>
-      <noscript>
-        <strong>We're sorry but this explorer doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
-      </noscript>
-
       <div class="header">
         {{ template "header" . }}
       </div>
       <main>
+        <noscript class="container d-block my-4">
+          <strong>We're sorry but this explorer doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+        </noscript>
         {{ template "page" .Data }}
       </main>
-
       <div class="footer">
         <hr>
         {{ template "footer" . }}
       </div>
-
       <script src="/js/typeahead.min.js"></script>
       <script src="/js/clipboard.min.js"></script>
       <script src="/js/explorer.js"></script>