Skip to content

Commit 0e7dd3f

Browse files
committed
make it a bit more prettier
1 parent b05a527 commit 0e7dd3f

13 files changed

+57
-36
lines changed

src/_includes/layouts/blog.njk

+12-4
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,20 @@
99

1010
{% include 'snippets/navbar.njk' %}
1111

12-
<main class="container py-5">
13-
{% include 'snippets/maincontent.njk' %}
12+
<main class="container py-vh-4 pb-0">
13+
<div class="row d-flex justify-content-center">
14+
<div class="col-12 col-lg-10 col-xl-8">
15+
{% include 'snippets/maincontent.njk' %}
16+
</div>
17+
</div>
1418
</main>
1519

16-
<div class="container">
17-
{% include 'snippets/postloop.njk' %}
20+
<div class="container py-vh-4">
21+
<div class="row d-flex justify-content-center">
22+
<div class="col-12 col-lg-10 col-xl-8">
23+
{% include 'snippets/postloop.njk' %}
24+
</div>
25+
</div>
1826
</div>
1927

2028
<footer class="container">

src/_includes/layouts/default.njk

+6-2
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,12 @@
99

1010
{% include 'snippets/navbar.njk' %}
1111

12-
<main class="container py-5">
13-
{% include 'snippets/maincontent.njk' %}
12+
<main class="container py-vh-5">
13+
<div class="row d-flex justify-content-center">
14+
<div class="col-12 col-lg-10 col-xl-8">
15+
{% include 'snippets/maincontent.njk' %}
16+
</div>
17+
</div>
1418
</main>
1519

1620
<footer class="container">

src/_includes/layouts/post.njk

+7-3
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,16 @@
55
{% include 'snippets/head.njk' %}
66
</head>
77

8-
<body>
8+
<body>
99

1010
{% include 'snippets/navbar.njk' %}
1111

12-
<main class="container">
13-
{% include 'snippets/postcontent.njk' %}
12+
<main class="container py-vh-5">
13+
<div class="row d-flex justify-content-center">
14+
<div class="col-12 col-lg-10 col-xl-8">
15+
{% include 'snippets/postcontent.njk' %}
16+
</div>
17+
</div>
1418
</main>
1519

1620
<footer class="container">
+3-7
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,4 @@
1-
<div class="row d-flex justify-content-center">
2-
<div class="col-12">
3-
<header>
1+
<header>
42
<h1 class="display-1">{{ title }}</h1>
5-
</header>
6-
{{ content | safe }}
7-
</div>
8-
</div>
3+
</header>
4+
{{ content | safe }}

src/_includes/snippets/postcontent.njk

+6-7
Original file line numberDiff line numberDiff line change
@@ -13,16 +13,15 @@
1313
<p>Published
1414
<time datetime="{{ page.date | htmlDateString }}">{{ page.date | readableDate }}</time>
1515
</p>
16-
<p>
17-
{% for tag in post.data.tags | filterTagList %}
18-
{% set tagUrl %}/tags/{{ tag | slug }}/{% endset %}
19-
<a href="{{ tagUrl | url }}" class="post-tag">{{ tag }}</a>
20-
{% endfor %}
21-
</p>
16+
{%- for tag in tags | filterTagList -%}
17+
{%- set tagUrl %}/tags/{{ tag | slug }}/{% endset -%}
18+
<a href="{{ tagUrl | url }}" class="btn btn-outline-dark btn-sm me-2">{{ tag }}</a>
19+
{%- endfor %}
20+
2221
{% endblock %}
2322
</header>
2423
<p class="lead">
25-
{{ intro }}
24+
{{ summary }}
2625
</p>
2726
{{ content | safe }}
2827
</article>

src/_includes/snippets/postloop.njk

+10-5
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,18 @@
11
<div class="row d-flex justify-content-center">
22
<div class="col-12">
33
{%- for post in posts %}
4-
<div class=" border-top py-5">
5-
<h2>{{ post.data.title}}</h2>
6-
<time datetime="{{ post.date | htmlDateString }}">{{ post.date | readableDate }}</time>
4+
<div class="py-5">
5+
<a href="{{ post.url | url }}" class="text-decoration-none text-dark"><h2 class="display-3">{{ post.data.title}}</h2></a>
6+
<hr/>
7+
<p>Published
8+
<time datetime="{{ post.date | htmlDateString }}">{{ post.date | readableDate }}</time>
9+
</p>
10+
<p>
711
{% for tag in post.data.tags | filterTagList %}
812
{% set tagUrl %}/tags/{{ tag | slug }}/{% endset %}
9-
<a href="{{ tagUrl | url }}" class="post-tag">{{ tag }}</a>
13+
<a href="{{ tagUrl | url }}" class="btn btn-outline-dark btn-sm me-2">{{ tag }}</a>
1014
{% endfor %}
15+
</p>
1116
<p>{{ post.data.summary }}</p>
1217
<a href="{{ post.url | url }}" class="link-fancy">Read more...</a>
1318
</div>
@@ -20,7 +25,7 @@
2025
<div class="row d-flex justify-content-between">
2126
<div class="col">
2227
{% if pagination.href.previous %}
23-
<a href="{{pagination.href.previous}}"><< Previous Page</a> {% endif %} </div> <div class="col text-end"> {% if pagination.href.next %} <a href="{{pagination.href.next}}">Next Page >></a>
28+
<a href="{{pagination.href.previous}}" class="btn btn-outline-primary">< Previous Page</a> {% endif %} </div> <div class="col text-end"> {% if pagination.href.next %} <a href="{{pagination.href.next}}" class="btn btn-outline-primary">Next Page ></a>
2429
{% endif %}
2530
</div>
2631
</div>

src/default.njk

+7-2
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@
22
layout: layouts/default.njk
33
title: A simple sample page
44
---
5-
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
6-
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
5+
<hr/><p class="lead">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
6+
</p>
7+
<hr/>
8+
<h2>Dolor sitam est?</h2>
9+
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
10+
<h2>At vero eos</h2>
11+
<p>At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
712
</p>

src/posts/post1.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
title: Post 1
33
date: Created
4-
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
4+
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat diam voluptua.
55
tags:
66
- hello
77
---

src/posts/post2.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
title: Post 2
33
date: Created
4-
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
4+
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.
55
---
66

77
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

src/posts/post3.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
title: Post 3
33
date: Created
4-
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
4+
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
55
tags:
66
- test
77
- hello

src/posts/post4.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
title: Post 4
33
date: Created
4-
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
4+
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat. sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
55
tags:
66
- hello
77
- nice

src/posts/post5.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
title: Post 5
33
date: Created
4-
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
4+
summary: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat
55
tags:
66
- hello
77
- nice

src/tagslist.njk

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
---
22
permalink: /tags/
33
layout: layouts/default.njk
4+
title: Tags List
45
---
5-
<h1>Tags</h1>
66

77
{% for tag in collections.tagList %}
88
{% set tagUrl %}/tags/{{ tag | slug }}/{% endset %}

0 commit comments

Comments
 (0)