tanner/obsidian-tannersearch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

#97 - Fixing layout

Browse Source
This commit is contained in:
Simon Cambier
2022-09-20 12:52:04 +02:00
parent 3bd4a2cc83
commit d09dd23bc8
3 changed files with 38 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/components/ModalInFile.svelte
View File

@@ -141,23 +141,28 @@
</script> </script>
<div class="modal-title">Omnisearch - File</div> <div class="modal-title">Omnisearch - File</div>
<InputSearch value={searchQuery} on:input={e => (searchQuery = e.detail)} /> <div class="modal-content">
<InputSearch value={searchQuery} on:input={e => (searchQuery = e.detail)} />
<ModalContainer>
{#if groupedOffsets.length && note}
{#each groupedOffsets as offset, i}
<ResultItemInFile
{offset}
{note}
index={i}
selected={i === selectedIndex}
on:mousemove={e => (selectedIndex = i)}
on:click={openSelection} />
{/each}
{:else}
<div style="text-align: center;">
We found 0 result for your search here.
</div>
{/if}
</ModalContainer>
</div>
<ModalContainer>
{#if groupedOffsets.length && note}
{#each groupedOffsets as offset, i}
<ResultItemInFile
{offset}
{note}
index={i}
selected={i === selectedIndex}
on:mousemove={e => (selectedIndex = i)}
on:click={openSelection} />
{/each}
{:else}
<center> We found 0 result for your search here. </center>
{/if}
</ModalContainer>
<div class="prompt-instructions"> <div class="prompt-instructions">
<div class="prompt-instruction"> <div class="prompt-instruction">
<span class="prompt-instruction-command">↑↓</span><span>to navigate</span> <span class="prompt-instruction-command">↑↓</span><span>to navigate</span>

28
src/components/ModalVault.svelte
View File

@@ -181,20 +181,22 @@
</script> </script>
<div class="modal-title">Omnisearch - Vault</div> <div class="modal-title">Omnisearch - Vault</div>
<InputSearch value={searchQuery} on:input={e => (searchQuery = e.detail)} /> <div class="modal-content">
<InputSearch value={searchQuery} on:input={e => (searchQuery = e.detail)} />
<ModalContainer> <ModalContainer>
{#each resultNotes as result, i} {#each resultNotes as result, i}
<ResultItemVault <ResultItemVault
selected={i === selectedIndex} selected={i === selectedIndex}
note={result} note={result}
on:mousemove={e => (selectedIndex = i)} on:mousemove={e => (selectedIndex = i)}
on:click={onClick} /> on:click={onClick} />
{/each} {/each}
{#if !resultNotes.length && searchQuery} {#if !resultNotes.length && searchQuery}
<center> We found 0 result for your search here. </center> <center> We found 0 result for your search here. </center>
{/if} {/if}
</ModalContainer> </ModalContainer>
</div>
<div class="prompt-instructions"> <div class="prompt-instructions">
<div class="prompt-instruction"> <div class="prompt-instruction">

4
src/modals.ts
View File

@@ -9,13 +9,13 @@ abstract class OmnisearchModal extends Modal {
constructor(app: App) { constructor(app: App) {
super(app) super(app)
// Remove all the default modal's children (except the close button) // Remove all the default modal's children
// so that we can more easily customize it // so that we can more easily customize it
const closeEl = this.containerEl.find('.modal-close-button') const closeEl = this.containerEl.find('.modal-close-button')
this.modalEl.replaceChildren() this.modalEl.replaceChildren()
this.modalEl.append(closeEl) this.modalEl.append(closeEl)
this.modalEl.addClass('omnisearch-modal', 'prompt') this.modalEl.addClass('omnisearch-modal', 'prompt')
this.modalEl.removeClass('modal') // this.modalEl.removeClass('modal')
this.modalEl.tabIndex = -1 this.modalEl.tabIndex = -1
// Setup events that can be listened through the event bus // Setup events that can be listened through the event bus