fbievan
/
Website-Redesign
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

if navtype is circles and infinite scrolling is enabled load more link looks more like a button, similar to the circles pagination

This commit is contained in:
Gabriele Musco 2021-04-15 00:00:53 +02:00
parent 0d3aeb96fa
commit bc28510322
No known key found for this signature in database
GPG Key ID: 8539FD3454380B83
2 changed files with 40 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
assets/scss/style.scss
View File

@ -416,3 +416,20 @@ ul.list {
}
}
}
.loadMoreButton {
text-align: center;
font-size: 1.2rem;
font-weight: bold;
&.buttonLike {
a {
border-radius: 10px;
background-color: $highlight_bg_color;
padding: 15px;
border-bottom: none;
&:hover, &:focus {
background-color: $accent_color;
}
}
}
}

46
layouts/partials/paginator.html
View File

@ -1,28 +1,28 @@
{{ if .Site.Params.infiniteScrolling }}
{{- partial "js_paginator.html" . -}}
<script>
var nextPage = '/index.json';
function getNext(first=false) {
if (!nextPage) return;
fetch(nextPage).then(res => res.json())
.then(res => {
nextPage = res['next'];
if (first) {
document.getElementById('getNextBtnContainer').innerHTML += `
<div style="text-align: center; font-size: 1.3em; font-weight: bold;">
<a style="cursor: pointer" onclick="getNext();">
Load more articles
</a>
</div>
`;
return;
}
if (!nextPage) document.getElementById('getNextBtnContainer').innerHTML = '';
renderArticles(res['articles']);
});
}
getNext(true);
</script>
<script>
var nextPage = '/index.json';
function getNext(first=false) {
if (!nextPage) return;
fetch(nextPage).then(res => res.json())
.then(res => {
nextPage = res['next'];
if (first) {
document.getElementById('getNextBtnContainer').innerHTML += `
<div class="loadMoreButton {{ if eq .Site.Params.navtype "circles"}}buttonLike{{ end }}">
<a style="cursor: pointer" onclick="getNext();">
Load more articles
</a>
</div>
`;
return;
}
if (!nextPage) document.getElementById('getNextBtnContainer').innerHTML = '';
renderArticles(res['articles']);
});
}
getNext(true);
</script>
{{ end }}
{{ if .Site.Params.infiniteScrolling }}<noscript>{{ end }}
{{ if gt .Paginator.TotalPages 1 }}