diff --git a/materialious/src/lib/components/Search.svelte b/materialious/src/lib/components/Search.svelte
index 01bcc615..9498a580 100644
--- a/materialious/src/lib/components/Search.svelte
+++ b/materialious/src/lib/components/Search.svelte
@@ -151,31 +151,31 @@
{#if $interfaceSearchSuggestionsStore}
{#each suggestionsForSearch as suggestion, index (index)}
-
-
+
+
{/each}
{/if}
{#if !suggestionsForSearch.length && $interfaceSearchHistoryEnabled}
{#each $searchHistoryStore as history (history)}
-
-
+
+
{/each}
{/if}
@@ -192,6 +192,17 @@
.selected {
background-color: var(--surface-variant);
}
+
+ button.suggestion {
+ width: 100%;
+ box-sizing: content-box;
+ justify-content: flex-start;
+ }
+
+ li:hover {
+ background-color: transparent;
+ }
+
@media screen and (max-width: 1140px) {
.search {
width: 100%;
diff --git a/materialious/src/lib/search.ts b/materialious/src/lib/search.ts
index a655103a..beeaa2fa 100644
--- a/materialious/src/lib/search.ts
+++ b/materialious/src/lib/search.ts
@@ -33,11 +33,18 @@ export function goToSearch(searchValue: string) {
goto(resolve(`/search/[search]`, { search: encodeURIComponent(searchTrimmed) }));
- if (get(interfaceSearchHistoryEnabled) && !get(searchHistoryStore).includes(searchTrimmed)) {
+ if (get(interfaceSearchHistoryEnabled)) {
const pastHistory = get(searchHistoryStore);
- if (pastHistory.length > 15) {
+
+ const index = pastHistory.indexOf(searchTrimmed);
+ if (index !== -1) {
+ pastHistory.splice(index, 1);
+ }
+
+ if (pastHistory.length >= 15) {
pastHistory.pop();
}
+
searchHistoryStore.set([searchTrimmed, ...pastHistory]);
}
}