OpenSource/LoveIt
1
0
Fork 0
mirror of https://github.com/dillonzq/LoveIt.git synced 2025-01-06 02:45:31 +01:00
Code Issues Projects Releases Packages Wiki Activity

fix: mobile nav backgroud and new style

Browse source
This commit is contained in:
Dillon 2019-08-19 21:14:15 +08:00
parent dcbc7547fc
commit 6d0116b883
5 changed files with 61 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
assets/css/_core/_media.scss
View file

@ -19,6 +19,7 @@
margin: 0;
height: 4.5em;
line-height: 4.5em;
background: $global-background-color;
.navbar-header {
display: flex;
@ -89,6 +90,7 @@
.menu {
text-align: center;
background: $global-background-color;
border-top: 2px solid $global-font-color;
display: none;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1), 0px 4px 8px rgba(0, 0, 0, 0.1);
@ -103,9 +105,14 @@
}
.dark-theme & {
background: $global-background-color-dark;
border-top: 2px solid $global-font-color-dark;
}
}
.dark-theme & {
background: $global-background-color-dark !important;
}
}
}

5
assets/css/_page/_post.scss
View file

@ -42,8 +42,8 @@
.post-toc {
position: absolute;
width: 200px;
max-width: 240px;
width: 240px;
max-width: 300px;
margin-left: 800px;
padding: 10px;
border-left: 1px solid $global-border-color;
@ -244,6 +244,7 @@
color: $post-link-color-dark;
}
}
&:after {
content: "#blockquote" attr(cite);
display: block;

2
assets/css/_page/_posts.scss
View file

@ -62,7 +62,7 @@
padding-top: .2em;
font-size: 0.9em;
width: 100%;
max-height: 100px;
max-height: 108px;
overflow: hidden;
h2,

85
assets/js/main.js
View file

@ -43,7 +43,7 @@ jQuery(function($) {
};
_Blog.responsiveTable = function() {
const tables = document.querySelectorAll('.post-content > table');
const tables = document.querySelectorAll('.post-content table');
for (let i = 0; i < tables.length; i++) {
const table = tables[i];
const wrapper = document.createElement('div');
@ -54,16 +54,14 @@ jQuery(function($) {
};
_Blog._initToc = function() {
const SPACING = 20;
const $toc = $('.post-toc');
const $footer = $('.post-footer');
if ($toc.length) {
if ($('.post-toc').length) {
const SPACING = 20;
const $toc = $('.post-toc');
const $footer = $('.post-footer');
const minTop = $toc.position().top;
const mainTop = $('main').position().top;
const minScrollTop = minTop + mainTop - SPACING;
$(window).scroll(function() {
const changeTocState = function() {
const scrollTop = $(window).scrollTop();
const maxTop = $footer.position().top - $toc.height();
const maxScrollTop = maxTop + mainTop - SPACING;
@ -90,46 +88,47 @@ jQuery(function($) {
} else {
$toc.css(tocState.process);
}
});
}
const HEADERFIX = 60;
const $toclink = $('.toc-link');
const $headerlink = $('.headerlink');
const $tocLinkLis = $('.post-toc-content li');
const activeIndex = function() {
const scrollTop = $(window).scrollTop();
const headerlinkTop = $.map($headerlink, function(link) {
return $(link).offset().top;
});
const headerLinksOffsetForSearch = $.map(headerlinkTop, function(offset) {
return offset - HEADERFIX;
});
const searchActiveTocIndex = function(array, target) {
for (let i = 0; i < array.length - 1; i++) {
if (target > array[i] && target <= array[i + 1]) return i;
}
if (target > array[array.length - 1]) return array.length - 1;
return 0;
};
changeTocState();
$(window).scroll(changeTocState);
const activeTocIndex = searchActiveTocIndex(headerLinksOffsetForSearch, scrollTop);
const HEADERFIX = 100;
const $toclink = $('.toc-link');
const $headerlink = $('.headerlink');
const $tocLinkLis = $('.post-toc-content li');
const activeIndex = function() {
const scrollTop = $(window).scrollTop();
const headerlinkTop = $.map($headerlink, function(link) {
return $(link).offset().top;
});
const headerLinksOffsetForSearch = $.map(headerlinkTop, function(offset) {
return offset - HEADERFIX;
});
const searchActiveTocIndex = function(array, target) {
for (let i = 0; i < array.length - 1; i++) {
if (target > array[i] && target <= array[i + 1]) return i;
}
if (target > array[array.length - 1]) return array.length - 1;
return 0;
};
$($toclink).removeClass('active');
$($tocLinkLis).removeClass('has-active');
const activeTocIndex = searchActiveTocIndex(headerLinksOffsetForSearch, scrollTop);
if (activeTocIndex !== -1) {
$($toclink[activeTocIndex]).addClass('active');
let ancestor = $toclink[activeTocIndex].parentNode;
while (ancestor.tagName !== 'NAV') {
$(ancestor).addClass('has-active');
ancestor = ancestor.parentNode.parentNode;
$($toclink).removeClass('active');
$($tocLinkLis).removeClass('has-active');
if (activeTocIndex !== -1) {
$($toclink[activeTocIndex]).addClass('active');
let ancestor = $toclink[activeTocIndex].parentNode;
while (ancestor.tagName !== 'NAV') {
$(ancestor).addClass('has-active');
ancestor = ancestor.parentNode.parentNode;
}
}
}
};
activeIndex();
$(window).scroll(activeIndex);
};
activeIndex();
$(window).scroll(activeIndex);
}
};
_Blog.toc = function() {

9
layouts/_default/summary.html
View file

@ -37,7 +37,14 @@
{{ if .Params.show_description }}
<p>{{ . }}</p>
{{ else }}
{{ .Summary }}
{{ $summary := .Summary }}
{{ $REin := `:\(([\w- ]+?)\):` }}
{{ $REout := `<i class="inline-icon $1"></i>` }}
{{ $summary = replaceRE $REin $REout $summary }}
{{ $REin = `\[(.+?)\]\^\((.+?)\)` }}
{{ $REout = `<strong><ruby>$1<rt>$2</rt></ruby></strong>` }}
{{ $summary = replaceRE $REin $REout $summary }}
{{ $summary | safeHTML }}
{{ end }}
</div>
<div class="post-footer">