feat(fuzzhelp): use CSS to resize TOC instead of JS

atusy · May 5, 2024 · 929056e · 929056e
1 parent 70c9a60
commit 929056e
Showing 1 changed file with 2 additions and 28 deletions.
diff --git a/R/fuzzyhelp.R b/R/fuzzyhelp.R
@@ -282,37 +282,11 @@ create_ui <- function(query = "", background = FALSE) {
         width = "100%"
       ),
       reactable::reactableOutput("tocViewer", width = "100%", height = "200px"),
-      htmltools::tags$div(
-        id = "bar",
-        style = paste(
-          "width: 100%; height: 8px; cursor: row-resize;",
-          "background-color: transparent;"
-        ),
-        draggable = "true"
-      ),
       shiny::uiOutput("helpViewer"),
-      style = "display: grid; grid-template-rows: auto auto auto 1fr"
+      style = "display: grid; grid-template-rows: auto auto 1fr"
     ),
     htmltools::tags$style("
-      #tocViewer {
-        overflow: hidden;
-      }
-    "),
-    htmltools::tags$script("
-      (function(){
-        // Resize tocViewer
-        const toc = document.getElementById('tocViewer');
-        const bar = document.getElementById('bar');
-        let screenY, tocHeight
-        bar.addEventListener('dragstart', function() {
-          screenY = window.event.screenY;
-          tocHeight = toc.getBoundingClientRect().height;
-        });
-        bar.addEventListener('drag', function() {
-          const diff = window.event.screenY - screenY;
-          toc.style.height = tocHeight + diff + 'px';
-        });
-      })();
+      #tocViewer { overflow: hidden; resize: vertical; margin-bottom: 15px }
     "),
     style = "display: grid; grid-template-rows: auto 1fr; height: 100vh"
   )