diff options
Diffstat (limited to 'iridescence/src/components/ProductSearch.vue')
| -rw-r--r-- | iridescence/src/components/ProductSearch.vue | 14 |
1 files changed, 10 insertions, 4 deletions
diff --git a/iridescence/src/components/ProductSearch.vue b/iridescence/src/components/ProductSearch.vue index 0cf8cf2..2a7a2e3 100644 --- a/iridescence/src/components/ProductSearch.vue +++ b/iridescence/src/components/ProductSearch.vue @@ -1,24 +1,30 @@ <template> <div id="productSearch"> <div class="field is-grouped is-grouped-multiline"> - <div class="control is-expanded"> + <div class="control is-expanded has-icons-left"> <input - class="input is-primary is-medium" + class="input is-medium is-primary is-rounded" type="text" placeholder="Find something in particular..." v-model.trim="term" @input="updateSearch" autofocus /> + <span class="icon is-left"> + <span class="iconify-inline" data-icon="mdi-magnify"></span> + </span> </div> - <div class="control"> - <div class="select is-primary is-medium"> + <div class="control has-icons-left"> + <div class="select is-medium is-primary is-rounded"> <select v-model="sortOptionName" @change="updateSort"> <option v-for="name in sortOptionNames" :key="name" :value="name"> {{ name }} </option> </select> </div> + <span class="icon is-left"> + <span class="iconify-inline" data-icon="mdi-sort"></span> + </span> </div> </div> <content class="has-text-centered" v-if="noResults"> |