andwati/andwati.com
1
0
Fork 0
mirror of https://github.com/andwati/andwati.com.git synced 2026-10-23 19:42:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

completed pagination

Browse Source
This commit is contained in:
andwati
2023-08-13 01:42:45 +03:00
parent 3a8682e8ee
commit dfecd6c7eb
9 changed files with 87 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
content/archive/_index.md
+2 -1
View File
@@ -1,4 +1,5 @@
+++
sort_by = "date"
template= "archive.html"
+++
paginate_by= 10
+++
sass/_codeblocks.scss
+29
View File
@@ -0,0 +1,29 @@
pre {
display: block;
padding: 0.25rem 1.25rem;
font-size: 85%;
border-left: 0.25rem solid var(--primary-accent-color);
}
code {
padding: 0 0.4rem;
// background-color: #3c3836;
background-color: var(--inline-code-background-color);
/* Inline code blocks look less aggresive with a little rounding. */
border-radius: 2px;
}
pre, code {
overflow: auto;
font-family: var(--default-mono-font);
}
/* Without this the <code> tag gains a little padding that offsets text by like
2 pixels. Let's *not* do that. */
pre > code {
padding: 0;
background-color: var(--code-background-color);
// Code inside a pre block doesn't need rounded borders.
border-radius: unset;
}
sass/_pagination.scss
+16
View File
@@ -0,0 +1,16 @@
.pagination{
display: flex;
justify-content: space-between;
align-items: center;
list-style: none;
.page-item .disabled{
opacity: 0.5;
pointer-events: none;
}
.page-numbers{
font-size: 0.9rem;
color: var(--link-color);
}
}
sass/site.scss
+4 -32
View File
@@ -5,10 +5,13 @@
- Serve fonts from the local server rather than Google's API.
- Support a "display title" in an [extra] section to allow for <br> elements
or other manual control over title display. */
@charset "utf-8";
@use '_pagination.scss';
@use '_codeblocks.scss';
@import url('https://fonts.googleapis.com/css?family=Noto+Sans|Noto+Serif|Noto+Sans+Mono');
:root {
/* Fonts and Text Sizes */
--default-serif-font: "Noto Serif", serif;
@@ -165,37 +168,6 @@
color: var(--muted-color);
}
/* ---- Code blocks ---------------------------------------------------------*/
pre {
display: block;
padding: 0.25rem 1.25rem;
font-size: 85%;
border-left: 0.25rem solid var(--primary-accent-color);
}
code {
padding: 0 0.4rem;
// background-color: #3c3836;
background-color: var(--inline-code-background-color);
/* Inline code blocks look less aggresive with a little rounding. */
border-radius: 2px;
}
pre, code {
overflow: auto;
font-family: var(--default-mono-font);
}
/* Without this the <code> tag gains a little padding that offsets text by like
2 pixels. Let's *not* do that. */
pre > code {
padding: 0;
background-color: var(--code-background-color);
// Code inside a pre block doesn't need rounded borders.
border-radius: unset;
}
/* ---- Tables --------------------------------------------------------------*/
table {
templates/archive.html
+2
View File
@@ -1,5 +1,6 @@
{% extends "section.html" %}
{% import "post_macros.html" as page_macros %}
{% import "paginate.html" as paginate_macro %}
{% block content %}
<main id="content">
<header>
@@ -22,6 +23,7 @@
</ul>
</div>
{% endfor %}
{% if paginator %}{{ paginate_macro::paginate() }}{% endif %}
</main>
{% include "footer.html" %}
{% endblock content %}
templates/footer.html
+1 -2
View File
@@ -18,5 +18,4 @@
<a href="https://github.com/andwati/andwati.com">Source</a>
⬡
<a href="/rss.xml">Feed</a>
</p>
</footer>
</footer>
templates/paginate.html
+25
View File
@@ -0,0 +1,25 @@
{% macro paginate() %}
{% if paginator %}
<ul class="pagination">
{% if paginator.previous %}
<li class="page-item page-prev">
<a href="{{ paginator.previous }}" class="page-link">← Prev</a>
</li>
{% else %}
<li class="page-item page-prev">
<span class="page-link disabled" aria-disabled="true">← Prev</span>
</li>
{% endif %}
<li class="page-item page-numbers">{{ paginator.current_index }} of {{ paginator.number_pagers }}</li>
{% if paginator.next %}
<li class="page-item page-next">
<a href="{{ paginator.next }}" class="page-link">Next →</a>
</li>
{% else %}
<li class="page-item page-next">
<span class="page-link disabled" aria-disabled="trues">Next →</span>
</li>
{% endif %}
</ul>
{% endif %}
{% endmacro paginate %}
templates/post_macros.html
+1 -1
View File
@@ -8,7 +8,7 @@
{%- if page.taxonomies.tags | length > 1 and loop.index != page.taxonomies.tags | length -%},{% endif %}
{% endfor %}
{% endif %}
<div class="accent">☕{{ page.reading_time }} minutes 📝 {{ page.word_count }}</div>
<div class="accent">☕ {{ page.reading_time }} minutes 📝 {{ page.word_count }}</div>
</div>
{% endmacro meta %}
{% macro snippet(page) %}
templates/posts.html
+7 -4
View File
@@ -1,15 +1,18 @@
{% extends "section.html" %}
{% import "post_macros.html" as post_macros %}
{% import "paginate.html" as paginate_macro %}
{% block content %}
<main id="content">
<header>
<h1>Posts</h1>
</header>
{% for page in paginator.pages %}{{ post_macros::snippet(page=page) }}{% endfor %}
<nav>
{% if paginator.previous %}<a href="{{ paginator.previous }}" class="previous">Previous</a>{% endif %}
{% if paginator.next %}<a href="{{ paginator.next }}" class="next">Next</a>{% endif %}
</nav>
<!--<div class="pagination">
{% if paginator.previous %}<a href="{{ paginator.previous }}" class="page-item previous">Previous</a>{% endif %}
{% if paginator.next %}<a href="{{ paginator.next }}" class="page-item next">Next</a>{% endif %}
</div>
-->
{% if paginator %}{{ paginate_macro::paginate() }}{% endif %}
</main>
{% include "footer.html" %}
{% endblock content %}