🌐 Adds en translations for Home and Search components

This commit is contained in:
Alicia Sykes 2021-07-22 22:33:47 +01:00
parent 0606cb07ae
commit e02d33b0df
3 changed files with 13 additions and 6 deletions

View File

@ -1,4 +1,11 @@
{ {
"test": "Hello World!", "home": {
"test2": "Im a fallback" "no-results": "No Search Results",
"no-data": "No Data Configured"
},
"search": {
"search-label": "Search",
"search-placeholder": "Start typing to filter",
"clear-search-tooltip": "Clear Search"
}
} }

View File

@ -1,16 +1,16 @@
<template> <template>
<form> <form>
<label for="filter-tiles">Search</label> <label for="filter-tiles">{{ $t('search.search-label') }}</label>
<input <input
id="filter-tiles" id="filter-tiles"
v-model="input" v-model="input"
ref="filter" ref="filter"
placeholder="Start typing to filter..." :placeholder="$t('search.search-placeholder')"
v-on:input="userIsTypingSomething" v-on:input="userIsTypingSomething"
@keydown.esc="clearFilterInput" /> @keydown.esc="clearFilterInput" />
<i v-if="input.length > 0" <i v-if="input.length > 0"
class="clear-search" class="clear-search"
title="Clear search" :title="$t('search.clear-search-tooltip')"
@click="clearFilterInput">x</i> @click="clearFilterInput">x</i>
</form> </form>
</template> </template>

View File

@ -34,7 +34,7 @@
</div> </div>
<!-- Show message when there's no data to show --> <!-- Show message when there's no data to show -->
<div v-if="checkIfResults()" class="no-data"> <div v-if="checkIfResults()" class="no-data">
{{searchValue ? 'No Search Results' : 'No Data Configured'}} {{searchValue ? $t('home.no-results') : $t('home.no-data')}}
</div> </div>
</div> </div>
</template> </template>