Always show arrows on pagination

_includes/pagination.liquid

@@ -1,14 +1,12 @@
 {% if paginator.total_pages > 1 %}
 	{% capture index_page_name %}{{ site.pagination.indexpage }}.{{ site.pagination.extension }}{% endcapture %}
 	<ul class="pager">
-		{% if paginator.previous_page %}
-		<li class="first">
+		<li class="first{% if paginator.previous_page %}{% else %} disabled{% endif %}">
 			<a href="{{ paginator.first_page_path | absolute_url | remove_first: index_page_name }}" alt="Oldest Entries">&laquo</a>
 		</li>
-		<li class="prev">
+		<li class="prev{% if paginator.previous_page %}{% else %} disabled{% endif %}">
 			<a href="{{ paginator.previous_page_path | absolute_url | remove_first: index_page_name }}" alt="Older Entries">&larr;</a>
 		</li>
-		{% endif %}
 
 		{% if paginator.page_trail %}
 		{% for trail in paginator.page_trail %}
@@ -18,13 +16,11 @@
 		{% endfor %}
 		{% endif %}
 
-		{% if paginator.next_page %}
-		<li class="next">
+		<li class="next{% if paginator.next_page %}{% else %} disabled{% endif %}">
 			<a href="{{ paginator.next_page_path | absolute_url | remove_first: index_page_name }}" alt="Newer Entries">&rarr;</a>
 		</li>
-		<li class="last">
+		<li class="last{% if paginator.next_page %}{% else %} disabled{% endif %}">
 			<a href="{{ paginator.last_page_path | absolute_url | remove_first: index_page_name }}" alt="Newest Entries">&raquo;</a>
 		</li>
-		{% endif %}
 	</ul>
 {% endif %}

_sass/_pagination.scss

@@ -33,6 +33,16 @@
 	color: $theme-pagination-color-selected;
 }
 
+.pager > .disabled,
+.pager > .disabled:hover,
+.pager > .disabled:focus,
+.pager > .disabled.selected {
+	background: $theme-pagination-background;
+	box-shadow: $theme-pagination-shadow;
+	color: $theme-pagination-color;
+	opacity: 50%;
+}
+
 .pager > li > a {
 	display: block;
 	margin: 0;
@@ -42,3 +52,7 @@
 	width: 5rem;
 	height: 2.5rem;
 }
+
+.pager > .disabled > a {
+	cursor: default;
+}