on master help sign in
Adding flattened pagination variables and styles
1e39d58Matilde Park
content/understanding-urbit/_index.md+3
@@ -3,4 +3,7 @@ title = "Understanding Urbit"
3sort_by = "weight"
3sort_by = "weight"
4template = "understanding-urbit/list.html"
4template = "understanding-urbit/list.html"
5page_template = "understanding-urbit/post.html"
5page_template = "understanding-urbit/post.html"
6+[extra]
7+flatten_pagination = "true"
8+hide_next_title = "true"
6+++
9+++
content/understanding-urbit/network-and-os.md+4
@@ -2,6 +2,10 @@
2title = "Urbit OS + Network"
2title = "Urbit OS + Network"
3description = "The Urbit OS + Network + how they work together"
3description = "The Urbit OS + Network + how they work together"
4weight = 5
4weight = 5
5+[extra]
6+flatten_pagination = "true"
7+hide_next_title = "true"
8+hideprevious = "true"
5+++
9+++
6
10
7
11
content/understanding-urbit/project-history.md+4
@@ -2,6 +2,10 @@
2title = "Project Status + History"
2title = "Project Status + History"
3description = "Where we've been and were we are now"
3description = "Where we've been and were we are now"
4weight = 7
4weight = 7
5+[extra]
6+flatten_pagination = "true"
7+hide_next_title = "true"
8+hideprevious = "true"
5+++
9+++
6
10
7Can you move to Urbit today and never look back? Not quite yet. Urbit is still young.
11Can you move to Urbit today and never look back? Not quite yet. Urbit is still young.
content/understanding-urbit/simple-durable-yours.md+4
@@ -2,6 +2,10 @@
2title = "Simple, Durable, Yours"
2title = "Simple, Durable, Yours"
3description = "The core ideas that Urbit is built around"
3description = "The core ideas that Urbit is built around"
4weight = 1
4weight = 1
5+[extra]
6+flatten_pagination = "true"
7+hide_next_title = "true"
8+hideprevious = "true"
5+++
9+++
6
10
7We live in a world dense with computers. We wake up and look at them, we see the world through them, we depend on them completely, and they’re not going away. They’re only becoming more ubiquitous.
11We live in a world dense with computers. We wake up and look at them, we see the world through them, we depend on them completely, and they’re not going away. They’re only becoming more ubiquitous.
content/understanding-urbit/technical-overview.md+4
@@ -2,6 +2,10 @@
2title = "Technical Overview"
2title = "Technical Overview"
3description = "A quick tour of the technology"
3description = "A quick tour of the technology"
4weight = 6
4weight = 6
5+[extra]
6+flatten_pagination = "true"
7+hide_next_title = "true"
8+hideprevious = "true"
5+++
9+++
6
10
7
11
content/understanding-urbit/urbit-id.md+4
@@ -2,6 +2,10 @@
2title = "Urbit ID"
2title = "Urbit ID"
3description = "An overview of the Urbit ID system"
3description = "An overview of the Urbit ID system"
4weight = 4
4weight = 4
5+[extra]
6+flatten_pagination = "true"
7+hide_next_title = "true"
8+hideprevious = "true"
5+++
9+++
6
10
7Every time you post a comment, like something, send a message, or use any app or service, you need an account. (And, behind the scenes, a network address.) Neither of these things belongs to you. The way things are going, they never will. No matter what you’re up to with your phone or laptop, you’re dependent on MEGACORP.
11Every time you post a comment, like something, send a message, or use any app or service, you need an account. (And, behind the scenes, a network address.) Neither of these things belongs to you. The way things are going, they never will. No matter what you’re up to with your phone or laptop, you’re dependent on MEGACORP.
content/understanding-urbit/your-last-computer.md+4
@@ -2,6 +2,10 @@
2title = "Your Last Computer"
2title = "Your Last Computer"
3description = "What Urbit should feel like to an everyday user"
3description = "What Urbit should feel like to an everyday user"
4weight = 2
4weight = 2
5+[extra]
6+flatten_pagination = "true"
7+hide_next_title = "true"
8+hideprevious = "true"
5+++
9+++
6
10
7This whole ‘simple, durable, yours’ thing may sound good, but what does it add up to? What does it feel like?
11This whole ‘simple, durable, yours’ thing may sound good, but what does it add up to? What does it feel like?
sass/_main.scss+18−2
@@ -124,7 +124,8 @@ article {
124}
124}
125
125
126footer nav {
126footer nav {
127+ // non-flattened pagination
127− &.previous p:first-of-type::after {
128+ &.previous p:first-of-type:not([data-flat=true])::after {
128 content: "-->";
129 content: "-->";
129 font-size: 1.25rem;
130 font-size: 1.25rem;
130 position: absolute;
131 position: absolute;
@@ -132,7 +133,7 @@ footer nav {
132 top: 13px;
133 top: 13px;
133 font-family: "Inter UI", sans-serif;
134 font-family: "Inter UI", sans-serif;
134 }
135 }
135− &.next p:first-of-type::before {
136+ &.next p:first-of-type:not([data-flat=true])::before {
136 content: "<--";
137 content: "<--";
137 font-size: 1.25rem;
138 font-size: 1.25rem;
138 position: absolute;
139 position: absolute;
@@ -140,6 +141,21 @@ footer nav {
140 top: 13px;
141 top: 13px;
141 font-family: "Inter UI", sans-serif;
142 font-family: "Inter UI", sans-serif;
142 }
143 }
144+ // flattened pagination
145+ &.previous p:first-of-type::after {
146+ content: "->";
147+ font-size: 1rem;
148+ position: absolute;
149+ right: -36px;
150+ font-family: "Inter UI", sans-serif;
151+ }
152+ &.next p:first-of-type::before {
153+ content: "<-";
154+ font-size: 1rem;
155+ position: absolute;
156+ left: -36px;
157+ font-family: "Inter UI", sans-serif;
158+ }
143}
159}
144
160
145// essay template
161// essay template
templates/partials/pagination.html+43−10
@@ -1,18 +1,30 @@
1<footer class="relative mt4">{% if page.earlier %}
1<footer class="relative mt4">{% if page.earlier %}
2 <a class="bb-0" href="{{page.earlier.permalink}}">
2 <a class="bb-0" href="{{page.earlier.permalink}}">
3− <nav class="previous mv5 absolute right-2 f4 t-right">
3+ <nav class="previous mv5 absolute right-2 t-right">
4− <p class="mb0 f5">Previous Post:</p>
4+ {% if page.extra.hide_previous_title %} {% else %}<p class="mb0 f5">Previous Post:</p>{% endif %}
5+ <p {% if page.extra.flatten_pagination %}
6+ data-flat="true"
7+ class="
8+ {% else %}
9+ class="fw6 f5 f4-l f4-xl
10+ {% endif %}
5− <p class="fw6 f5 f4-l f4-xl mb0 mt0">{{page.earlier.title}}</p>
11+ mb0 mt0">{{page.earlier.title}}</p>
6 <time class="mono db f5 mb5">{{page.earlier.date | date(format="~%Y.%-m.%-d") }}</time>
12 <time class="mono db f5 mb5">{{page.earlier.date | date(format="~%Y.%-m.%-d") }}</time>
7 </nav>
13 </nav>
8 </a>
14 </a>
9
15
10− {% elif page.heavier %}
16+ {% elif page.heavier and not page.extra.hidenext %}
11
17
12 <a class="bb-0" href="{{page.heavier.permalink}}">
18 <a class="bb-0" href="{{page.heavier.permalink}}">
13− <nav class="previous mv5 absolute right-2 f4 t-right">
19+ <nav class="previous mv5 absolute right-2 t-right">
14− <p class="mb0 f5">Next Post:</p>
20+ {% if page.extra.hide_next_title %} {% else %}<p class="mb0 f5">Next Post:</p>{% endif %}
21+ <p {% if page.extra.flatten_pagination %}
22+ data-flat="true"
23+ class="
24+ {% else %}
25+ class="fw6 f5 f4-l f4-xl
26+ {% endif %}
15− <p class="fw6 f5 f4-l f4-xl mb0 mt0">{{page.heavier.title}}</p>
27+ mb0 mt0">{{page.heavier.title}}</p>
16 </nav>
28 </nav>
17 </a>
29 </a>
18 {% endif %}
30 {% endif %}
@@ -20,13 +32,34 @@
20 {% if page.later %}
32 {% if page.later %}
21
33
22 <a class="bb-0" href="{{page.later.permalink}}">
34 <a class="bb-0" href="{{page.later.permalink}}">
23− <nav class="next mv5 absolute left-2 f4">
35+ <nav class="next mv5 absolute left-2">
24− <p class="mb0 f5">Next Post:</p>
36+ {% if page.extra.hide_next_title %} {% else %}<p class="mb0 f5">Next Post:</p>{% endif %}
37+ <p {% if page.extra.flatten_pagination %}
38+ data-flat="true"
39+ class="
40+ {% else %}
41+ class="fw6 f5 f4-l f4-xl
42+ {% endif %}
25− <p class="fw6 f5 f4-l f4-xl mb0 mt0">{{page.later.title}}</p>
43+ mb0 mt0">{{page.later.title}}</p>
26 <time class="mono db f5 mb5">{{page.later.date | date(format="~%Y.%-m.%-d") }}</time>
44 <time class="mono db f5 mb5">{{page.later.date | date(format="~%Y.%-m.%-d") }}</time>
27 </nav>
45 </nav>
28 </a>
46 </a>
29
47
48+
49+ {% elif page.lighter and not page.extra.hideprevious %}
50+
51+ <a class="bb-0" href="{{page.lighter.permalink}}">
52+ <nav class="next mv5 absolute left-2">
53+ {% if page.extra.hide_previous_title %} {% else %}<p class="mb0 f5">Previous Post:</p>{% endif %}
54+ <p {% if page.extra.flatten_pagination %}
55+ data-flat="true"
56+ class="
57+ {% else %}
58+ class="fw6 f5 f4-l f4-xl
59+ {% endif %}
60+ mb0 mt0">{{page.lighter.title}}</p>
61+ </nav>
62+ </a>
30 {% endif %}
63 {% endif %}
31
64
32</footer>
65</footer>
templates/understanding-urbit/list.html+2−3
@@ -46,9 +46,8 @@
46 {% set posts = get_section(path="understanding-urbit/_index.md") %}
46 {% set posts = get_section(path="understanding-urbit/_index.md") %}
47 {% for directorypage in posts.pages | slice (end=1) %}
47 {% for directorypage in posts.pages | slice (end=1) %}
48 <a class="bb-0" href="{{directorypage.permalink}}">
48 <a class="bb-0" href="{{directorypage.permalink}}">
49− <nav class="previous mv5 absolute right-2 f4 t-right">
49+ <nav class="previous mv5 absolute right-2 t-right">
50− <p class="mb0 f5">Next Post:</p>
51− <p class="fw6 f5 f4-l f4-xl mb0 mt0">{{directorypage.title}}</p>
50+ <p data-flat="true" class="mb0 mt0">{{directorypage.title}}</p>
52 </nav>
51 </nav>
53 </a>
52 </a>
54 {% endfor %}
53 {% endfor %}