Disable text selection and CSS transition while resizing sidebar

src/theme/book.js

@@ -480,12 +480,14 @@ function playpen_text(playpen) {
     function initResize(e) {
         window.addEventListener('mousemove', resize, false);
         window.addEventListener('mouseup', stopResize, false);
+        html.classList.add('sidebar-resizing');
     }
     function resize(e) {
         document.documentElement.style.setProperty('--sidebar-width', (e.clientX - sidebar.offsetLeft) + 'px');
     }
     //on mouseup remove windows functions mousemove & mouseup
     function stopResize(e) {
+        html.classList.remove('sidebar-resizing');
         window.removeEventListener('mousemove', resize, false);
         window.removeEventListener('mouseup', stopResize, false);
     }

src/theme/css/chrome.css

@@ -308,7 +308,13 @@ ul#searchresults span.teaser em {
     background-color: var(--sidebar-bg);
     color: var(--sidebar-fg);
 }
-.js .sidebar {
+.sidebar-resizing {
+    -moz-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+.js:not(.sidebar-resizing) .sidebar {
     transition: transform 0.3s; /* Animation: slide away */
 }
 .sidebar code {

src/theme/css/general.css

@@ -30,7 +30,7 @@ h4, h5 { margin-top: 2em; }
 
 .header + .header h3,
 .header + .header h4,
-.header + .header h5 { 
+.header + .header h5 {
     margin-top: 1em;
 }
 
@@ -51,7 +51,7 @@ a.header:target h4:before {
 .page-wrapper {
     box-sizing: border-box;
 }
-.js .page-wrapper {
+.js:not(.sidebar-resizing) .page-wrapper {
     transition: margin-left 0.3s ease, transform 0.3s ease; /* Animation: slide away */
 }
 
@@ -141,4 +141,3 @@ blockquote {
 .tooltipped .tooltiptext {
     visibility: visible;
 }
-