Skip to content

Commit 18db032

Browse files
meatormeator
committed
UNFINISHED
1 parent 4a18180 commit 18db032

File tree

3 files changed

+57
-21
lines changed

3 files changed

+57
-21
lines changed

‎src/theme/book.js‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ window.onunload = function () { };
2323
var sidebar = document.getElementById("sidebar");
2424
var sidebarLinks = document.querySelectorAll('#sidebar a');
2525
var sidebarToggleButton = document.getElementById("sidebar-toggle");
26+
var sidebarResizeHandle = document.getElementById("sidebar-resize-handle");
2627
var firstContact = null;
2728

2829
function showSidebar() {
@@ -50,6 +51,11 @@ window.onunload = function () { };
5051
// Toggle sidebar
5152
sidebarToggleButton.addEventListener('click', function sidebarToggle() {
5253
if (body.classList.contains("sidebar-hidden")) {
54+
var current_width = parseInt(
55+
document.documentElement.style.getPropertyValue('--sidebar-width'), 10);
56+
if (current_width < 150) {
57+
document.documentElement.style.setProperty('--sidebar-width', '150px');
58+
}
5359
showSidebar();
5460
} else if (body.classList.contains("sidebar-visible")) {
5561
hideSidebar();
@@ -62,6 +68,32 @@ window.onunload = function () { };
6268
}
6369
});
6470

71+
sidebarResizeHandle.addEventListener('mousedown', initResize, false);
72+
73+
function initResize(e) {
74+
window.addEventListener('mousemove', resize, false);
75+
window.addEventListener('mouseup', stopResize, false);
76+
body.classList.add('sidebar-resizing');
77+
}
78+
function resize(e) {
79+
var pos = (e.clientX - sidebar.offsetLeft);
80+
if (pos < 20) {
81+
hideSidebar();
82+
} else {
83+
if (body.classList.contains("sidebar-hidden")) {
84+
showSidebar();
85+
}
86+
pos = Math.min(pos, window.innerWidth - 100);
87+
document.documentElement.style.setProperty('--sidebar-width', pos + 'px');
88+
}
89+
}
90+
//on mouseup remove windows functions mousemove & mouseup
91+
function stopResize(e) {
92+
body.classList.remove('sidebar-resizing');
93+
window.removeEventListener('mousemove', resize, false);
94+
window.removeEventListener('mouseup', stopResize, false);
95+
}
96+
6597
document.addEventListener('touchstart', function (e) {
6698
firstContact = {
6799
x: e.touches[0].clientX,

‎src/theme/css/general.css‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -264,11 +264,6 @@ ul#searchresults span.teaser {
264264

265265
/* chapter navigation */
266266

267-
#nav-wide-wrapper {
268-
max-width: 800px;
269-
margin: 0 auto;
270-
margin-top: 50px;
271-
}
272267
.previous {
273268
float: left;
274269
}

‎src/theme/index.hbs‎

Lines changed: 25 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,8 @@
2727
var path_to_root = "{{ path_to_root }}";
2828
var default_theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "{{ preferred_dark_theme }}" : "{{ default_theme }}";
2929
</script>
30+
<!-- Start loading toc.js asap -->
31+
<script src="{{ path_to_root }}toc.js"></script>
3032
</head>
3133
<body>
3234
<div id="body-container">
@@ -59,6 +61,29 @@
5961

6062
<input type="checkbox" id="sidebar-toggle-anchor" class="hidden">
6163

64+
<!-- Hide / unhide sidebar before it is displayed -->
65+
<script type="text/javascript">
66+
var html = document.querySelector('html');
67+
var sidebar = 'hidden';
68+
if (document.body.clientWidth >= 1080) {
69+
try { sidebar = localStorage.getItem('mdbook-sidebar'); } catch(e) { }
70+
sidebar = sidebar || 'visible';
71+
}
72+
html.classList.remove('sidebar-visible');
73+
html.classList.add("sidebar-" + sidebar);
74+
</script>
75+
76+
<nav id="sidebar" class="sidebar" aria-label="Table of contents">
77+
<!-- populated by js -->
78+
<mdbook-sidebar-scrollbox class="sidebar-scrollbox"></mdbook-sidebar-scrollbox>
79+
<noscript>
80+
<iframe class="sidebar-iframe-outer" src="{{ path_to_root }}toc.html"></iframe>
81+
</noscript>
82+
<div id="sidebar-resize-handle" class="sidebar-resize-handle">
83+
<div class="sidebar-resize-indicator"></div>
84+
</div>
85+
</nav>
86+
6287
<header>
6388
<nav id="void-nav">
6489
<ul>
@@ -124,22 +149,6 @@
124149
</header>
125150

126151
<div id="content">
127-
<!-- Hide / unhide sidebar before it is displayed -->
128-
<script type="text/javascript">
129-
var html = document.querySelector('html');
130-
var sidebar = 'hidden';
131-
if (document.body.clientWidth >= 1080) {
132-
try { sidebar = localStorage.getItem('mdbook-sidebar'); } catch(e) { }
133-
sidebar = sidebar || 'visible';
134-
}
135-
html.classList.remove('sidebar-visible');
136-
html.classList.add("sidebar-" + sidebar);
137-
</script>
138-
139-
<nav id="sidebar" aria-label="Table of contents">
140-
{{#toc}}{{/toc}}
141-
</nav>
142-
143152
<div id="page-wrapper" class="page-wrapper">
144153

145154
{{#if search_enabled}}

0 commit comments

Comments
 (0)