client/posts: add border around tagless posts

This commit is contained in:
rr- 2016-09-10 11:34:11 +02:00
parent 19eea226a6
commit 0f0e6c4e24
3 changed files with 11 additions and 8 deletions

View file

@ -28,6 +28,8 @@ $button-enabled-text-color = white
$button-enabled-background-color = $main-color $button-enabled-background-color = $main-color
$button-disabled-text-color = #666 $button-disabled-text-color = #666
$button-disabled-background-color = #CCC $button-disabled-background-color = #CCC
$post-thumbnail-border-color = $main-color
$post-thumbnail-no-tags-border-color = #F44
$default-tag-category-background-color = $active-tab-background-color $default-tag-category-background-color = $active-tab-background-color
$new-tag-background-color = #DFC $new-tag-background-color = #DFC
$new-tag-text-color = black $new-tag-text-color = black

View file

@ -88,15 +88,18 @@
height: 100% height: 100%
outline-offset: -3px outline-offset: -3px
.thumbnail-wrapper.no-tags
.thumbnail
outline: 4px solid $post-thumbnail-no-tags-border-color
&:hover &:hover
background: $main-color background: $post-thumbnail-border-color
.thumbnail .thumbnail
opacity: .9 opacity: .9
&:hover a, a:active, a:focus &:hover a, a:active, a:focus
box-shadow: 0 0 0 1px $main-color
.thumbnail .thumbnail
outline: 3px solid $main-color outline: 4px solid $main-color !important
.post-list-header .post-list-header
white-space: nowrap white-space: nowrap

View file

@ -3,11 +3,9 @@
<ul> <ul>
<% for (let post of ctx.results) { %> <% for (let post of ctx.results) { %>
<li> <li>
<% if (ctx.canViewPosts) { %> <a class='thumbnail-wrapper <%= post.tags.length > 0 ? "tags" : "no-tags" %>'
<a class='thumbnail-wrapper' href='<%= ctx.getPostUrl(post.id, ctx.parameters) %>' title='@<%- post.id %> (<%- post.type %>)&#10;&#10;Tags: <%- post.tags.map(tag => '#' + tag).join(' ') %>'> title='@<%- post.id %> (<%- post.type %>)&#10;&#10;Tags: <%- post.tags.map(tag => '#' + tag).join(' ') || 'none' %>'
<% } else { %> href='<%= ctx.canViewPosts ? ctx.getPostUrl(post.id, ctx.parameters) : "" %>'>
<a class='thumbnail-wrapper'>
<% } %>
<%= ctx.makeThumbnail(post.thumbnailUrl) %> <%= ctx.makeThumbnail(post.thumbnailUrl) %>
<span class='type' data-type='<%- post.type %>'> <span class='type' data-type='<%- post.type %>'>
<%- post.type %> <%- post.type %>