Merge pull request #2750 from ehuss/fix-resize-visible
Fix sidebar animation and other behavior
This commit is contained in:
commit
1eeb0d23e6
2 changed files with 8 additions and 8 deletions
|
|
@ -86,11 +86,12 @@ h6:target::before {
|
|||
box-sizing: border-box;
|
||||
background-color: var(--bg);
|
||||
}
|
||||
.no-js .page-wrapper,
|
||||
html:not(.js) .page-wrapper,
|
||||
.js:not(.sidebar-resizing) .page-wrapper {
|
||||
transition: margin-left 0.3s ease, transform 0.3s ease; /* Animation: slide away */
|
||||
}
|
||||
[dir=rtl] .js:not(.sidebar-resizing) .page-wrapper {
|
||||
[dir=rtl]:not(.js) .page-wrapper,
|
||||
[dir=rtl].js:not(.sidebar-resizing) .page-wrapper {
|
||||
transition: margin-right 0.3s ease, transform 0.3s ease; /* Animation: slide away */
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -515,7 +515,6 @@ aria-label="Show hidden lines"></button>';
|
|||
})();
|
||||
|
||||
(function sidebar() {
|
||||
const body = document.querySelector('body');
|
||||
const sidebar = document.getElementById('sidebar');
|
||||
const sidebarLinks = document.querySelectorAll('#sidebar a');
|
||||
const sidebarToggleButton = document.getElementById('sidebar-toggle');
|
||||
|
|
@ -548,7 +547,7 @@ aria-label="Show hidden lines"></button>';
|
|||
});
|
||||
|
||||
function showSidebar() {
|
||||
body.classList.add('sidebar-visible');
|
||||
document.documentElement.classList.add('sidebar-visible');
|
||||
Array.from(sidebarLinks).forEach(function(link) {
|
||||
link.setAttribute('tabIndex', 0);
|
||||
});
|
||||
|
|
@ -562,7 +561,7 @@ aria-label="Show hidden lines"></button>';
|
|||
}
|
||||
|
||||
function hideSidebar() {
|
||||
body.classList.remove('sidebar-visible');
|
||||
document.documentElement.classList.remove('sidebar-visible');
|
||||
Array.from(sidebarLinks).forEach(function(link) {
|
||||
link.setAttribute('tabIndex', -1);
|
||||
});
|
||||
|
|
@ -594,14 +593,14 @@ aria-label="Show hidden lines"></button>';
|
|||
function initResize() {
|
||||
window.addEventListener('mousemove', resize, false);
|
||||
window.addEventListener('mouseup', stopResize, false);
|
||||
body.classList.add('sidebar-resizing');
|
||||
document.documentElement.classList.add('sidebar-resizing');
|
||||
}
|
||||
function resize(e) {
|
||||
let pos = e.clientX - sidebar.offsetLeft;
|
||||
if (pos < 20) {
|
||||
hideSidebar();
|
||||
} else {
|
||||
if (!body.classList.contains('sidebar-visible')) {
|
||||
if (!document.documentElement.classList.contains('sidebar-visible')) {
|
||||
showSidebar();
|
||||
}
|
||||
pos = Math.min(pos, window.innerWidth - 100);
|
||||
|
|
@ -610,7 +609,7 @@ aria-label="Show hidden lines"></button>';
|
|||
}
|
||||
//on mouseup remove windows functions mousemove & mouseup
|
||||
function stopResize() {
|
||||
body.classList.remove('sidebar-resizing');
|
||||
document.documentElement.classList.remove('sidebar-resizing');
|
||||
window.removeEventListener('mousemove', resize, false);
|
||||
window.removeEventListener('mouseup', stopResize, false);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue