diff --git a/src/app.css b/src/app.css index 4c246d6..00805a1 100644 --- a/src/app.css +++ b/src/app.css @@ -533,7 +533,7 @@ footer a:hover { .filter-btn-checkbox:checked + .filter-btn-text{ - background-color: var(--nav-color); + background-color: var(--ddb-red); } /* screenreader class */ diff --git a/src/lib/components/translater.svelte b/src/lib/components/translater.svelte index a46e8f0..a3947a4 100644 --- a/src/lib/components/translater.svelte +++ b/src/lib/components/translater.svelte @@ -15,7 +15,6 @@ import Search from "$lib/components/Search.svelte"; import { hideTranslated, searchQuerry } from "$lib/stores/filter"; import { filterDescription } from "$lib/filter"; -import type { log } from 'util'; // import type { } from "tinymce"; export let file; @@ -220,7 +219,16 @@ import type { log } from 'util'; let _hideTranslated = $hideTranslated; $: { - if (loaded && (_hideTranslated !== $hideTranslated || _searchQuerry !== $searchQuerry)) { + + // if(_searchQuerry === '') console.log('null'); + // console.log('_search', _searchQuerry); + // console.log('$search', $searchQuerry); + + // console.log('##################################'); + + if (loaded && (_hideTranslated !== $hideTranslated || _searchQuerry !== $searchQuerry || _searchQuerry === '')) { + // console.log('intern', _searchQuerry); + _hideTranslated = $hideTranslated items = items.map((item) => { item.hidden = filterDescription({ diff --git a/src/lib/filter.ts b/src/lib/filter.ts index 1362cda..06d389d 100644 --- a/src/lib/filter.ts +++ b/src/lib/filter.ts @@ -8,11 +8,11 @@ export function filterDescription({item, hideTranslated, searchQuerry}) { && ((material?.length ?? 1) > 0) && ((source?.length ?? 0) > 0); + searchQuerry = searchQuerry || ''; + const searchShow = (name ?? '').toLowerCase().includes(searchQuerry.toLowerCase()) || id.toLowerCase().includes(searchQuerry.toLowerCase()) - // console.log('trans', translatedHidden); - // console.log('search', !searchShow) return translatedHidden || !searchShow; }