Add pagination links
This commit is contained in:
parent
40cc410369
commit
0632a4ced8
3 changed files with 40 additions and 23 deletions
|
@ -3,7 +3,6 @@
|
|||
Simple blog management system.
|
||||
|
||||
## Todo
|
||||
2. Add pagination links
|
||||
4. Find a nice way to display metadata (author, dates, etc)
|
||||
5. Allow adding pages (pinned articles ?)
|
||||
6. Add syntax coloration to code blocks
|
||||
|
|
|
@ -43,26 +43,32 @@ article.article-list h2 a {
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--accent: #226997;
|
||||
--main: #eeeeee;
|
||||
/*--main2: #cecece;*/
|
||||
/*--main3: #b1b1b1;*/
|
||||
--background: #111111;
|
||||
/*--background2: #575656;*/
|
||||
}
|
||||
|
||||
img {
|
||||
opacity: .75;
|
||||
transition: opacity .5s ease-in-out;
|
||||
}
|
||||
img:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#manage ul ul li img {
|
||||
opacity: 1;
|
||||
filter: invert(1);
|
||||
}
|
||||
.pagination {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--accent: #226997;
|
||||
--main: #eeeeee;
|
||||
/*--main2: #cecece;*/
|
||||
/*--main3: #b1b1b1;*/
|
||||
--background: #111111;
|
||||
/*--background2: #575656;*/
|
||||
}
|
||||
|
||||
img {
|
||||
opacity: .75;
|
||||
transition: opacity .5s ease-in-out;
|
||||
}
|
||||
|
||||
img:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#manage ul ul li img {
|
||||
opacity: 1;
|
||||
filter: invert(1);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -12,4 +12,16 @@
|
|||
{% empty %}
|
||||
<p>No article here. Come back later 🙂</p>
|
||||
{% endfor %}
|
||||
<div class="pagination">
|
||||
<div class="older">
|
||||
{% if page_obj.has_next %}
|
||||
<a href="?page={{ page_obj.next_page_number }}">⇠ Older</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="newer">
|
||||
{% if page_obj.has_previous %}
|
||||
<a href="?page={{ page_obj.previous_page_number }}">Newer ⇢</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
Reference in a new issue