mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2025-01-18 02:40:24 +00:00
parent
d2b1a6fdf7
commit
ea8b527f25
24 changed files with 292 additions and 197 deletions
|
@ -40,6 +40,8 @@ This document shows you what's new in the latest release. For a detailed list of
|
|||
|
||||
Note, that the new variant switch will not work with Internet Explorer 11 as it does not support CSS variables. Therefore, the variant switcher will not be displayed with Internet Explorer 11.
|
||||
|
||||
---
|
||||
|
||||
## 2.9.0
|
||||
|
||||
- **Breaking**: This release removes the themes implementation of `ref`/`relref` in favor for Hugos standard implementation. This is because of inconsistencies with the themes implementation. In advantage, your project becomes standard complient and exchanging this theme in your project to some other theme will be effortless.
|
||||
|
@ -76,6 +78,8 @@ This document shows you what's new in the latest release. For a detailed list of
|
|||
| Leaf bundle | `(ref\s+"[^"]*)/index\.md"` | `$1"` |
|
||||
| Page | `(ref\s+"[^"]*)\.md"` | `$1"` |
|
||||
|
||||
---
|
||||
|
||||
## 2.8.0
|
||||
|
||||
- **Change**: Although never officially documented, this release removes the font `Novacento`/`Novecento`. If you use it in an overwritten CSS please replace it with `Work Sans`. This change was necessary as Novacento did not provide all Latin special characters and lead to mixed styled character text eg. for czech.
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "...قم بتوسيع"
|
|||
[Navigation-toggle]
|
||||
other = "قائمة"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "جدول المحتويات"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Erweitere mich..."
|
|||
[Navigation-toggle]
|
||||
other = "Menu"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Inhalt"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Expand me..."
|
|||
[Navigation-toggle]
|
||||
other = "Menu"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Table of Contents"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Expandir..."
|
|||
[Navigation-toggle]
|
||||
other = "Menú"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Tabla de contenido"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Déroulez-moi..."
|
|||
[Navigation-toggle]
|
||||
other = "Menu"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Table des matières"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "o"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "विस्तार करे..."
|
|||
[Navigation-toggle]
|
||||
other = "Menú"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "विषयसूची"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Bentangkan..."
|
|||
[Navigation-toggle]
|
||||
other = "Menu"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Daftar isi"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "開く..."
|
|||
[Navigation-toggle]
|
||||
other = "メニュー"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "目次"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Lees meer..."
|
|||
[Navigation-toggle]
|
||||
other = "Menu"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Inhoudsopgave"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Expand me..."
|
|||
[Navigation-toggle]
|
||||
other = "Menu"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Table o' Contents"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Expandir..."
|
|||
[Navigation-toggle]
|
||||
other = "Menu"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Índice"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Развернуть..."
|
|||
[Navigation-toggle]
|
||||
other = "Меню"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Оглавление"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "Б"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Genişlet..."
|
|||
[Navigation-toggle]
|
||||
other = "Menü"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "İçindekiler"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "Mở rộng..."
|
|||
[Navigation-toggle]
|
||||
other = "Menu"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "Mục lục"
|
||||
|
||||
[BinaryPrefix-kilobyte]
|
||||
other = "kb"
|
||||
|
||||
|
|
|
@ -28,6 +28,9 @@ other = "展开"
|
|||
[Navigation-toggle]
|
||||
other = "导航"
|
||||
|
||||
[Toc-toggle]
|
||||
other = "目录"
|
||||
|
||||
[Byte-symbol]
|
||||
other = "B"
|
||||
|
||||
|
|
|
@ -26,12 +26,14 @@
|
|||
<div id="body default-animation" style="margin-left:0px;">
|
||||
<div id="sidebar-overlay"></div>
|
||||
<main id="body-inner" class="chapter">
|
||||
<h1>{{ T "title-404" }}</h1>
|
||||
<p></p>
|
||||
<p>{{ T "message-404" }}</p>
|
||||
<p></p>
|
||||
<p><a href="{{ "" | relLangURL }}">{{ T "Go-to-homepage" }}</a></p>
|
||||
<p><img src="{{ "/images/gopher-404.jpg" | relURL }}" style="width:50%" alt="Page not found!"></p>
|
||||
<div class="flex-block-wrapper">
|
||||
<h1>{{ T "title-404" }}</h1>
|
||||
<p></p>
|
||||
<p>{{ T "message-404" }}</p>
|
||||
<p></p>
|
||||
<p><a href="{{ "" | relLangURL }}">{{ T "Go-to-homepage" }}</a></p>
|
||||
<p><img src="{{ "/images/gopher-404.jpg" | relURL }}" style="width:50%" alt="Page not found!"></p>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
|
|
|
@ -1,14 +1,13 @@
|
|||
<footer class="footline">
|
||||
<footer class="footline">
|
||||
{{- with .Params.LastModifierDisplayName }}
|
||||
<i class='fas fa-user'></i> <a href="mailto:{{ $.Params.LastModifierEmail }}">{{ . }}</a> {{ with $.Date }} <i class='fas fa-calendar'></i> {{ .Format "02/01/2006" }}{{ end }}
|
||||
<i class='fas fa-user'></i> <a href="mailto:{{ $.Params.LastModifierEmail }}">{{ . }}</a> {{ with $.Date }} <i class='fas fa-calendar'></i> {{ .Format "02/01/2006" }}{{ end }}
|
||||
{{- end }}
|
||||
</footer>
|
||||
</footer>
|
||||
</div>
|
||||
</main><!-- #body-inner -->
|
||||
{{- partial "custom-comments.html" . }}
|
||||
</div><!-- #body -->
|
||||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
{{- partial "menu.html" . }}
|
||||
<script src="{{"js/clipboard.min.js" | relURL}}{{ if not .Site.Params.disableAssetsBusting }}?{{ now.Unix }}{{ end }}"></script>
|
||||
<script src="{{"js/perfect-scrollbar.min.js" | relURL}}{{ if not .Site.Params.disableAssetsBusting }}?{{ now.Unix }}{{ end }}"></script>
|
||||
<script src="{{"js/jquery.svg.pan.zoom.js" | relURL}}{{ if not .Site.Params.disableAssetsBusting }}?{{ now.Unix }}{{ end }}"></script>
|
||||
|
|
|
@ -25,10 +25,10 @@
|
|||
{{- partial "custom-header.html" . }}
|
||||
</head>
|
||||
<body class="default-animation" data-url="{{ .RelPermalink }}">
|
||||
{{- partial "menu.html" . }}
|
||||
<div id="body" class="default-animation">
|
||||
<div id="sidebar-overlay"></div>
|
||||
<div id="topbar" class="highlightable">
|
||||
<div id="toc-overlay"></div>
|
||||
<nav id="topbar" class="highlightable">
|
||||
<div>
|
||||
{{- $showPrevNext := (and (not .Params.disableNextPrev) (not .Site.Params.disableNextPrev)) }}
|
||||
{{- if $showPrevNext }}
|
||||
|
@ -75,12 +75,10 @@
|
|||
{{- $toc := (and $hastoc (not $currentDisableToc) (not .Params.chapter)) }}
|
||||
<div id="breadcrumbs">
|
||||
<span id="sidebar-toggle-span">
|
||||
<a href="#" id="sidebar-toggle" title='{{ T "Navigation-toggle" }}' data-sidebar-toggle="">
|
||||
<i class="fas fa-bars fa-fw"></i>
|
||||
</a>
|
||||
<a href="#" id="sidebar-toggle" title='{{ T "Navigation-toggle" }}'><i class="fas fa-bars fa-fw"></i></a>
|
||||
</span>
|
||||
{{- if $toc }}
|
||||
<span id="toc-menu"><i class="fas fa-list-alt fa-fw"></i></span>
|
||||
<span id="toc-menu" title='{{ T "Toc-toggle" }}'><i class="fas fa-list-alt fa-fw"></i></span>
|
||||
{{- end }}
|
||||
{{- $showBreadcrumb := (and (not .Params.disableBreadcrumb) (not .Site.Params.disableBreadcrumb)) }}
|
||||
{{- if $showBreadcrumb }}
|
||||
|
@ -98,13 +96,14 @@
|
|||
{{- partial "toc.html" . }}
|
||||
{{- end }}
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main id="body-inner" class="highlightable {{if .Params.chapter}} chapter{{end}}">
|
||||
<div id="head-tags">
|
||||
<div class="flex-block-wrapper">
|
||||
<div id="head-tags">
|
||||
{{- partial "tags.html" . }}
|
||||
</div>
|
||||
</div>
|
||||
{{- if and (not .IsHome) (not .Params.chapter) }}
|
||||
<h1>{{ if eq .Kind "term" }}{{ .Data.Singular | humanize }} {{ default "::" .Site.Params.titleSeparator }} {{ end }}{{ .Title }}</h1>
|
||||
<h1>{{ if eq .Kind "term" }}{{ .Data.Singular | humanize }} {{ default "::" .Site.Params.titleSeparator }} {{ end }}{{ .Title }}</h1>
|
||||
{{- end }}
|
||||
|
||||
{{- define "breadcrumb" }}
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
var baseUri=root_url.replace(/\/$/, '');
|
||||
</script>
|
||||
{{- $showvisitedlinks := .Site.Params.showVisitedLinks }}
|
||||
<nav id="sidebar" class="default-animation{{ if $showvisitedlinks }} showVisitedLinks{{ end }}">
|
||||
<aside id="sidebar" class="default-animation{{ if $showvisitedlinks }} showVisitedLinks{{ end }}">
|
||||
{{- $currentNode := . }}
|
||||
<div id="header-wrapper" class="default-animation">
|
||||
<div id="header" class="default-animation">
|
||||
|
@ -116,7 +116,7 @@
|
|||
{{- $footer }}
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</aside>
|
||||
{{- define "section-tree-nav" }}
|
||||
{{- $showvisitedlinks := .showvisitedlinks }}
|
||||
{{- $currentNode := .currentnode }}
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
{{- $c:=""}}{{/* to avoid that user swiping to the left leaves a gap on the right side, we set minimum-scale, even if not advised to */}}
|
||||
<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, minimum-scale=1.0">
|
||||
{{ hugo.Generator }}
|
||||
{{- $ver := partial "version.html" }}
|
||||
{{- $ver = replaceRE "\\s*(\\S*)" "${1}" $ver }}
|
||||
|
|
|
@ -46,10 +46,13 @@
|
|||
body {
|
||||
background-color: #ffffff; /* var(--MAIN-BG-color) */
|
||||
color: #101010; /* var(--MAIN-TEXT-color) */
|
||||
display: flex;
|
||||
flex-direction: row-reverse; /* IE11 to allow body to have initial focus for PS */
|
||||
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
|
||||
font-size: 16.25px;
|
||||
font-weight: 300;
|
||||
line-height: 1.574;
|
||||
overflow: hidden; /* to avoid browser scrollbar to flicker before we create our own */
|
||||
}
|
||||
|
||||
body #body-inner.chapter h1 {
|
||||
|
@ -93,24 +96,27 @@ th {
|
|||
|
||||
#sidebar {
|
||||
background: #282828; /* var(--MENU-SECTIONS-BG-color) */
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 15.25px;
|
||||
height: 100vh;
|
||||
left: 0;
|
||||
line-height: 1.574;
|
||||
min-height: 100vh;
|
||||
min-width: 300px;
|
||||
max-width: 300px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 300px;
|
||||
z-index: 310;
|
||||
}
|
||||
|
||||
#header-wrapper {
|
||||
/* initially use section background to avoid flickering on load when a
|
||||
non default variant is active */
|
||||
background-color: rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
|
||||
border-bottom: 4px solid rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
|
||||
color: #e0e0e0; /* var(--MENU-SEARCH-color) */
|
||||
text-align: center;
|
||||
border-bottom: 4px solid rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
|
||||
padding: 1rem;
|
||||
position: relative;
|
||||
}
|
||||
|
@ -166,9 +172,11 @@ th {
|
|||
|
||||
#content-wrapper {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
flex-direction: column;
|
||||
flex: 1; /* fill rest of vertical space */
|
||||
overflow: hidden;
|
||||
position: relative; /* PS */
|
||||
z-index: 410;
|
||||
}
|
||||
|
||||
#sidebar a {
|
||||
|
@ -330,9 +338,17 @@ th {
|
|||
}
|
||||
|
||||
#body {
|
||||
margin-left: 300px;
|
||||
min-height: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
margin-left: 300px;
|
||||
min-height: 100vh;
|
||||
min-width: calc( 100vw - 300px);
|
||||
max-width: calc( 100vw - 300px);
|
||||
overflow-wrap: break-word; /* avoid x-scrolling of body if it is to large to fit */
|
||||
position: relative; /* PS */
|
||||
width: calc( 100vw - 300px);
|
||||
z-index: 300;
|
||||
}
|
||||
|
||||
#body img,
|
||||
|
@ -360,7 +376,11 @@ th {
|
|||
}
|
||||
|
||||
#body-inner {
|
||||
display: flex;
|
||||
flex: 1; /* fill rest of vertical space */
|
||||
flex-direction: column;
|
||||
padding: 0 3rem 4rem 3rem;
|
||||
position: relative; /* PS */
|
||||
}
|
||||
@media only all and (max-width: 59.938em) {
|
||||
#body-inner {
|
||||
|
@ -391,6 +411,16 @@ th {
|
|||
margin-right: auto;
|
||||
padding: 2rem 9rem;
|
||||
}
|
||||
@media only all and (max-width: 59.938em) {
|
||||
#body-inner.chapter {
|
||||
padding: 15px 4rem 15px 4rem;
|
||||
}
|
||||
}
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#body-inner.chapter {
|
||||
padding: 5px 2rem 5px 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
#body-inner.chapter h3:first-of-type {
|
||||
font-weight: 200;
|
||||
|
@ -786,7 +816,7 @@ td {
|
|||
text-transform: none;
|
||||
white-space: pre;
|
||||
word-wrap: break-word;
|
||||
z-index: 1000000;
|
||||
z-index: 450;
|
||||
}
|
||||
|
||||
.tooltipped:before {
|
||||
|
@ -798,7 +828,7 @@ td {
|
|||
pointer-events: none;
|
||||
position: absolute;
|
||||
width: 0;
|
||||
z-index: 1000001;
|
||||
z-index: 460;
|
||||
}
|
||||
|
||||
.tooltipped:hover:before,
|
||||
|
@ -918,11 +948,9 @@ td {
|
|||
#topbar {
|
||||
background-color: #ffffff; /* var(--MAIN-BG-color) */
|
||||
border-radius: 2px;
|
||||
height: 0;
|
||||
min-height: 3rem;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
position: relative;
|
||||
z-index: 480;
|
||||
}
|
||||
|
||||
#topbar > div {
|
||||
|
@ -934,7 +962,6 @@ td {
|
|||
#top-github-link {
|
||||
display: block;
|
||||
float: right;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.nav,
|
||||
|
@ -985,11 +1012,12 @@ span.nav i{
|
|||
display: none;
|
||||
}
|
||||
.progress {
|
||||
display: none;
|
||||
left: 1rem;
|
||||
top: 1rem;
|
||||
}
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#sidebar-toggle-span {
|
||||
.mobile-support #sidebar-toggle-span {
|
||||
display: inline;
|
||||
}
|
||||
.progress {
|
||||
|
@ -1031,32 +1059,43 @@ a[aria-disabled="true"] {
|
|||
|
||||
@media only all and (max-width: 59.938em) {
|
||||
#sidebar {
|
||||
width: 230px;
|
||||
min-width: 230px;
|
||||
max-width: 230px;
|
||||
width: 230px;
|
||||
}
|
||||
#body {
|
||||
margin-left: 230px;
|
||||
margin-left: 230px;
|
||||
min-width: calc( 100vw - 230px);
|
||||
max-width: calc( 100vw - 230px);
|
||||
width: calc( 100vw - 230px);
|
||||
}
|
||||
}
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#sidebar {
|
||||
/* we don't support sidebar flyout in IE */
|
||||
.mobile-support #sidebar {
|
||||
left: -230px;
|
||||
width: 230px;
|
||||
}
|
||||
#body {
|
||||
.mobile-support #navshow{
|
||||
display: inline;
|
||||
}
|
||||
.mobile-support #body {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
min-width: 100vw;
|
||||
max-width: 100vw;
|
||||
width: 100vw;
|
||||
}
|
||||
.sidebar-hidden {
|
||||
.mobile-support.sidebar-flyout {
|
||||
overflow: hidden;
|
||||
}
|
||||
.sidebar-hidden #sidebar {
|
||||
.mobile-support.sidebar-flyout #sidebar {
|
||||
left: 0;
|
||||
z-index: 400;
|
||||
}
|
||||
.sidebar-hidden #body {
|
||||
.mobile-support.sidebar-flyout #body {
|
||||
margin-left: 230px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.sidebar-hidden #sidebar-overlay {
|
||||
.mobile-support.sidebar-flyout #sidebar-overlay{
|
||||
background-color: rgba(134, 134, 134, 0.5);
|
||||
bottom: 0;
|
||||
cursor: pointer;
|
||||
|
@ -1064,8 +1103,9 @@ a[aria-disabled="true"] {
|
|||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
z-index: 500;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.copy-to-clipboard-button {
|
||||
|
@ -1253,14 +1293,24 @@ option {
|
|||
|
||||
/* Table of contents */
|
||||
|
||||
.progress {
|
||||
.toc-flyout #toc-overlay{
|
||||
bottom: 0;
|
||||
cursor: pointer;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 470;
|
||||
}
|
||||
|
||||
.toc-flyout .progress {
|
||||
background-color: #ffffff; /* var(--MAIN-BG-color) */
|
||||
border: thin solid rgba( 134, 134, 134, .166 );
|
||||
box-shadow: 1px 2px 5px 1px rgba( 134, 134, 134, .2 );
|
||||
display: none;
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: auto;
|
||||
z-index: 200;
|
||||
z-index: 490;
|
||||
}
|
||||
|
||||
.progress .wrapper {
|
||||
|
@ -1510,6 +1560,11 @@ h6 a {
|
|||
.showFooter {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* IE can not display the topbar as sticky, so revert the style */
|
||||
#body-inner{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* clears the 'X' from Chrome's search input */
|
||||
|
|
|
@ -96,8 +96,8 @@ a:hover,
|
|||
|
||||
#header-wrapper {
|
||||
background-color: var(--INTERNAL-MENU-HEADER-BG-color);
|
||||
color: var(--INTERNAL-MENU-SEARCH-color);
|
||||
border-color: var(--INTERNAL-MENU-HEADER-BORDER-color);
|
||||
color: var(--INTERNAL-MENU-SEARCH-color);
|
||||
}
|
||||
|
||||
.searchbox {
|
||||
|
|
|
@ -1,3 +1,10 @@
|
|||
var isIE = /*@cc_on!@*/false || !!document.documentMode;
|
||||
if( !isIE ){
|
||||
// we don't support sidebar flyout in IE
|
||||
document.querySelector( 'body' ).classList.add( 'mobile-support' );
|
||||
}
|
||||
var touchsupport = ('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0)
|
||||
|
||||
function switchTab(tabGroup, tabId) {
|
||||
allTabItems = jQuery("[data-tab-group='"+tabGroup+"']");
|
||||
targetTabItems = jQuery("[data-tab-group='"+tabGroup+"'][data-tab-item='"+tabId+"']");
|
||||
|
@ -49,104 +56,6 @@ function restoreTabSelections() {
|
|||
}
|
||||
}
|
||||
|
||||
function initStickyHeader(){
|
||||
var markSticky = function(){
|
||||
// add marker when not in top position; allows users
|
||||
// to change styles (eg. add a dropshadow)
|
||||
if ($(this).scrollTop() == 0) {
|
||||
$('#topbar').removeClass("is-sticky");
|
||||
}
|
||||
else {
|
||||
$('#topbar').addClass("is-sticky");
|
||||
}
|
||||
};
|
||||
markSticky();
|
||||
$(window).scroll( markSticky );
|
||||
|
||||
/**
|
||||
* Fix anchor scrolling that hides behind sticky top nav bar
|
||||
* Courtesy of https://stackoverflow.com/a/13067009/28106
|
||||
*
|
||||
* We could use pure css for this if only heading anchors were
|
||||
* involved, but this works for any anchor, including footnotes
|
||||
**/
|
||||
(function (document, history, location) {
|
||||
var HISTORY_SUPPORT = !!(history && history.pushState);
|
||||
|
||||
var anchorScrolls = {
|
||||
ANCHOR_REGEX: /^#[^ ]+$/,
|
||||
OFFSET_HEIGHT_PX: 50,
|
||||
|
||||
/**
|
||||
* Establish events, and fix initial scroll position if a hash is provided.
|
||||
*/
|
||||
init: function () {
|
||||
this.scrollToCurrent();
|
||||
$(window).on('hashchange', $.proxy(this, 'scrollToCurrent'));
|
||||
$('body').on('click', 'a', $.proxy(this, 'delegateAnchors'));
|
||||
},
|
||||
|
||||
/**
|
||||
* Return the offset amount to deduct from the normal scroll position.
|
||||
* Modify as appropriate to allow for dynamic calculations
|
||||
*/
|
||||
getFixedOffset: function () {
|
||||
return this.OFFSET_HEIGHT_PX;
|
||||
},
|
||||
|
||||
/**
|
||||
* If the provided href is an anchor which resolves to an element on the
|
||||
* page, scroll to it.
|
||||
* @param {String} href
|
||||
* @return {Boolean} - Was the href an anchor.
|
||||
*/
|
||||
scrollIfAnchor: function (href, pushToHistory) {
|
||||
var match, anchorOffset;
|
||||
|
||||
if (!this.ANCHOR_REGEX.test(href)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
match = document.getElementById(href.slice(1));
|
||||
|
||||
if (match) {
|
||||
anchorOffset = $(match).offset().top - this.getFixedOffset();
|
||||
$('html, body').animate({ scrollTop: anchorOffset });
|
||||
|
||||
// Add the state to history as-per normal anchor links
|
||||
if (HISTORY_SUPPORT && pushToHistory) {
|
||||
history.pushState({}, document.title, location.pathname + href);
|
||||
}
|
||||
}
|
||||
|
||||
return !!match;
|
||||
},
|
||||
|
||||
/**
|
||||
* Attempt to scroll to the current location's hash.
|
||||
*/
|
||||
scrollToCurrent: function (e) {
|
||||
if (this.scrollIfAnchor(window.location.hash) && e) {
|
||||
e.preventDefault();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* If the click event's target was an anchor, fix the scroll position.
|
||||
*/
|
||||
delegateAnchors: function (e) {
|
||||
var elem = e.target;
|
||||
|
||||
if (this.scrollIfAnchor(elem.getAttribute('href'), true)) {
|
||||
e.preventDefault();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
$(document).ready($.proxy(anchorScrolls, 'init'));
|
||||
})(window.document, window.history, window.location);
|
||||
}
|
||||
|
||||
function initMermaid() {
|
||||
$('code.language-mermaid').each(function(index, element) {
|
||||
var content = $(element).html().replace(/&/g, '&');
|
||||
|
@ -277,15 +186,56 @@ function initArrowNav(){
|
|||
}
|
||||
|
||||
function initMenuScrollbar(){
|
||||
var setMenuHeight = function (){
|
||||
ps && ps.update();
|
||||
};
|
||||
|
||||
var ps = new PerfectScrollbar('#content-wrapper');
|
||||
|
||||
// to inform scrollbar of resizing
|
||||
$(window).resize(function() {
|
||||
setMenuHeight();
|
||||
var content = '#body-inner';
|
||||
if( isIE ){
|
||||
// IE can not display the topbar as sticky; so we let
|
||||
// the whole body scroll instead of just the content
|
||||
content = '#body';
|
||||
}
|
||||
var autofocus = false;
|
||||
document.addEventListener('keydown', function(){
|
||||
// for initial keyboard scrolling support, no element
|
||||
// may be hovered, but we still want to react on
|
||||
// cursor/page up/down. because we can't hack
|
||||
// the scrollbars implementation, we try to trick
|
||||
// it and give focus to the scrollbar - only
|
||||
// to just remove the focus right after scrolling
|
||||
// happend
|
||||
var p = document.querySelector(content).matches(':hover');
|
||||
var m = document.querySelector('#content-wrapper').matches(':hover');
|
||||
if( !p && !m ){
|
||||
// only do this hack if none of our scrollbars
|
||||
// is hovered
|
||||
autofocus = true;
|
||||
// if we are showing the sidebar as a flyout we
|
||||
// want to scroll the content-wrapper, otherwise we want
|
||||
// to scroll the body
|
||||
var n = document.querySelector('body').matches('.sidebar-flyout');
|
||||
if( n ){
|
||||
psm.scrollbarY.focus();
|
||||
}
|
||||
else{
|
||||
psc.scrollbarY.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
// scrollbars will install their own keyboard handlers
|
||||
// that need to be executed inbetween our own handlers
|
||||
var psm = new PerfectScrollbar('#content-wrapper');
|
||||
var psc = new PerfectScrollbar(content);
|
||||
window.addEventListener('resize', function(){
|
||||
psm && psm.update();
|
||||
psc && psc.update();
|
||||
});
|
||||
document.addEventListener('keydown', function(){
|
||||
// if we facked initial scrolling, we want to
|
||||
// remove the focus to not leave visual markers on
|
||||
// the scrollbar
|
||||
if( autofocus ){
|
||||
psc.scrollbarY.blur();
|
||||
psm.scrollbarY.blur();
|
||||
autofocus = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -345,26 +295,77 @@ function initImageStyles(){
|
|||
}
|
||||
|
||||
function initToc(){
|
||||
var touchsupport = ('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0)
|
||||
if (touchsupport){
|
||||
$('#toc-menu').click(function() {
|
||||
$('.progress').stop(true, false, true).fadeToggle(100);
|
||||
});
|
||||
$('.progress').click(function() {
|
||||
$('.progress').stop(true, false, true).fadeToggle(100);
|
||||
});
|
||||
function showNav(){
|
||||
var b = document.querySelector( 'body' );
|
||||
b.classList.toggle( 'sidebar-flyout' );
|
||||
var n = b.matches('.sidebar-flyout');
|
||||
if( n ){
|
||||
b.classList.remove( 'toc-flyout' );
|
||||
}
|
||||
}
|
||||
function showToc(){
|
||||
var b = document.querySelector( 'body' );
|
||||
b.classList.toggle( 'toc-flyout' );
|
||||
}
|
||||
else{
|
||||
$('#toc-menu').hover(function() {
|
||||
$('.progress').stop(true, false, true).fadeToggle(100);
|
||||
});
|
||||
|
||||
$('.progress').hover(function() {
|
||||
$('.progress').stop(true, false, true).fadeToggle(100);
|
||||
});
|
||||
document.querySelector( '#sidebar-overlay' ).addEventListener( 'click', showNav );
|
||||
document.querySelector( '#sidebar-toggle' ).addEventListener( 'click', showNav );
|
||||
document.querySelector( '#toc-overlay' ).addEventListener( 'click', showToc );
|
||||
var t = document.querySelector( '#toc-menu' );
|
||||
var p = document.querySelector( '.progress' );
|
||||
if( t && p ){
|
||||
// we may not have a toc
|
||||
t.addEventListener( 'click', showToc );
|
||||
p.addEventListener( 'click', showToc );
|
||||
}
|
||||
}
|
||||
|
||||
function initSwipeHandler(){
|
||||
if( !touchsupport ){
|
||||
return;
|
||||
}
|
||||
|
||||
var startx = null;
|
||||
var starty = null;
|
||||
var handleStartX = function(evt) {
|
||||
startx = evt.touches[0].clientX;
|
||||
starty = evt.touches[0].clientY;
|
||||
return false;
|
||||
};
|
||||
var handleMoveX = function(evt) {
|
||||
if( startx !== null ){
|
||||
var diffx = startx - evt.touches[0].clientX;
|
||||
var diffy = starty - evt.touches[0].clientY || .1 ;
|
||||
if( diffx / Math.abs( diffy ) < 2 ){
|
||||
// detect mostly vertical swipes and reset our starting pos
|
||||
// to not detect a horizontal move if vertical swipe is unprecise
|
||||
startx = evt.touches[0].clientX;
|
||||
}
|
||||
else if( diffx > 30 ){
|
||||
startx = null;
|
||||
starty = null;
|
||||
jQuery(document.body).toggleClass('sidebar-flyout');
|
||||
}
|
||||
}
|
||||
return false;
|
||||
};
|
||||
var handleEndX = function(evt) {
|
||||
startx = null;
|
||||
starty = null;
|
||||
return false;
|
||||
};
|
||||
|
||||
document.querySelector( '#sidebar-overlay' ).addEventListener("touchstart", handleStartX, false);
|
||||
document.querySelector( '#sidebar' ).addEventListener("touchstart", handleStartX, false);
|
||||
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchstart", handleStartX); }, false);
|
||||
document.querySelector( '#sidebar-overlay' ).addEventListener("touchmove", handleMoveX, false);
|
||||
document.querySelector( '#sidebar' ).addEventListener("touchmove", handleMoveX, false);
|
||||
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchmove", handleMoveX); }, false);
|
||||
document.querySelector( '#sidebar-overlay' ).addEventListener("touchend", handleEndX, false);
|
||||
document.querySelector( '#sidebar' ).addEventListener("touchend", handleEndX, false);
|
||||
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchend", handleEndX); }, false);
|
||||
}
|
||||
|
||||
function scrollToActiveMenu() {
|
||||
window.setTimeout(function(){
|
||||
var e = $("#sidebar ul.topics li.active a")[0];
|
||||
|
@ -373,7 +374,7 @@ function scrollToActiveMenu() {
|
|||
block: 'center',
|
||||
});
|
||||
}
|
||||
}, 200);
|
||||
}, 10);
|
||||
}
|
||||
|
||||
// Get Parameters from some url
|
||||
|
@ -422,29 +423,18 @@ var getUrlParameter = function getUrlParameter(sPageURL) {
|
|||
})(jQuery, 'smartresize');
|
||||
|
||||
jQuery(function() {
|
||||
restoreTabSelections();
|
||||
initStickyHeader();
|
||||
initMermaid();
|
||||
initAnchorClipboard();
|
||||
initCodeClipboard();
|
||||
initArrowNav();
|
||||
initMermaid();
|
||||
initMenuScrollbar();
|
||||
scrollToActiveMenu();
|
||||
initLightbox();
|
||||
initImageStyles();
|
||||
initToc();
|
||||
scrollToActiveMenu();
|
||||
initAnchorClipboard();
|
||||
initCodeClipboard();
|
||||
restoreTabSelections();
|
||||
initSwipeHandler();
|
||||
|
||||
var sidebarStatus = 'open';
|
||||
jQuery('#sidebar-overlay').on('click', function() {
|
||||
jQuery(document.body).toggleClass('sidebar-hidden');
|
||||
sidebarStatus = (jQuery(document.body).hasClass('sidebar-hidden') ? 'closed' : 'open');
|
||||
return false;
|
||||
});
|
||||
jQuery('[data-sidebar-toggle]').on('click', function() {
|
||||
jQuery(document.body).toggleClass('sidebar-hidden');
|
||||
sidebarStatus = (jQuery(document.body).hasClass('sidebar-hidden') ? 'closed' : 'open');
|
||||
return false;
|
||||
});
|
||||
jQuery('[data-clear-history-toggle]').on('click', function() {
|
||||
sessionStorage.clear();
|
||||
location.reload();
|
||||
|
|
Loading…
Reference in a new issue