client/css: fix wrapping tags in read-only sidebar

This commit is contained in:
rr- 2016-08-26 23:52:03 +02:00
parent 6d26b5c37a
commit 8f230f5701
3 changed files with 28 additions and 33 deletions

View file

@ -272,14 +272,6 @@ $safety-unsafe = #F3985F
h1 h1
margin-bottom: 0.5em margin-bottom: 0.5em
i
padding-right: 0.4em
.tag-usages
font-size: 90%
color: $inactive-link-color
margin-left: 0.7em
.post-view .edit-sidebar .post-view .edit-sidebar
.expander-content .expander-content
section:not(:last-child) section:not(:last-child)

View file

@ -85,32 +85,35 @@ div.tag-input
font-size: 90% font-size: 90%
unselectable() unselectable()
ul.compact-tags ul.compact-tags
width: 100%
margin-top: 0.5em
li
margin: 0
width: 100% width: 100%
margin-top: 0.5em line-height: 140%
li white-space: nowrap
margin: 0 overflow: hidden
width: 100% text-overflow: ellipsis
line-height: 140% transition: background-color 0.5s linear
white-space: nowrap a
overflow: hidden display: inline
text-overflow: ellipsis a:focus
transition: background-color 0.5s linear outline: 0
a:focus box-shadow: inset 0 0 0 2px $main-color
outline: 0 &.implication
box-shadow: inset 0 0 0 2px $main-color background: $implied-tag-background-color
&.implication color: $implied-tag-text-color
background: $implied-tag-background-color &.new
color: $implied-tag-text-color background: $new-tag-background-color
&.new color: $new-tag-text-color
background: $new-tag-background-color &.duplicate
color: $new-tag-text-color background: $duplicate-tag-background-color
&.duplicate color: $duplicate-tag-text-color
background: $duplicate-tag-background-color i
color: $duplicate-tag-text-color padding-right: 0.4em
i
padding-right: 0.4em
div.tag-input, ul.compact-tags
.tag-usages, .tag-weight, .remove-tag .tag-usages, .tag-weight, .remove-tag
color: $inactive-link-color color: $inactive-link-color
unselectable() unselectable()

View file

@ -63,7 +63,7 @@
<nav class='tags'> <nav class='tags'>
<h1>Tags (<%- ctx.post.tags.length %>)</h1> <h1>Tags (<%- ctx.post.tags.length %>)</h1>
<% if (ctx.post.tags.length) { %> <% if (ctx.post.tags.length) { %>
<ul class="compact-tags"><!-- <ul class='compact-tags'><!--
--><% for (let tag of ctx.post.tags) { %><!-- --><% for (let tag of ctx.post.tags) { %><!--
--><li><!-- --><li><!--
--><% if (ctx.canViewTags) { %><!-- --><% if (ctx.canViewTags) { %><!--