Skip to content

Commit 351df06

Browse files
coolreader18coolreader18
committed
deploy: b381ec6 
1 parent ac8f809 commit 351df06

File tree

10 files changed

+480
-139
lines changed

10 files changed

+480
-139
lines changed

‎ayu-highlight.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,7 @@ Original by Dempfi (https://github.com/dempfi/ayu)
1212
}
1313

1414
.hljs-comment,
15-
.hljs-quote,
16-
.hljs-meta {
15+
.hljs-quote {
1716
color: #5c6773;
1817
font-style: italic;
1918
}
@@ -30,6 +29,7 @@ Original by Dempfi (https://github.com/dempfi/ayu)
3029
}
3130

3231
.hljs-number,
32+
.hljs-meta,
3333
.hljs-builtin-name,
3434
.hljs-literal,
3535
.hljs-type,

‎book.js

Lines changed: 56 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -408,7 +408,7 @@ function playpen_text(playpen) {
408408
(function sidebar() {
409409
var html = document.querySelector("html");
410410
var sidebar = document.getElementById("sidebar");
411-
var sidebarScrollBox = document.getElementById("sidebar-scrollbox");
411+
var sidebarScrollBox = document.querySelector(".sidebar-scrollbox");
412412
var sidebarLinks = document.querySelectorAll('#sidebar a');
413413
var sidebarToggleButton = document.getElementById("sidebar-toggle");
414414
var sidebarResizeHandle = document.getElementById("sidebar-resize-handle");
@@ -505,7 +505,7 @@ function playpen_text(playpen) {
505505
}, { passive: true });
506506

507507
// Scroll sidebar to current active section
508-
var activeSection = sidebar.querySelector(".active");
508+
var activeSection = document.getElementById("sidebar").querySelector(".active");
509509
if (activeSection) {
510510
sidebarScrollBox.scrollTop = activeSection.offsetTop;
511511
}
@@ -580,26 +580,60 @@ function playpen_text(playpen) {
580580
});
581581
})();
582582

583-
(function autoHideMenu() {
583+
(function controllMenu() {
584584
var menu = document.getElementById('menu-bar');
585585

586-
var previousScrollTop = document.scrollingElement.scrollTop;
587-
588-
document.addEventListener('scroll', function () {
589-
if (menu.classList.contains('folded') && document.scrollingElement.scrollTop < previousScrollTop) {
590-
menu.classList.remove('folded');
591-
} else if (!menu.classList.contains('folded') && document.scrollingElement.scrollTop > previousScrollTop) {
592-
menu.classList.add('folded');
593-
}
594-
595-
if (!menu.classList.contains('bordered') && document.scrollingElement.scrollTop > 0) {
596-
menu.classList.add('bordered');
597-
}
598-
599-
if (menu.classList.contains('bordered') && document.scrollingElement.scrollTop === 0) {
600-
menu.classList.remove('bordered');
601-
}
602-
603-
previousScrollTop = Math.max(document.scrollingElement.scrollTop, 0);
604-
}, { passive: true });
586+
(function controllPosition() {
587+
var scrollTop = document.scrollingElement.scrollTop;
588+
var prevScrollTop = scrollTop;
589+
var minMenuY = -menu.clientHeight - 50;
590+
// When the script loads, the page can be at any scroll (e.g. if you reforesh it).
591+
menu.style.top = scrollTop + 'px';
592+
// Same as parseInt(menu.style.top.slice(0, -2), but faster
593+
var topCache = menu.style.top.slice(0, -2);
594+
menu.classList.remove('sticky');
595+
var stickyCache = false; // Same as menu.classList.contains('sticky'), but faster
596+
document.addEventListener('scroll', function () {
597+
scrollTop = Math.max(document.scrollingElement.scrollTop, 0);
598+
// `null` means that it doesn't need to be updated
599+
var nextSticky = null;
600+
var nextTop = null;
601+
var scrollDown = scrollTop > prevScrollTop;
602+
var menuPosAbsoluteY = topCache - scrollTop;
603+
if (scrollDown) {
604+
nextSticky = false;
605+
if (menuPosAbsoluteY > 0) {
606+
nextTop = prevScrollTop;
607+
}
608+
} else {
609+
if (menuPosAbsoluteY > 0) {
610+
nextSticky = true;
611+
} else if (menuPosAbsoluteY < minMenuY) {
612+
nextTop = prevScrollTop + minMenuY;
613+
}
614+
}
615+
if (nextSticky === true && stickyCache === false) {
616+
menu.classList.add('sticky');
617+
stickyCache = true;
618+
} else if (nextSticky === false && stickyCache === true) {
619+
menu.classList.remove('sticky');
620+
stickyCache = false;
621+
}
622+
if (nextTop !== null) {
623+
menu.style.top = nextTop + 'px';
624+
topCache = nextTop;
625+
}
626+
prevScrollTop = scrollTop;
627+
}, { passive: true });
628+
})();
629+
(function controllBorder() {
630+
menu.classList.remove('bordered');
631+
document.addEventListener('scroll', function () {
632+
if (menu.offsetTop === 0) {
633+
menu.classList.remove('bordered');
634+
} else {
635+
menu.classList.add('bordered');
636+
}
637+
}, { passive: true });
638+
})();
605639
})();

‎css/chrome.css

Lines changed: 23 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -20,25 +20,35 @@ a > .hljs {
2020

2121
/* Menu Bar */
2222

23-
#menu-bar {
24-
position: -webkit-sticky;
25-
position: sticky;
26-
top: 0;
23+
#menu-bar,
24+
#menu-bar-hover-placeholder {
2725
z-index: 101;
2826
margin: auto calc(0px - var(--page-padding));
2927
}
30-
#menu-bar > #menu-bar-sticky-container {
28+
#menu-bar {
29+
position: relative;
3130
display: flex;
3231
flex-wrap: wrap;
3332
background-color: var(--bg);
3433
border-bottom-color: var(--bg);
3534
border-bottom-width: 1px;
3635
border-bottom-style: solid;
3736
}
38-
.js #menu-bar > #menu-bar-sticky-container {
39-
transition: transform 0.3s;
37+
#menu-bar.sticky,
38+
.js #menu-bar-hover-placeholder:hover + #menu-bar,
39+
.js #menu-bar:hover,
40+
.js.sidebar-visible #menu-bar {
41+
position: -webkit-sticky;
42+
position: sticky;
43+
top: 0 !important;
44+
}
45+
#menu-bar-hover-placeholder {
46+
position: sticky;
47+
position: -webkit-sticky;
48+
top: 0;
49+
height: var(--menu-bar-height);
4050
}
41-
#menu-bar.bordered > #menu-bar-sticky-container {
51+
#menu-bar.bordered {
4252
border-bottom-color: var(--table-border-color);
4353
}
4454
#menu-bar i, #menu-bar .icon-button {
@@ -72,10 +82,6 @@ a > .hljs {
7282
text-decoration: none;
7383
}
7484

75-
html:not(.sidebar-visible) #menu-bar:not(:hover).folded > #menu-bar-sticky-container {
76-
transform: translateY(calc(-10px - var(--menu-bar-height)));
77-
}
78-
7985
.left-buttons {
8086
display: flex;
8187
margin: 0 5px;
@@ -417,6 +423,11 @@ ul#searchresults span.teaser em {
417423
display: none;
418424
}
419425

426+
.chapter li.expanded {
427+
line-height: 1.5em;
428+
margin-top: 0.6em;
429+
}
430+
420431
.chapter li.expanded > a.toggle div {
421432
transform: rotate(90deg);
422433
}

‎css/general.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,7 @@ h4 a.header:target {
6060
.page {
6161
outline: 0;
6262
padding: 0 var(--page-padding);
63+
margin-top: calc(0px - var(--menu-bar-height)); /* Compensate for the #menu-bar-hover-placeholder */
6364
}
6465
.page-wrapper {
6566
box-sizing: border-box;
@@ -78,6 +79,9 @@ h4 a.header:target {
7879
margin-right: auto;
7980
max-width: var(--content-max-width);
8081
}
82+
.content p { line-height: 1.45em; }
83+
.content ol { line-height: 1.45em; }
84+
.content ul { line-height: 1.45em; }
8185
.content a { text-decoration: none; }
8286
.content a:hover { text-decoration: underline; }
8387
.content img { max-width: 100%; }

‎index.html

Lines changed: 42 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<!-- Book generated using mdBook -->
55
<meta charset="UTF-8">
6-
<title>Chapter 1 - RustPython docs</title>
6+
<title>Introduction - RustPython docs</title>
77

88

99
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
@@ -81,7 +81,7 @@
8181

8282
<nav id="sidebar" class="sidebar" aria-label="Table of contents">
8383
<div id="sidebar-scrollbox" class="sidebar-scrollbox">
84-
<ol class="chapter"><li class="expanded "><a href="chapter_1.html"><strong aria-hidden="true">1.</strong> Chapter 1</a></li></ol>
84+
<ol class="chapter"><li class="expanded "><a href="intro.html"><strong aria-hidden="true">1.</strong> Introduction</a></li><li class="expanded "><a href="writing_functions.html"><strong aria-hidden="true">2.</strong> Writing Functions</a></li></ol>
8585
</div>
8686
<div id="sidebar-resize-handle" class="sidebar-resize-handle"></div>
8787
</nav>
@@ -90,37 +90,36 @@
9090

9191
<div class="page">
9292

93-
<div id="menu-bar" class="menu-bar">
94-
<div id="menu-bar-sticky-container">
95-
<div class="left-buttons">
96-
<button id="sidebar-toggle" class="icon-button" type="button" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
97-
<i class="fa fa-bars"></i>
98-
</button>
99-
<button id="theme-toggle" class="icon-button" type="button" title="Change theme" aria-label="Change theme" aria-haspopup="true" aria-expanded="false" aria-controls="theme-list">
100-
<i class="fa fa-paint-brush"></i>
101-
</button>
102-
<ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
103-
<li role="none"><button role="menuitem" class="theme" id="light">Light (default)</button></li>
104-
<li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
105-
<li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
106-
<li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
107-
<li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
108-
</ul>
109-
110-
<button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
111-
<i class="fa fa-search"></i>
112-
</button>
113-
114-
</div>
115-
116-
<h1 class="menu-title">RustPython docs</h1>
117-
118-
<div class="right-buttons">
119-
<a href="print.html" title="Print this book" aria-label="Print this book">
120-
<i id="print-button" class="fa fa-print"></i>
121-
</a>
122-
123-
</div>
93+
<div id="menu-bar-hover-placeholder"></div>
94+
<div id="menu-bar" class="menu-bar sticky bordered">
95+
<div class="left-buttons">
96+
<button id="sidebar-toggle" class="icon-button" type="button" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
97+
<i class="fa fa-bars"></i>
98+
</button>
99+
<button id="theme-toggle" class="icon-button" type="button" title="Change theme" aria-label="Change theme" aria-haspopup="true" aria-expanded="false" aria-controls="theme-list">
100+
<i class="fa fa-paint-brush"></i>
101+
</button>
102+
<ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
103+
<li role="none"><button role="menuitem" class="theme" id="light">Light (default)</button></li>
104+
<li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
105+
<li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
106+
<li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
107+
<li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
108+
</ul>
109+
110+
<button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
111+
<i class="fa fa-search"></i>
112+
</button>
113+
114+
</div>
115+
116+
<h1 class="menu-title">RustPython docs</h1>
117+
118+
<div class="right-buttons">
119+
<a href="print.html" title="Print this book" aria-label="Print this book">
120+
<i id="print-button" class="fa fa-print"></i>
121+
</a>
122+
124123
</div>
125124
</div>
126125

@@ -148,7 +147,8 @@ <h1 class="menu-title">RustPython docs</h1>
148147

149148
<div id="content" class="content">
150149
<main>
151-
<h1><a class="header" href="#chapter-1" id="chapter-1">Chapter 1</a></h1>
150+
<h1><a class="header" href="#rustpython-docs" id="rustpython-docs">RustPython Docs</a></h1>
151+
<h3><a class="header" href="#feel-free-to-browse-the-table-of-contents-on-the-right" id="feel-free-to-browse-the-table-of-contents-on-the-right">Feel free to browse the table of contents on the right</a></h3>
152152

153153
</main>
154154

@@ -157,6 +157,10 @@ <h1><a class="header" href="#chapter-1" id="chapter-1">Chapter 1</a></h1>
157157

158158

159159

160+
<a rel="next" href="writing_functions.html" class="mobile-nav-chapters next" title="Next chapter" aria-label="Next chapter" aria-keyshortcuts="Right">
161+
<i class="fa fa-angle-right"></i>
162+
</a>
163+
160164

161165
<div style="clear: both"></div>
162166
</nav>
@@ -167,6 +171,10 @@ <h1><a class="header" href="#chapter-1" id="chapter-1">Chapter 1</a></h1>
167171

168172

169173

174+
<a rel="next" href="writing_functions.html" class="nav-chapters next" title="Next chapter" aria-label="Next chapter" aria-keyshortcuts="Right">
175+
<i class="fa fa-angle-right"></i>
176+
</a>
177+
170178
</nav>
171179

172180
</div>

0 commit comments

Comments
 (0)