35 lines
703 B
Vue
35 lines
703 B
Vue
<script setup>
|
|
import Result from './Result.vue'
|
|
const props = defineProps(['searchResults', 'searching']);
|
|
const emits = defineEmits(['append'])
|
|
</script>
|
|
|
|
<template>
|
|
<div id="search-results" class="results">
|
|
<ul class="vertical menu">
|
|
<li v-if="searching">Searching...</li>
|
|
<Result v-else v-for="result in searchResults" :result="result" @append="$emit('append', result)" />
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
#search-results div {
|
|
vertical-align: middle;
|
|
height: 100%
|
|
}
|
|
.results {
|
|
flex: 1;
|
|
overflow-y: auto;
|
|
}
|
|
.menu li {
|
|
padding: 0.4em;
|
|
}
|
|
.menu li:nth-child(odd) {
|
|
background-color: #e6e6e6;
|
|
}
|
|
|
|
.menu li:nth-child(even) {
|
|
background-color: #f6f6f6;
|
|
}
|
|
</style>
|