client/css: simplify tag list outline workarounds

Rather than messing with negative margins, just make the outline inset
by replacing it with inset box-shadow.
This commit is contained in:
rr- 2016-08-24 00:24:02 +02:00
parent 7f4a2c1ceb
commit f035140c9f

View file

@ -11,19 +11,6 @@ div.tag-input
flex: 1 flex: 1
margin: 0 0 0 0.5em margin: 0 0 0 0.5em
ul
margin-top: 0.2em
li
transition: background-color 0.5s linear
&.implication
background: $implied-tag-background-color
color: $implied-tag-text-color
&.new
background: $new-tag-background-color
color: $new-tag-text-color
&.duplicate
background: $duplicate-tag-background-color
color: $duplicate-tag-text-color
.tag-suggestions .tag-suggestions
position: absolute position: absolute
@ -99,17 +86,28 @@ div.tag-input
unselectable() unselectable()
ul.compact-tags ul.compact-tags
line-height: 200%
width: 100% width: 100%
margin-top: 0.5em
li li
margin: 0 0 -0.8em 0 margin: 0
padding: 0 2px
width: 100% width: 100%
line-height: 140%
white-space: nowrap white-space: nowrap
overflow: hidden overflow: hidden
text-overflow: ellipsis text-overflow: ellipsis
a transition: background-color 0.5s linear
display: inline a:focus
outline: 0
box-shadow: inset 0 0 0 2px $main-color
&.implication
background: $implied-tag-background-color
color: $implied-tag-text-color
&.new
background: $new-tag-background-color
color: $new-tag-text-color
&.duplicate
background: $duplicate-tag-background-color
color: $duplicate-tag-text-color
i i
padding-right: 0.4em padding-right: 0.4em
.append .append
@ -117,4 +115,3 @@ ul.compact-tags
margin-left: 0.7em margin-left: 0.7em
font-size: 90% font-size: 90%
unselectable() unselectable()