diff options
| author | Henry Jameson <me@hjkos.com> | 2018-05-12 15:16:54 +0300 |
|---|---|---|
| committer | Henry Jameson <me@hjkos.com> | 2018-05-12 15:19:53 +0300 |
| commit | 4c3d62da04e56651d0f9f68c43d90848702a6f51 (patch) | |
| tree | dcaa5e4be5c1d9b7048de976a6b4e027915859e7 | |
| parent | 55aeb5b4b27ec825835c066e855a272bb5b57406 (diff) | |
fixed autocomplete lacking highlight
| -rw-r--r-- | src/components/post_status_form/post_status_form.vue | 16 |
1 files changed, 8 insertions, 8 deletions
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index 5664973c..28dd227e 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -22,12 +22,7 @@ <div style="position:relative;" v-if="candidates"> <div class="autocomplete-panel"> <div v-for="candidate in candidates" @click="replace(candidate.utf || (candidate.screen_name + ' '))"> - <div v-if="candidate.highlighted" class="autocomplete"> - <span v-if="candidate.img"><img :src="candidate.img"></span> - <span v-else>{{candidate.utf}}</span> - <span>{{candidate.screen_name}}<small>{{candidate.name}}</small></span> - </div> - <div v-else class="autocomplete"> + <div class="autocomplete" :class="{ highlighted: candidate.highlighted }"> <span v-if="candidate.img"><img :src="candidate.img"></img></span> <span v-else>{{candidate.utf}}</span> <span>{{candidate.screen_name}}<small>{{candidate.name}}</small></span> @@ -182,8 +177,8 @@ z-index: 1; box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5); min-width: 75%; - background: $fallback--btn; - background: var(--btn, $fallback--btn); + background: $fallback--bg; + background: var(--bg, $fallback--bg); color: $fallback--lightFg; color: var(--lightFg, $fallback--lightFg); } @@ -212,6 +207,11 @@ color: $fallback--faint; color: var(--faint, $fallback--faint); } + + &.highlighted { + background-color: $fallback--btn; + background-color: var(--btn, $fallback--btn); + } } } </style> |