From 1088066c69e9a63ead7a8e798be22752e35d22ae Mon Sep 17 00:00:00 2001 From: Tim Crawford Date: Tue, 16 Mar 2021 23:21:40 -0600 Subject: [PATCH] Move sidebar, js classes from html to body element This will be necessary for using CSS selectors on root attributes. Signed-off-by: Tim Crawford --- src/theme/book.js | 20 ++++++++++---------- src/theme/index.hbs | 15 ++++++++------- 2 files changed, 18 insertions(+), 17 deletions(-) diff --git a/src/theme/book.js b/src/theme/book.js index 351e28c7..fb913165 100644 --- a/src/theme/book.js +++ b/src/theme/book.js @@ -441,7 +441,7 @@ function playground_text(playground, hidden = true) { })(); (function sidebar() { - var html = document.querySelector("html"); + var body = document.querySelector("body"); var sidebar = document.getElementById("sidebar"); var sidebarLinks = document.querySelectorAll('#sidebar a'); var sidebarToggleButton = document.getElementById("sidebar-toggle"); @@ -449,8 +449,8 @@ function playground_text(playground, hidden = true) { var firstContact = null; function showSidebar() { - html.classList.remove('sidebar-hidden') - html.classList.add('sidebar-visible'); + body.classList.remove('sidebar-hidden') + body.classList.add('sidebar-visible'); Array.from(sidebarLinks).forEach(function (link) { link.setAttribute('tabIndex', 0); }); @@ -471,8 +471,8 @@ function playground_text(playground, hidden = true) { }); function hideSidebar() { - html.classList.remove('sidebar-visible') - html.classList.add('sidebar-hidden'); + body.classList.remove('sidebar-visible') + body.classList.add('sidebar-hidden'); Array.from(sidebarLinks).forEach(function (link) { link.setAttribute('tabIndex', -1); }); @@ -483,14 +483,14 @@ function playground_text(playground, hidden = true) { // Toggle sidebar sidebarToggleButton.addEventListener('click', function sidebarToggle() { - if (html.classList.contains("sidebar-hidden")) { + if (body.classList.contains("sidebar-hidden")) { var current_width = parseInt( document.documentElement.style.getPropertyValue('--sidebar-width'), 10); if (current_width < 150) { document.documentElement.style.setProperty('--sidebar-width', '150px'); } showSidebar(); - } else if (html.classList.contains("sidebar-visible")) { + } else if (body.classList.contains("sidebar-visible")) { hideSidebar(); } else { if (getComputedStyle(sidebar)['transform'] === 'none') { @@ -506,14 +506,14 @@ function playground_text(playground, hidden = true) { function initResize(e) { window.addEventListener('mousemove', resize, false); window.addEventListener('mouseup', stopResize, false); - html.classList.add('sidebar-resizing'); + body.classList.add('sidebar-resizing'); } function resize(e) { var pos = (e.clientX - sidebar.offsetLeft); if (pos < 20) { hideSidebar(); } else { - if (html.classList.contains("sidebar-hidden")) { + if (body.classList.contains("sidebar-hidden")) { showSidebar(); } pos = Math.min(pos, window.innerWidth - 100); @@ -522,7 +522,7 @@ function playground_text(playground, hidden = true) { } //on mouseup remove windows functions mousemove & mouseup function stopResize(e) { - html.classList.remove('sidebar-resizing'); + body.classList.remove('sidebar-resizing'); window.removeEventListener('mousemove', resize, false); window.removeEventListener('mouseup', stopResize, false); } diff --git a/src/theme/index.hbs b/src/theme/index.hbs index 43607111..a3129f2b 100644 --- a/src/theme/index.hbs +++ b/src/theme/index.hbs @@ -1,5 +1,5 @@ - + @@ -53,7 +53,7 @@ {{/if}} - +