Add post pagination to sidebar and make minor styling alterations

This commit is contained in:
Michael Rose 2016-03-28 21:48:42 -04:00
parent c335b70007
commit 945fb58044
9 changed files with 56 additions and 17 deletions

View file

@ -6,9 +6,9 @@
{% comment %} Link for previous page {% endcomment %} {% comment %} Link for previous page {% endcomment %}
{% if paginator.previous_page %} {% if paginator.previous_page %}
{% if paginator.previous_page == 1 %} {% if paginator.previous_page == 1 %}
<li><a href="{{ base_path }}/" class="btn">{{ site.data.ui-text[site.locale].pagination_previous }}</a></li> <li><a href="{{ base_path }}/" class="btn btn--inverse btn--small">{{ site.data.ui-text[site.locale].pagination_previous }}</a></li>
{% else %} {% else %}
<li><a href="{{ base_path }}/page{{ paginator.previous_page }}/" class="btn">{{ site.data.ui-text[site.locale].pagination_previous }}</a></li> <li><a href="{{ base_path }}/page{{ paginator.previous_page }}/" class="btn btn--inverse btn--small">{{ site.data.ui-text[site.locale].pagination_previous }}</a></li>
{% endif %} {% endif %}
{% endif %} {% endif %}
@ -59,7 +59,7 @@
{% comment %}Link next page{% endcomment %} {% comment %}Link next page{% endcomment %}
{% if paginator.next_page %} {% if paginator.next_page %}
<li><a href="{{ base_path }}/page{{ paginator.next_page }}/" class="btn">{{ site.data.ui-text[site.locale].pagination_next }}</a></li> <li><a href="{{ base_path }}/page{{ paginator.next_page }}/" class="btn btn--inverse btn--small">{{ site.data.ui-text[site.locale].pagination_next }}</a></li>
{% endif %} {% endif %}
</ul> </ul>
</nav> </nav>

View file

@ -0,0 +1,8 @@
<nav class="pagination">
{% if page.previous %}
<a href="{{ base_path }}{{ page.previous.url }}" class="btn btn--inverse btn--small" title="{{ page.previous.title | markdownify | strip_html }}">{{ site.data.ui-text[site.locale].pagination_previous }}</a>
{% endif %}
{% if page.next %}
<a href="{{ base_path }}{{ page.next.url }}" class="btn btn--inverse btn--small" title="{{ page.next.title | markdownify | strip_html }}">{{ site.data.ui-text[site.locale].pagination_next }}</a>
{% endif %}
</nav>

View file

@ -19,5 +19,6 @@
{% include nav_list items=page.sidebar.nav %} {% include nav_list items=page.sidebar.nav %}
{% endif %} {% endif %}
{% endif %} {% endif %}
{% include post_pagination.html %}
</div> </div>
{% endif %} {% endif %}

View file

@ -114,6 +114,8 @@ Make any link standout more when applying the `.btn` class.
[Warning Button](#){: .btn .btn--warning} [Warning Button](#){: .btn .btn--warning}
[Danger Button](#){: .btn .btn--danger} [Danger Button](#){: .btn .btn--danger}
[Info Button](#){: .btn .btn--info} [Info Button](#){: .btn .btn--info}
[Inverse Button](#){: .btn .btn--inverse}
[Light Outline Button](#){: .btn .btn--light-outline}
```markdown ```markdown
[Primary Button Text](#link){: .btn} [Primary Button Text](#link){: .btn}
@ -121,6 +123,8 @@ Make any link standout more when applying the `.btn` class.
[Warning Button Text](#link){: .btn .btn--warning} [Warning Button Text](#link){: .btn .btn--warning}
[Danger Button Text](#link){: .btn .btn--danger} [Danger Button Text](#link){: .btn .btn--danger}
[Info Button Text](#link){: .btn .btn--info} [Info Button Text](#link){: .btn .btn--info}
[Inverse Button](#link){: .btn .btn--inverse}
[Light Outline Button](#link){: .btn .btn--light-outline}
``` ```
[X-Large Button](#){: .btn .btn--x-large} [X-Large Button](#){: .btn .btn--x-large}
@ -130,11 +134,11 @@ Make any link standout more when applying the `.btn` class.
[X-Small Button](#){: .btn .btn--x-small} [X-Small Button](#){: .btn .btn--x-small}
```markdown ```markdown
[X-Large Button](#){: .btn .btn--x-large} [X-Large Button](#link){: .btn .btn--x-large}
[Large Button](#){: .btn .btn--large} [Large Button](#link){: .btn .btn--large}
[Default Button](#){: .btn} [Default Button](#link){: .btn}
[Small Button](#){: .btn .btn--small} [Small Button](#link){: .btn .btn--small}
[X-Small Button](#){: .btn .btn--x-small} [X-Small Button](#link){: .btn .btn--x-small}
``` ```
## Notices ## Notices

View file

@ -53,13 +53,16 @@
========================================================================== */ ========================================================================== */
.pagination { .pagination {
padding-top: 0.5em; margin-top: 1em;
padding-top: 1em;
border-top: 1px solid $border-color; border-top: 1px solid $border-color;
ul { ul {
margin: 0; margin: 0;
padding: 0; padding: 0;
list-style-type: none; list-style-type: none;
font-family: $sans-serif;
font-size: 12px;
} }
li { li {
@ -222,7 +225,7 @@
.nav__list { .nav__list {
a { a {
display: block; display: block;
padding: 2px 0; padding: 4px 0;
&:hover { &:hover {
text-decoration: underline; text-decoration: underline;
@ -260,12 +263,13 @@
========================================================================== */ ========================================================================== */
.toc { .toc {
padding: 0 0 1em;
font-family: $sans-serif-narrow; font-family: $sans-serif-narrow;
color: $gray; color: $gray;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
background-color: #fff; background-color: #fff;
border: 1px solid $border-color;
border-radius: $border-radius;
} }
.toc__menu { .toc__menu {

View file

@ -61,7 +61,7 @@
} }
.page__content { .page__content {
p, li { p, li, dl {
font-size: 16px; font-size: 16px;
} }
@ -77,6 +77,15 @@
} }
} }
} }
dt {
margin-top: 1em;
font-weight: bold;
}
dd {
margin-left: 1em;
}
} }
.page__hero { .page__hero {

View file

@ -10,6 +10,10 @@
@include clearfix(); @include clearfix();
margin-bottom: 1em; margin-bottom: 1em;
@include breakpoint($medium) {
padding-right: $right-sidebar-width-narrow;
}
@include breakpoint($large) { @include breakpoint($large) {
@include span(2 of 12); @include span(2 of 12);
@include suffix(0.25 of 12); @include suffix(0.25 of 12);
@ -34,7 +38,7 @@
p, li { p, li {
font-family: $sans-serif; font-family: $sans-serif;
font-size: 14px; font-size: 12px;
line-height: 1.2; line-height: 1.2;
} }
@ -89,6 +93,11 @@
img { img {
max-width: 110px; max-width: 110px;
border-radius: 50%; border-radius: 50%;
@include breakpoint($large) {
padding: 5px;
border: 1px solid $border-color;
}
} }
} }
@ -109,20 +118,24 @@
.author__name { .author__name {
margin: 0; margin: 0;
font-size: 18px;
@include breakpoint($large) { @include breakpoint($large) {
margin-top: 10px; margin-top: 10px;
margin-bottom: 10px; margin-bottom: 10px;
font-size: 20px;
} }
} }
.sidebar .author__name { .sidebar .author__name {
font-family: $sans-serif; font-family: $sans-serif;
font-size: 16px;
@include breakpoint($large) {
font-size: 18px;
}
} }
.author__bio { .author__bio {
margin: 0; margin: 0;
font-size: 12px;
@include breakpoint($large) { @include breakpoint($large) {
margin-top: 10px; margin-top: 10px;

File diff suppressed because one or more lines are too long

View file

@ -14,4 +14,4 @@ author_profile: false
{% include archive-single.html %} {% include archive-single.html %}
{% endfor %} {% endfor %}
{% include pagination.html %} {% include paginator.html %}