1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 01:36:22 +00:00

add tag autocomplete

This commit is contained in:
Baptiste Augrain
2018-08-21 10:57:25 +02:00
parent 039f73711a
commit 00b4874d09
9 changed files with 146 additions and 1 deletions

View File

@@ -0,0 +1,114 @@
.awesomplete
display inline-block
position relative
.visually-hidden
position absolute
clip rect(0, 0, 0, 0)
ul
position fixed
z-index 1
box-sizing border-box
list-style none
padding 0
margin 0
border-radius 4px
margin .2em 0 0
background-color $ui-noteList-backgroundColor
border 1px solid rgba(0,0,0,.3)
box-shadow .05em .2em .6em rgba(0,0,0,.2)
text-shadow none
&:empty,
&[hidden]
display none
&:before
content ""
position absolute
top -.43em
left 1em
width 0 height 0
padding .4em
background-color $ui-noteList-backgroundColor
border inherit
border-right 0
border-bottom 0
-webkit-transform rotate(45deg)
transform rotate(45deg)
li
position relative
padding 6px 18px 6px 10px
cursor pointer
li:hover
background-color alpha($ui-button--active-backgroundColor, 20%)
color $ui-text-color
li[aria-selected="true"]
background-color alpha($ui-button--active-backgroundColor, 40%)
color $ui-text-color
body[data-theme="dark"]
.awesomplete ul
border-color $ui-dark-borderColor
background-color $ui-dark-noteList-backgroundColor
color $ui-dark-text-color
&:before
background-color $ui-dark-noteList-backgroundColor
li:hover
background-color alpha($ui-dark-button--active-backgroundColor, 20%)
color $ui-dark-text-color
li[aria-selected="true"]
background-color $ui-dark-button--active-backgroundColor
color $ui-dark-text-color
body[data-theme="white"]
.awesomplete ul
background-color $ui-white-noteList-backgroundColor
li:hover
background-color alpha($ui-button--active-backgroundColor, 60%)
li[aria-selected="true"]
background-color $ui-button--active-backgroundColor
body[data-theme="solarized-dark"]
.awesomplete ul
border-color $ui-solarized-dark-borderColor
background-color $ui-solarized-dark-noteList-backgroundColor
color $ui-solarized-dark-text-color
&:before
background-color $ui-solarized-dark-noteList-backgroundColor
li:hover
background-color alpha($ui-dark-button--active-backgroundColor, 20%)
color $ui-solarized-dark-text-color
li[aria-selected="true"]
background-color $ui-dark-button--active-backgroundColor
color $ui-solarized-dark-text-color
body[data-theme="monokai"]
.awesomplete ul
border-color $ui-monokai-borderColor
background-color $ui-monokai-noteList-backgroundColor
color $ui-monokai-text-color
&:before
background-color $ui-dark-noteList-backgroundColor
li:hover
background-color alpha($ui-dark-button--active-backgroundColor, 20%)
color $ui-monokai-text-color
li[aria-selected="true"]
background-color $ui-monokai-button-backgroundColor
color $ui-monokai-text-color