ie11 support, grid bug fix
This commit is contained in:
parent
45fbc4c86d
commit
541bbd576d
|
@ -121,6 +121,7 @@ dfn {
|
|||
figcaption {
|
||||
font-style: italic;
|
||||
font-size: 0.9rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
@include themify($themes) {
|
||||
color: themed("figcaption-color");
|
||||
|
|
|
@ -5,11 +5,13 @@
|
|||
@include flex-direction(column);
|
||||
|
||||
width: 100%;
|
||||
max-width: 928px;
|
||||
font-family: $title-font;
|
||||
|
||||
&__photo {
|
||||
border-radius: 0.25rem;
|
||||
width: 100%;
|
||||
max-width: 250px;
|
||||
height: auto;
|
||||
@include box-shadow(0, 2px, 4px, 0, rgba(0, 0, 0, 0.25));
|
||||
@include animation('slide-in-down-little .2s .6s 1 ease-in both');
|
||||
|
|
|
@ -0,0 +1,44 @@
|
|||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
.header {
|
||||
padding-top: 3rem;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.showcase {
|
||||
&__nav {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
&__box {
|
||||
min-width: 270px;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar {
|
||||
&__slide-down {
|
||||
svg {
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.theme-mobile {
|
||||
top: 3px;
|
||||
right: 77px;
|
||||
}
|
||||
|
||||
.copy-to-clipboard {
|
||||
&::after {
|
||||
content: 'copy';
|
||||
font-family: $title-font;
|
||||
font-size: 9px;
|
||||
border: 1px solid #aaa;
|
||||
border-radius: 0.125rem;
|
||||
position: absolute;
|
||||
padding: 0 0.1rem;
|
||||
right: 1px;
|
||||
top: -1px;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -2,6 +2,7 @@
|
|||
position: relative;
|
||||
border-radius: 0.25rem;
|
||||
height: 35px;
|
||||
max-width: 928px;
|
||||
z-index: z('search');
|
||||
margin-bottom: 0.5rem;
|
||||
|
||||
|
@ -36,7 +37,7 @@
|
|||
@include truncate($grid_main_side_width + $grid_main_side_unit);
|
||||
@include themify($themes) {
|
||||
color: themed("search-color");
|
||||
background-color: inherit;
|
||||
background-color: themed("search-background-color");
|
||||
@include input-placeholder {
|
||||
font-family: $title-font;
|
||||
color: themed("search-placeholder-color");
|
||||
|
@ -89,10 +90,6 @@
|
|||
}
|
||||
|
||||
#search-results {
|
||||
@include themify($themes) {
|
||||
// @include webkit-scrollbars(themed('custom-scrollbar-foreground-color'), themed('custom-scrollbar-background-color'));
|
||||
}
|
||||
|
||||
&.dropdown {
|
||||
display: none;
|
||||
&.is-active {
|
||||
|
@ -143,8 +140,10 @@
|
|||
|
||||
.mobile-search {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: z('modal');
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
@include themify($themes) {
|
||||
|
@ -169,6 +168,7 @@
|
|||
height: $grid_navbar_height;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
|
||||
@include flexbox();
|
||||
|
@ -203,7 +203,7 @@
|
|||
}
|
||||
|
||||
&__body {
|
||||
width: 100%;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
overflow-y: auto;
|
||||
|
||||
|
|
|
@ -79,6 +79,8 @@
|
|||
|
||||
.summary-classic {
|
||||
padding: 0 1rem;
|
||||
@include flexbox();
|
||||
@include flex-direction(column);
|
||||
@include animation('slide-in-down .2s .3s 1 ease-in both');
|
||||
|
||||
.title {
|
||||
|
@ -116,6 +118,8 @@
|
|||
}
|
||||
|
||||
&__content {
|
||||
width: 100%;
|
||||
|
||||
@include flexbox();
|
||||
@include flex-direction(column);
|
||||
@include justify-content(flex-start);
|
||||
|
@ -142,7 +146,7 @@
|
|||
padding: 0.25rem;
|
||||
margin-right: .5rem;
|
||||
|
||||
@include transition(all, 0.25s, ease-in);
|
||||
@include transition(all, 0.2s, ease-out);
|
||||
@include align-self(center);
|
||||
@include on-event {
|
||||
@include box-shadow(1px, 1px, 3px, 0px, rgba(0, 0, 0, 0.25));
|
||||
|
|
|
@ -50,10 +50,10 @@
|
|||
@include align-items(center);
|
||||
@include justify-content(center);
|
||||
@include themify($themes) {
|
||||
color: themed('gtt-color');
|
||||
color: themed('gtt-color');
|
||||
background-color: themed('gtt-background-color');
|
||||
@include on-event {
|
||||
color: themed('gtt-hover-color');
|
||||
color: themed('gtt-hover-color');
|
||||
background-color: themed('gtt-hover-background-color');
|
||||
}
|
||||
}
|
||||
|
@ -65,8 +65,15 @@
|
|||
border: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: inherit;
|
||||
background-color: inherit;
|
||||
|
||||
@include themify($themes) {
|
||||
color: themed('gtt-color');
|
||||
background-color: themed('gtt-background-color');
|
||||
@include on-event {
|
||||
color: themed('gtt-hover-color');
|
||||
background-color: themed('gtt-hover-background-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-content {
|
||||
|
|
|
@ -26,6 +26,13 @@
|
|||
}
|
||||
|
||||
&__slide-down {
|
||||
@include themify($themes) {
|
||||
background-color: themed('navbar-background-color');
|
||||
@include on-event {
|
||||
background-color: themed('navbar-menu-hover-background-color');
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 769px) {
|
||||
@for $i from 1 through 8 {
|
||||
&:nth-child(#{$i}) {
|
||||
|
@ -43,7 +50,7 @@
|
|||
@include flex-shrink(0);
|
||||
}
|
||||
|
||||
&__burger {
|
||||
&__burger {
|
||||
display: none;
|
||||
position: relative;
|
||||
|
||||
|
@ -62,7 +69,7 @@
|
|||
span {
|
||||
@include themify($themes) {
|
||||
background-color: themed('burger-menu-color');
|
||||
}
|
||||
}
|
||||
|
||||
border-radius: 1rem;
|
||||
display: block;
|
||||
|
@ -93,7 +100,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
// Modifers
|
||||
&.is-active {
|
||||
display: block;
|
||||
span {
|
||||
|
@ -205,13 +211,15 @@
|
|||
|
||||
&.is-active {
|
||||
position: absolute;
|
||||
top: $grid_navbar_height;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
overflow: hidden;
|
||||
|
||||
@include flexbox();
|
||||
@include flex-direction(column);
|
||||
@include align-items(flex-start);
|
||||
top: 100%;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
overflow: hidden;
|
||||
@include themify($themes) {
|
||||
border-top: 1px solid themed('navbar-border-bottom-color');
|
||||
background-color: themed('navbar-mobile-background-color');
|
||||
|
|
|
@ -71,6 +71,7 @@ $cursive-font: {{ .Site.Data.font.cursive_font }};
|
|||
@import 'components/box';
|
||||
@import 'components/modal';
|
||||
@import 'components/tab';
|
||||
@import 'components/ie';
|
||||
|
||||
@import 'pages/404';
|
||||
@import 'pages/about';
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -4,6 +4,7 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title>{{ block "title" . }}{{ .Title }} – {{ .Site.Title }}{{ end }}</title>
|
||||
{{ partial "head/scripts" . }}
|
||||
{{ partialCached "head/styles" . }}
|
||||
|
@ -17,7 +18,7 @@
|
|||
<script>
|
||||
var localTheme = localStorage.getItem('theme');
|
||||
if (localTheme) {
|
||||
document.getElementById('root').className = `theme__${localTheme}`;
|
||||
document.getElementById('root').className = 'theme__' + localTheme;
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
@ -33,6 +33,9 @@
|
|||
<script>
|
||||
{{ $sidebarPosition:= .Site.Params.sidebarPosition }}
|
||||
var sidebarPosition = JSON.parse({{ $sidebarPosition | jsonify }});
|
||||
{{ $enableSidebar:= .Site.Params.enableSidebar }}
|
||||
var enableSidebar = JSON.parse({{ $enableSidebar | jsonify }});
|
||||
|
||||
var listMainElem = document.querySelector('.list__main');
|
||||
var listSideElem = document.querySelector('.list__sidebar');
|
||||
|
||||
|
@ -46,16 +49,38 @@
|
|||
}
|
||||
enquire.register("screen and (max-width: 769px)", {
|
||||
match: function () {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
listSideElem.classList.remove(gridSmall);
|
||||
listSideElem.classList.add('hide');
|
||||
if (enableSidebar) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
listSideElem.classList.remove(gridSmall);
|
||||
listSideElem.classList.add('hide');
|
||||
} else {
|
||||
if (listMainElem && !listMainElem.classList.contains(gridFull)) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
}
|
||||
|
||||
if (listSideElem && !listSideElem.classList.contains('hide')) {
|
||||
listSideElem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
},
|
||||
unmatch: function () {
|
||||
listMainElem.classList.remove(gridFull);
|
||||
listMainElem.classList.add(gridBig);
|
||||
listSideElem.classList.add(gridSmall);
|
||||
listSideElem.classList.remove('hide');
|
||||
if (enableSidebar) {
|
||||
listMainElem.classList.remove(gridFull);
|
||||
listMainElem.classList.add(gridBig);
|
||||
listSideElem.classList.add(gridSmall);
|
||||
listSideElem.classList.remove('hide');
|
||||
} else {
|
||||
if (listMainElem && !listMainElem.classList.contains(gridFull)) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
}
|
||||
|
||||
if (listSideElem && !listSideElem.classList.contains('hide')) {
|
||||
listSideElem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementsByClassName('navbar__burger')[0].classList.remove('is-active');
|
||||
document.getElementsByClassName('navbar__menu')[0].classList.remove('is-active');
|
||||
|
|
|
@ -32,6 +32,9 @@
|
|||
<script>
|
||||
{{ $sidebarPosition:= .Site.Params.sidebarPosition }}
|
||||
var sidebarPosition = JSON.parse({{ $sidebarPosition | jsonify }});
|
||||
{{ $enableSidebar:= .Site.Params.enableSidebar }}
|
||||
var enableSidebar = JSON.parse({{ $enableSidebar | jsonify }});
|
||||
|
||||
var listMainElem = document.querySelector('.list__main');
|
||||
var listSideElem = document.querySelector('.list__sidebar');
|
||||
|
||||
|
@ -46,16 +49,38 @@
|
|||
|
||||
enquire.register("screen and (max-width: 769px)", {
|
||||
match: function () {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
listSideElem.classList.remove(gridSmall);
|
||||
listSideElem.classList.add('hide');
|
||||
if (enableSidebar) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
listSideElem.classList.remove(gridSmall);
|
||||
listSideElem.classList.add('hide');
|
||||
} else {
|
||||
if (listMainElem && !listMainElem.classList.contains(gridFull)) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
}
|
||||
|
||||
if (listSideElem && !listSideElem.classList.contains('hide')) {
|
||||
listSideElem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
},
|
||||
unmatch: function () {
|
||||
listMainElem.classList.remove(gridFull);
|
||||
listMainElem.classList.add(gridBig);
|
||||
listSideElem.classList.add(gridSmall);
|
||||
listSideElem.classList.remove('hide');
|
||||
if (enableSidebar) {
|
||||
listMainElem.classList.remove(gridFull);
|
||||
listMainElem.classList.add(gridBig);
|
||||
listSideElem.classList.add(gridSmall);
|
||||
listSideElem.classList.remove('hide');
|
||||
} else {
|
||||
if (listMainElem && !listMainElem.classList.contains(gridFull)) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
}
|
||||
|
||||
if (listSideElem && !listSideElem.classList.contains('hide')) {
|
||||
listSideElem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementsByClassName('navbar__burger')[0].classList.remove('is-active');
|
||||
document.getElementsByClassName('navbar__menu')[0].classList.remove('is-active');
|
||||
|
|
|
@ -30,6 +30,9 @@
|
|||
<script>
|
||||
{{ $sidebarPosition:= .Site.Params.sidebarPosition }}
|
||||
var sidebarPosition = JSON.parse({{ $sidebarPosition | jsonify }});
|
||||
{{ $enableSidebar:= .Site.Params.enableSidebar }}
|
||||
var enableSidebar = JSON.parse({{ $enableSidebar | jsonify }});
|
||||
|
||||
var listMainElem = document.querySelector('.list__main');
|
||||
var listSideElem = document.querySelector('.list__sidebar');
|
||||
|
||||
|
@ -44,16 +47,39 @@
|
|||
|
||||
enquire.register("screen and (max-width: 769px)", {
|
||||
match: function () {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
listSideElem.classList.remove(gridSmall);
|
||||
listSideElem.classList.add('hide');
|
||||
if (enableSidebar) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
listSideElem.classList.remove(gridSmall);
|
||||
listSideElem.classList.add('hide');
|
||||
} else {
|
||||
if (listMainElem && !listMainElem.classList.contains(gridFull)) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
}
|
||||
|
||||
if (listSideElem && !listSideElem.classList.contains('hide')) {
|
||||
listSideElem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
unmatch: function () {
|
||||
listMainElem.classList.remove(gridFull);
|
||||
listMainElem.classList.add(gridBig);
|
||||
listSideElem.classList.add(gridSmall);
|
||||
listSideElem.classList.remove('hide');
|
||||
if (enableSidebar) {
|
||||
listMainElem.classList.remove(gridFull);
|
||||
listMainElem.classList.add(gridBig);
|
||||
listSideElem.classList.add(gridSmall);
|
||||
listSideElem.classList.remove('hide');
|
||||
} else {
|
||||
if (listMainElem && !listMainElem.classList.contains(gridFull)) {
|
||||
listMainElem.classList.remove(gridBig);
|
||||
listMainElem.classList.add(gridFull);
|
||||
}
|
||||
|
||||
if (listSideElem && !listSideElem.classList.contains('hide')) {
|
||||
listSideElem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
|
||||
if (document.getElementsByClassName('navbar__burger')[0]) {
|
||||
document.getElementsByClassName('navbar__burger')[0].classList.remove('is-active');
|
||||
|
|
|
@ -122,7 +122,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||
}
|
||||
|
||||
MicroModal.init({
|
||||
onClose: () => {
|
||||
onClose: function () {
|
||||
if (mySwipe) {
|
||||
mySwipe.kill();
|
||||
mySwipe = null;
|
||||
|
|
|
@ -31,7 +31,7 @@
|
|||
{{ else if eq (lower .) "tumblr" }}
|
||||
<a href="http://tumblr.com/widgets/share/tool?canonicalUrl={{ $ctx.Permalink | absLangURL }}&data-title={{ $ctx.Title }}&data-content={{ $ctx.Description }}" class="donation__item" target="_blank" rel="noreferer">
|
||||
{{ partial "svgs/share/tumblr.svg" (dict "width" 22 "height" 22) }}
|
||||
{{ i18n "linkedin" | default "LinkedIn" }}
|
||||
{{ i18n "tumblr" | default "Tumblr" }}
|
||||
</a>
|
||||
{{ else if eq (lower .) "weibo" }}
|
||||
<a href="javascript:void(function(){var d=document,e=encodeURIComponent,s1=window.getSelection,s2=d.getSelection,s3=d.selection,s=s1?s1():s2?s2():s3?s3.createRange().text:'',r='http://service.weibo.com/share/share.php?url='+e(d.location.href)+'&title='+e(d.title),x=function(){if(!window.open(r,'weibo','toolbar=0,resizable=1,scrollbars=yes,status=1,width=450,height=330'))location.href=r+'&r=1'};if(/Firefox/.test(navigator.userAgent)){setTimeout(x,0)}else{x()}})()" class="donation__item" target="_blank" rel="noreferer">
|
||||
|
|
|
@ -20,6 +20,61 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
// ========================== poiyfill ==========================
|
||||
// forEach
|
||||
if (window.NodeList && !NodeList.prototype.forEach) {
|
||||
NodeList.prototype.forEach = Array.prototype.forEach;
|
||||
}
|
||||
|
||||
// includes
|
||||
if (!String.prototype.includes) {
|
||||
String.prototype.includes = function (search, start) {
|
||||
'use strict';
|
||||
|
||||
if (search instanceof RegExp) {
|
||||
throw TypeError('first argument must not be a RegExp');
|
||||
}
|
||||
if (start === undefined) { start = 0; }
|
||||
return this.indexOf(search, start) !== -1;
|
||||
};
|
||||
}
|
||||
|
||||
// append
|
||||
Document.prototype.append = Element.prototype.append = function append() {
|
||||
this.appendChild(_mutation(arguments));
|
||||
};
|
||||
function _mutation(nodes) {
|
||||
if (!nodes.length) {
|
||||
throw new Error('DOM Exception 8');
|
||||
} else if (nodes.length === 1) {
|
||||
return typeof nodes[0] === 'string' ? document.createTextNode(nodes[0]) : nodes[0];
|
||||
} else {
|
||||
var
|
||||
fragment = document.createDocumentFragment(),
|
||||
length = nodes.length,
|
||||
index = -1,
|
||||
node;
|
||||
|
||||
while (++index < length) {
|
||||
node = nodes[index];
|
||||
|
||||
fragment.appendChild(typeof node === 'string' ? document.createTextNode(node) : node);
|
||||
}
|
||||
|
||||
return fragment;
|
||||
}
|
||||
}
|
||||
|
||||
// startsWith
|
||||
if (!String.prototype.startsWith) {
|
||||
String.prototype.startsWith = function (searchString, position) {
|
||||
position = position || 0;
|
||||
return this.indexOf(searchString, position) === position;
|
||||
};
|
||||
}
|
||||
// ===============================================================
|
||||
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
// ============================ tab ============================
|
||||
document.querySelectorAll('.tab') ?
|
||||
|
@ -54,7 +109,11 @@
|
|||
var gttBtn = document.getElementById("gtt");
|
||||
gttBtn.style.display = "none";
|
||||
gttBtn.addEventListener('click', function () {
|
||||
scrollToTop(250);
|
||||
if (window.document.documentMode) {
|
||||
document.documentElement.scrollTop = 0;
|
||||
} else {
|
||||
scrollToTop(250);
|
||||
}
|
||||
});
|
||||
|
||||
function scrollToTop(scrollDuration) {
|
||||
|
@ -148,7 +207,7 @@
|
|||
});
|
||||
}) : null;
|
||||
|
||||
var curElem = tableOfContentsElem.querySelector(`[href="#${id}"]`);
|
||||
var curElem = tableOfContentsElem.querySelector("[href='#" + id + "']");
|
||||
if (curElem && curElem.nextElementSibling) {
|
||||
curElem.nextElementSibling.style.display = 'block';
|
||||
}
|
||||
|
@ -193,7 +252,7 @@
|
|||
});
|
||||
});
|
||||
|
||||
var curElem = tableOfContentsElem.querySelector(`[href="#${id}"]`);
|
||||
var curElem = tableOfContentsElem.querySelector("[href='#" + id + "']");
|
||||
if (curElem && curElem.nextElementSibling) {
|
||||
curElem.nextElementSibling.style.display = 'block';
|
||||
}
|
||||
|
@ -222,6 +281,8 @@
|
|||
// ========================== navbar ==========================
|
||||
var navbarBurgerElem = document.querySelector('.navbar__burger');
|
||||
var navbarMenuElem = document.querySelector('.navbar__menu');
|
||||
console.log(navbarBurgerElem);
|
||||
console.log(navbarMenuElem);
|
||||
navbarBurgerElem ?
|
||||
navbarBurgerElem.addEventListener('click', function () {
|
||||
if (navbarBurgerElem.classList.contains('is-active')) {
|
||||
|
@ -286,7 +347,8 @@
|
|||
|
||||
mobileSearchInputElem ?
|
||||
mobileSearchInputElem.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Escape') {
|
||||
var keyCode = e.which || e.keyCode;
|
||||
if (e.key === 'Escape' || keyCode === 27) {
|
||||
if (mobileSearchContainer) {
|
||||
mobileSearchContainer.style.display = 'none';
|
||||
}
|
||||
|
@ -332,7 +394,7 @@
|
|||
localStorage.setItem('theme', selectedThemeVariant);
|
||||
|
||||
rootEleme.removeAttribute('class');
|
||||
rootEleme.classList.add(`theme__${selectedThemeVariant}`);
|
||||
rootEleme.classList.add('theme__' + selectedThemeVariant);
|
||||
selectThemeElem.forEach(function(rootElem) {
|
||||
rootElem.querySelectorAll('a').forEach(function (elem) {
|
||||
if (elem.classList) {
|
||||
|
@ -445,7 +507,7 @@
|
|||
});
|
||||
}
|
||||
else {
|
||||
console.error(`[${xhr.status}]Error:`, xhr.statusText);
|
||||
console.error('[' + xhr.status + ']Error:', xhr.statusText);
|
||||
}
|
||||
};
|
||||
xhr.send();
|
||||
|
@ -464,7 +526,7 @@
|
|||
var item = document.createElement('a');
|
||||
item.setAttribute('href', result.uri);
|
||||
item.setAttribute('class', 'dropdown-item');
|
||||
item.innerHTML = `<div class="menu-item"><div class="menu-item__title">📄 ${result.title}</div><div class="menu-item__desc">${result.description ? result.description : result.content}</div></div>`;
|
||||
item.innerHTML = '<div class="menu-item"><div class="menu-item__title">📄 ' + result.title + '</div><div class="menu-item__desc">' + (result.description ? result.description : result.content) + '</div></div>';
|
||||
content.appendChild(item);
|
||||
});
|
||||
} else {
|
||||
|
@ -495,7 +557,7 @@
|
|||
var item = document.createElement('a');
|
||||
item.setAttribute('href', result.item.uri);
|
||||
item.setAttribute('class', 'dropdown-item');
|
||||
item.innerHTML = `<div class="menu-item"><div class="menu-item__title">📄 ${generateHighlightedText(result.item.title, result.matches[0].indices)}</div><div class="menu-item__desc">${result.matches[1] ? generateHighlightedText(result.item.description, result.matches[1].indices) : result.matches[2] ? generateHighlightedText(result.item.content, result.matches[2].indices) : ''}</div></div>`;
|
||||
item.innerHTML = '<div class="menu-item"><div class="menu-item__title">📄 ' + generateHighlightedText(result.item.title, result.matches[0].indices) + '</div><div class="menu-item__desc">' + (result.matches[1] ? generateHighlightedText(result.item.description, result.matches[1].indices) : result.matches[2] ? generateHighlightedText(result.item.content, result.matches[2].indices) : '') + '</div></div>';
|
||||
content.appendChild(item);
|
||||
});
|
||||
} else {
|
||||
|
@ -523,7 +585,7 @@
|
|||
results.forEach(function (result) {
|
||||
var item = document.createElement('a');
|
||||
item.setAttribute('href', result.uri);
|
||||
item.innerHTML = `<div class="mobile-search__item"><div class="mobile-search__item--title">📄 ${result.title}</div><div class="mobile-search__item--desc">${result.description ? result.description : result.content}</div></div>`;
|
||||
item.innerHTML = '<div class="mobile-search__item"><div class="mobile-search__item--title">📄 ' + result.title + '</div><div class="mobile-search__item--desc">' + (result.description ? result.description : result.content) + '</div></div>';
|
||||
content.appendChild(item);
|
||||
});
|
||||
} else {
|
||||
|
@ -548,7 +610,7 @@
|
|||
results.forEach(function (result) {
|
||||
var item = document.createElement('a');
|
||||
item.setAttribute('href', result.item.uri);
|
||||
item.innerHTML = `<div class="mobile-search__item"><div class="mobile-search__item--title">📄 ${generateHighlightedText(result.item.title, result.matches[0].indices)}</div><div class="mobile-search__item--desc">${result.matches[1] ? generateHighlightedText(result.item.description, result.matches[1].indices) : result.matches[2] ? generateHighlightedText(result.item.content, result.matches[2].indices) : ''}</div></div>`;
|
||||
item.innerHTML = '<div class="mobile-search__item"><div class="mobile-search__item--title">📄 ' + generateHighlightedText(result.item.title, result.matches[0].indices) + '</div><div class="mobile-search__item--desc">' + (result.matches[1] ? generateHighlightedText(result.item.description, result.matches[1].indices) : result.matches[2] ? generateHighlightedText(result.item.content, result.matches[2].indices) : '') + '</div></div>';
|
||||
content.appendChild(item);
|
||||
});
|
||||
} else {
|
||||
|
@ -594,6 +656,7 @@
|
|||
var searchElem = document.getElementById('search');
|
||||
var searchMobile = document.getElementById('search-mobile');
|
||||
|
||||
searchElem ?
|
||||
searchElem.addEventListener('input', function(e) {
|
||||
if (!e.target.value) {
|
||||
document.getElementById('search-results').setAttribute('class', 'dropdown');
|
||||
|
@ -611,8 +674,9 @@
|
|||
} else {
|
||||
renderSearchResults(results);
|
||||
}
|
||||
});
|
||||
}) : null;
|
||||
|
||||
searchElem ?
|
||||
searchElem.addEventListener('blur', function() {
|
||||
if (window.innerWidth < 770) {
|
||||
return null;
|
||||
|
@ -620,8 +684,9 @@
|
|||
setTimeout(function () {
|
||||
document.getElementById('search-results').setAttribute('class', 'dropdown');
|
||||
}, 100);
|
||||
});
|
||||
}) : null;
|
||||
|
||||
searchElem ?
|
||||
searchElem.addEventListener('click', function(e) {
|
||||
if (window.innerWidth < 770) {
|
||||
return null;
|
||||
|
@ -638,7 +703,7 @@
|
|||
} else {
|
||||
renderSearchResults(results);
|
||||
}
|
||||
});
|
||||
}) : null;
|
||||
|
||||
function indexInParent(node) {
|
||||
var children = node.parentNode.childNodes;
|
||||
|
@ -656,14 +721,16 @@
|
|||
var items = null;
|
||||
var searchContainerMaxHeight = 350;
|
||||
|
||||
searchElem ?
|
||||
searchElem.addEventListener('keydown', function(e) {
|
||||
if (window.innerWidth < 770) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var items = document.querySelectorAll('#search-menu .dropdown-item');
|
||||
var keyCode = e.which || e.keyCode;
|
||||
|
||||
if (e.key === 'ArrowDown') {
|
||||
if (e.key === 'ArrowDown' || keyCode === 40) {
|
||||
if (activeIndex === null) {
|
||||
activeIndex = 0;
|
||||
items[activeIndex].classList.remove('is-active');
|
||||
|
@ -679,7 +746,7 @@
|
|||
} else if (activeIndex === 0) {
|
||||
document.querySelector(".search-content").scrollTop = 0;
|
||||
}
|
||||
} else if (e.key === 'ArrowUp') {
|
||||
} else if (e.key === 'ArrowUp' || keyCode === 38) {
|
||||
if (activeIndex === null) {
|
||||
activeIndex = items.length - 1;
|
||||
items[activeIndex].classList.remove('is-active');
|
||||
|
@ -695,19 +762,20 @@
|
|||
} else {
|
||||
document.querySelector(".search-content").scrollTop = overflowedPixel + items[activeIndex].getBoundingClientRect().height;
|
||||
}
|
||||
} else if (e.key === 'Enter') {
|
||||
} else if (e.key === 'Enter' || keyCode === 13) {
|
||||
var currentItemLink = items[activeIndex].getAttribute('href');
|
||||
if (currentItemLink) {
|
||||
location.href = currentItemLink;
|
||||
}
|
||||
} else if (e.key === 'Escape') {
|
||||
} else if (e.key === 'Escape' || keyCode === 27) {
|
||||
e.target.value = null;
|
||||
if (searchResults) {
|
||||
searchResults.classList.remove('is-active');
|
||||
}
|
||||
}
|
||||
});
|
||||
}) : null;
|
||||
|
||||
searchMobile ?
|
||||
searchMobile.addEventListener('input', function(e) {
|
||||
if (!e.target.value) {
|
||||
let wrap = document.getElementById('search-mobile-results');
|
||||
|
@ -725,7 +793,7 @@
|
|||
} else {
|
||||
renderSearchResultsMobile(results);
|
||||
}
|
||||
});
|
||||
}) : null;
|
||||
// ============================================================
|
||||
});
|
||||
</script>
|
|
@ -145,7 +145,7 @@
|
|||
});
|
||||
}) : null;
|
||||
|
||||
var curElem = tableOfContentsElem.querySelector(`[href="#${id}"]`);
|
||||
var curElem = tableOfContentsElem.querySelector('[href="#' + id + '"]');
|
||||
if (curElem && curElem.nextElementSibling) {
|
||||
curElem.nextElementSibling.style.display = 'block';
|
||||
}
|
||||
|
@ -328,8 +328,8 @@
|
|||
var isNotAllowedIncluded = false;
|
||||
var curClassName = code.getAttribute('class');
|
||||
|
||||
for (let str of notAllowedClass) {
|
||||
if (curClassName && curClassName.startsWith(str)) {
|
||||
for (var i = 0; i < notAllowedClass.length; i++) {
|
||||
if (curClassName && curClassName.startsWith(notAllowedClass[i])) {
|
||||
isNotAllowedIncluded = true;
|
||||
break;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue