diff --git a/client/css/home.styl b/client/css/home.styl index bf920e5..163b1b5 100644 --- a/client/css/home.styl +++ b/client/css/home.styl @@ -2,42 +2,42 @@ text-align: center !important header + margin-bottom: 1em h1 - margin-top: 0 - margin-bottom: 0.2em - aside - opacity: .5 - font-size: 80% - margin-bottom: 2em + line-height: initial + font-size: 30pt + margin: 0 .message margin-bottom: 2em form - margin-bottom: 2em width: auto + vertical-align: middle + margin: 0 0 2em 0 + text-align: left white-space: nowrap input width: auto - .separator - display: inline-block - margin: 0 1.5em + .sep + margin: 0 0.75em .post-container + margin-bottom: 2em display: flex align-items: center justify-content: center nav - margin-bottom: 0.5em a padding: 0.5em aside - margin-bottom: 1em + margin-bottom: 0.3em font-size: 90% footer - margin-top: 1em line-height: 100% font-size: 80% + .sep + margin: 0 0.25em diff --git a/client/html/home.tpl b/client/html/home.tpl index af899a9..f1d9b1c 100644 --- a/client/html/home.tpl +++ b/client/html/home.tpl @@ -2,23 +2,15 @@

<%- ctx.name %>

-
<% if (ctx.canListPosts) { %>
-
- <%= ctx.makeButton({name: 'all-posts', value: 'Browse all posts'}) %> - or - <%= ctx.makeTextInput({name: 'search-text', placeholder: 'enter some tags'}) %> -
-
- -
+ <%= ctx.makeTextInput({name: 'search-text', placeholder: 'enter some tags'}) %> + + or + browse all posts
<% } %>
- + diff --git a/client/html/home_featured_post.tpl b/client/html/home_featured_post.tpl index d5fb43e..90851d7 100644 --- a/client/html/home_featured_post.tpl +++ b/client/html/home_featured_post.tpl @@ -1,3 +1,4 @@ +
<% if (ctx.featuredPost) { %> <% } %> -
diff --git a/client/html/home_footer.tpl b/client/html/home_footer.tpl new file mode 100644 index 0000000..47d25e8 --- /dev/null +++ b/client/html/home_footer.tpl @@ -0,0 +1,6 @@ +<%- ctx.postCount %> posts + +<%= ctx.makeFileSize(ctx.diskUsage) %> + +Build <%- ctx.version %> +from <%= ctx.makeRelativeTime(ctx.buildDate) %> diff --git a/client/html/home_stats.tpl b/client/html/home_stats.tpl deleted file mode 100644 index cf2c379..0000000 --- a/client/html/home_stats.tpl +++ /dev/null @@ -1 +0,0 @@ -Serving <%- ctx.postCount %> posts (<%= ctx.makeFileSize(ctx.diskUsage) %>) diff --git a/client/js/views/home_view.js b/client/js/views/home_view.js index 827eaf9..a8d151b 100644 --- a/client/js/views/home_view.js +++ b/client/js/views/home_view.js @@ -10,20 +10,18 @@ const TagAutoCompleteControl = require('../controls/tag_auto_complete_control.js'); const template = views.getTemplate('home'); -const statsTemplate = views.getTemplate('home-stats'); +const footerTemplate = views.getTemplate('home-footer'); const featuredPostTemplate = views.getTemplate('home-featured-post'); class HomeView { constructor(ctx) { this._hostNode = document.getElementById('content-holder'); + this._ctx = ctx; const sourceNode = template(ctx); views.replaceContent(this._hostNode, sourceNode); if (this._formNode) { - this._formNode.querySelector('input[name=all-posts') - .addEventListener('click', e => this._evtAllPostsClick(e)); - this._tagAutoCompleteControl = new TagAutoCompleteControl( this._searchInputNode); this._formNode.addEventListener( @@ -41,7 +39,9 @@ class HomeView { } setStats(stats) { - views.replaceContent(this._statsContainerNode, statsTemplate(stats)); + views.replaceContent( + this._footerContainerNode, + footerTemplate(Object.assign({}, stats, this._ctx))); } setFeaturedPost(postInfo) { @@ -64,8 +64,8 @@ class HomeView { } } - get _statsContainerNode() { - return this._hostNode.querySelector('.stats-container'); + get _footerContainerNode() { + return this._hostNode.querySelector('.footer-container'); } get _postInfoContainerNode() { @@ -84,11 +84,6 @@ class HomeView { return this._formNode.querySelector('input[name=search-text]'); } - _evtAllPostsClick(e) { - e.preventDefault(); - router.show('/posts/'); - } - _evtFormSubmit(e) { e.preventDefault(); this._searchInputNode.blur();