diff options
| -rw-r--r-- | layout/_partial/header.ejs | 2 | ||||
| -rw-r--r-- | layout/index.ejs | 64 | ||||
| -rw-r--r-- | source/css/style.css | 9 |
3 files changed, 39 insertions, 36 deletions
diff --git a/layout/_partial/header.ejs b/layout/_partial/header.ejs index f7fef30..c6c1a9f 100644 --- a/layout/_partial/header.ejs +++ b/layout/_partial/header.ejs @@ -1,4 +1,4 @@ -<section id="header-page" class="hero is-light is-fullheight"> +<section id="header-page" class="hero is-light is-large"> <div class="hero-head"> <header class="navbar" aria-label="main navigation"> <div class="container"> diff --git a/layout/index.ejs b/layout/index.ejs index 78fc04e..53335fe 100644 --- a/layout/index.ejs +++ b/layout/index.ejs @@ -2,10 +2,9 @@ <div class="hero-body"> <div class="container"> <% page.posts.each(function (post) { %> - <div class="columns"> + <div class="columns post-entry"> <div class="column is-8 is-offset-2"> <div class="card"> - <!-- Post thumbnail with lazayload support --> <% if (post.thumbnail) { %> <div class="card-iamge"> @@ -18,9 +17,11 @@ <% } %> <% } %> </figure> + </div> <% } %> - <div class="card-content"> + <div class="card-content"> + <!-- Post title --> <p class="title is-4"> <%= post.title %> @@ -75,49 +76,42 @@ <p><%- post.content %></p> <% } %> </section> - </div> + <div class="card-footer"> <a href="<%- url_for(post.path) %>" class="card-footer-item has-text-danger has-text-weight-medium is-uppercase"> <% if (post.podcast && theme.podcast) { %> - Listen Now + <%- __("listen") %> <% } else { %> - Continue Read + <%- __("read") %> <% } %> </a> </div> + </div> </div> </div> - <% }); %> + <% }); %> + + <!-- Page navigation --> + <% if (page.prev || page.next) { %> + <div class="columns pagination-bar"> + <div class="column is-8 is-offset-2"> + <nav class="pagination is-centered" role="navigation" aria-label="pagination"> + <% if (page.prev) { %> + <a class="button is-light" href="<%- url_for(page.prev_link) %>"><%- __("prev") %></a> + <% } else { %> + <a class="button is-disabled is-light" disabled><%- __("prev") %></a> + <% } %> + <% if (page.next) { %> + <a class="button is-light" href="<%- url_for(page.next_link) %>"><%- __("next") %></a> + <% } else { %> + <a class="button is-disabled is-light" disabled><%- __("next") %></a> + <% } %> + </nav> + </div> + </div> + <% } %> </div> </div> </section> - -<!-- Page navigation --> -<!-- <% if (page.prev || page.next) { %> - <div class="nav"> - <% if (page.prev) { %> - <div class="nav-prev"> - <a href="<%- url_for(page.prev_link) %>" class="nav-link"> - <span class="nav-label"> - Prev - <i class="fa fa-chevron-left"></i> - </span> - </a> - </div> - <% } %> - <% if (page.next) { %> - <div class="nav-next"> - <a href="<%- url_for(page.next_link) %>" class="nav-link"> - <span class="nav-label"> - Next - <i class="fa fa-chevron-right"></i> - </span> - </a> - </div> - <% } %> - </div> -<% } %> --> - -</section>
\ No newline at end of file diff --git a/source/css/style.css b/source/css/style.css index a5c5377..c7743db 100644 --- a/source/css/style.css +++ b/source/css/style.css @@ -19,4 +19,13 @@ pre { .navbar-brand .navbar-item:hover { background-color: inherit !important; +} + +.post-entry { + margin-bottom: 3rem !important; +} + +.pagination-bar { + padding-left: 0.25rem; + padding-right: 0.25rem; }
\ No newline at end of file |