Commander1024/lostplaces-backend
Commander1024/lostplaces-backend
1
0
Fork 0
Code Issues 14 Pull Requests Releases Wiki Activity

Tagify dropdown styling

Browse Source
This commit is contained in:
reverend 2020-09-01 18:31:46 +02:00
parent 6ed6c2c990
commit e00c9318fa
1 changed files with 56 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
lostplaces/lostplaces_app/static/main.css
View File

@ -604,7 +604,7 @@ body {
.LP-Input--tagging .LP-Button { .LP-Input--tagging .LP-Button {
height: 53px; } height: 53px; }
.LP-Input--tagging .LP-Input__Field, .LP-Input--tagging .tagify { .LP-Input--tagging .LP-Input__Field, .LP-Input--tagging .tagify {
min-height: 35px; min-height: 36px;
height: max-content; height: max-content;
font-family: Montserrat, Helvetica, sans-serif; font-family: Montserrat, Helvetica, sans-serif;
font-size: 1em; font-size: 1em;
@ -1500,3 +1500,58 @@ body {
.tagify[readonly]:not(.tagify--mix) .tagify__tag__removeBtn { .tagify[readonly]:not(.tagify--mix) .tagify__tag__removeBtn {
display: none; } display: none; }
.tagify__dropdown {
position: absolute;
z-index: 9999;
transform: translateY(1px);
overflow: hidden; }
.tagify__dropdown[placement=top] {
margin-top: 0;
transform: translateY(-100%); }
.tagify__dropdown[placement=top] .tagify__dropdown__wrapper {
border-top-width: 1px;
border-bottom-width: 0; }
.tagify__dropdown[position=text] {
box-shadow: 0 0 0 3px rgba(var(--tagify-dd-color-primary), 0.1);
font-size: .9em; }
.tagify__dropdown[position=text] .tagify__dropdown__wrapper {
border-width: 1px; }
.tagify__dropdown__wrapper {
max-height: 300px;
overflow: hidden;
background-color: #f9f9f9;
box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.2);
transition: 0.25s cubic-bezier(0, 1, 0.5, 1); }
.tagify__dropdown__wrapper:hover {
overflow: auto; }
.tagify__dropdown--initial .tagify__dropdown__wrapper {
max-height: 20px;
transform: translateY(-1em); }
.tagify__dropdown--initial[placement=top] .tagify__dropdown__wrapper {
transform: translateY(2em); }
.tagify__dropdown__item {
box-sizing: inherit;
padding: .3em .5em;
margin: 1px;
cursor: pointer;
border-radius: 2px;
position: relative;
outline: 0;
font-family: Montserrat, Helvetica, sans-serif; }
.tagify__dropdown__item--active {
color: #f9f9f9;
background-color: gray; }
.tagify__dropdown__item:active {
filter: brightness(105%); }