godotengine/godot-website
1
0
Fork 0
mirror of https://github.com/godotengine/godot-website.git synced 2025-12-31 09:48:43 +03:00
Code Issues Packages Projects Releases Wiki Activity

Create next and previous buttons below the articles (#629)

Browse Source 
* Create next and previous buttons below the articles.

* Create next and previous buttons below the articles.

* Update formatting

Co-authored-by: Hugo Locurcio <hugo.locurcio@hugo.pro>

* Update style and add canonical meta tags for prev and next

---------

Co-authored-by: Hugo Locurcio <hugo.locurcio@hugo.pro>
Co-authored-by: Emi <2206700+coppolaemilio@users.noreply.github.com>
This commit is contained in:
Anna
2024-08-26 09:40:50 -04:00
committed by GitHub
parent 93d3f9392f
commit 1112eae03d
1 changed files with 55 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
_layouts/article.html
View File

@@ -154,10 +154,50 @@ layout: default
max-width: 100%;
}
}
/* Blog previous and next links */
.blog-navigation {
display: grid;
grid-template-columns: 1fr 1fr;
padding-top: 30px;
}
.blog-navigation .next {
text-align: right;
}
@media (max-width: 900px) {
.blog-navigation {
grid-template-columns: 1fr;
gap: 20px;
border-top: 1px solid var(--code-background-color);
}
.blog-navigation .next {
text-align: left;
}
}
.blog-navigation span {
opacity: 0.6;
font-weight: 700;
margin-bottom: 5px;
display: block;
}
.blog-navigation a {
display: inline-block;
text-decoration: none;
color: inherit;
opacity: 0.6;
transition: opacity 0.2s;
}
.blog-navigation a:hover {
opacity: 1;
}
</style>
<link rel="stylesheet" href="/assets/css/highlight.obsidian.min.css">
<div class="container">
<article class="padded">
<div class="content article-container">
@@ -208,6 +248,20 @@ layout: default
</div>
</div>
</article>
<div class="blog-navigation">
{% if page.previous.url %}
<div class="previous">
<span>Previous</span>
<a rel="prev" href="{{page.previous.url}}">{{page.previous.title}}</a>
</div>
{% endif %}
{% if page.next.url %}
<div class="next">
<span>Next</span>
<a rel="next" href="{{page.next.url}}">{{page.next.title}}</a>
</div>
{% endif %}
</div>
</div>
<link rel="stylesheet" href="/assets/css/anchor-link.css?1">