bd-autocomplete -> bd-ac

This commit is contained in:
Jiiks 2018-08-22 20:17:43 +03:00
parent 07374ceeee
commit 2002db7807
2 changed files with 14 additions and 14 deletions

View File

@ -1,4 +1,4 @@
.bd-autocomplete {
.bd-ac {
border-radius: 5px 5px 0 0;
overflow: hidden;
text-overflow: ellipsis;
@ -10,16 +10,16 @@
right: 0;
background-color: #2f3136;
.bd-autocompleteInner {
.bd-acInner {
padding-bottom: 8px;
white-space: nowrap;
.bd-autocompleteRow {
.bd-acRow {
padding: 0 8px;
font-size: 14px;
line-height: 16px;
.bd-autocompleteSelector {
.bd-acSelector {
border-radius: 3px;
padding: 8px;
@ -35,7 +35,7 @@
}
}
.bd-autocompleteTitle {
.bd-acTitle {
color: #72767d;
padding: 4px 0;
text-transform: uppercase;
@ -50,7 +50,7 @@
}
}
.bd-autocompleteField {
.bd-acField {
display: flex;
flex: 1 1 auto;
color: #f6f6f7;

View File

@ -9,20 +9,20 @@
*/
<template>
<div class="bd-autocomplete">
<div v-if="search.items.length" class="bd-autocompleteInner">
<div class="bd-autocompleteRow">
<div class="bd-autocompleteSelector">
<div class="bd-autocompleteTitle">
<div class="bd-ac">
<div v-if="search.items.length" class="bd-acInner">
<div class="bd-acRow">
<div class="bd-acSelector">
<div class="bd-acTitle">
{{search.title[0] || search.title}}
<strong v-if="search.title.length >= 2">{{search.title[1] || sterm}}</strong>
<strong v-if="search.title.length === 3" :style="{float: 'right'}">{{search.title[2]}}</strong>
</div>
</div>
</div>
<div v-for="(item, index) in search.items" class="bd-autocompleteRow" @mouseover="selectedIndex = index" @click="inject">
<div class="bd-autocompleteSelector bd-selectable" :class="{'bd-selected': index === selectedIndex}">
<div class="bd-autocompleteField">
<div v-for="(item, index) in search.items" class="bd-acRow" @mouseover="selectedIndex = index" @click="inject">
<div class="bd-acSelector bd-selectable" :class="{'bd-selected': index === selectedIndex}">
<div class="bd-acField">
<img v-if="search.type === 'imagetext'" :src="item.src || item.value.src" :alt="item.key || item.text || item.alt" />
<div class="bd-flexGrow">{{item.key || item.text}}</div>
<div class="bd-acHint" v-if="item.hint || (item.value && item.value.hint)">{{item.hint || item.value.hint}}</div>